Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Change the behaviour of a GridView to make it scroll horizontally rather than vertically

I want to make a UI element like a GridView, I want it's complete functionality but want it to be horizontally scrollable rather than vertically.

By horizontal scroll I mean it should be built that way and not put in a HorizontalScrollView.

My would be Custom GridView will have fixed number of rows say 4-5 and the columns should be extensible based on number of items in the Adapter. You can think of it as the opposite of what the native GridView does, yet it should maintain the functionality.

I have looked at the source code of how a GridView is implemented by Google, but I am able to understand very less and starting to make the View from scratch doesn't seem to be a good idea, since I am afraid I will not be able to do justice to memory optimization's the way Google did it.

I had observed that GridView extends AbsListView, so my question is, is it AbsListView which lets a GridView scroll vertically and add items from the adapter, or is it GridView which adds the vertical scrolling ability? Should I tweak GridView or AbsListView?

It would be even better to know if there's something which already does what I want to do?

This has already been implemented in native Gallery and YouTube app of Android Honeycomb 3.1 and above. So if anyone has an idea, please elaborate.

Snapshot of Honeycomb Gallery app:

enter image description here

Snapshot of Honeycomb YouTube app:

enter image description here

like image 453
Arif Nadeem Avatar asked Jul 20 '12 10:07

Arif Nadeem


1 Answers

There is setRotation in API 11. You'll have to rotate the gridview by 90 degrees and child views by -90 degrees.

Documentation: http://developer.android.com/reference/android/view/View.html#setRotation(float)

Update:

To get a 3d effect on views following APIs would be useful

setCameraDistance(float) - set the z axis distance(depth)

setRotationX(float) - set the horizontal axis angle

setRotationY(float) - set the vertical axis angle

Set the camera distance to half of the screen height. Then set the rotationX based on the view's location on screen. The rotation angles should be something like (20, 10, 0, -10, -20) from left to right. Later you can play with rotationY angles to get some height perception.

Do all setting in extended GridView's overriden layout method.

@override
void layout(int t, int l, int r, int b) {
    super.layout(t, l, r, b);
    ...
    int columnStart = getFirstVisiblePosition()/no_of_columns;
    int columnEnd = getLastVisiblePosition()/no_of_columns;

    loop from 'columnStart' to 'columnEnd' 'no_of_colmns' times {
        // set the camera distance and rotationX to views
        // depending on the position of a view on screen.
    }
}
like image 199
Ronnie Avatar answered Nov 15 '22 05:11

Ronnie