androidgridviewscrollgallery

Bidircetional scroll for Android


This is more of a mass answer than a question, I just don't know how to post it as such, moderators if you could inform me if there even is such a thing.

This question was asked to death, and then I needed to do something similar so I work out this. The answer to this post is how to create a 3x3 Bidirectional Scroll View in android


Solution

  • The following is how to create a Bidirectional Scrolling View

    Place a gallery into a GridView with one column and column size set to fill the parent view (or something to that effect). Place a gallery into the GridView and set its height in LayoutParams to the height of the drawables/views you want to occupy them. All you need to do then is when one gallery is moved to move all the others in the grid view. I'll post the code below. Note: the code I did is a test of concept that works, I just tried it on my phone. As such however, it is not flashy. As I continue to work on It I may update the code to make it look nicer.

    ~Aedon :)

    This is a general answer to questions like: How to make a 2-dimension image gallery with both horizontal and vertical scrolling?

    GridView with horizontal scroll

    public class Test extends Activity {
    /** Called when the activity is first created. */
    GridView gv;
    Gallery g[] = new Gallery[3];
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        gv = (GridView)findViewById(R.id.gridview);
        gv.setAdapter(new GAdapter());
        for (int i = 0; i < g.length; i++) {
            g[i] = new Gallery(this);
            g[i].setAdapter(new GGAdapter());
            g[i].setOnTouchListener(new OnTouchListener() {
                @Override public boolean onTouch(View arg0, MotionEvent ev) {
                    if (ev.getAction() == MotionEvent.ACTION_UP) {
                        for (int j = 0; j < g.length; j++) {
                            g[j].setSelection(((AdapterView)arg0).getSelectedItemPosition());
                        }
                    }
                    return false;
                }
            });
        } 
    }
    
    private class GAdapter extends BaseAdapter {    
        public GAdapter() {}
        @Override public int getCount() {return g.length;}
        @Override public Object getItem(int pos) {return pos;}
        @Override public long getItemId(int pos) {return pos;}
        @Override public View getView(final int pos, View convertView, ViewGroup parent) {
    
            g[pos].setLayoutParams(new GridView.LayoutParams(gv.getWidth(), gv.getHeight()));           
            return g[pos];
        }
    }
    
    private class GGAdapter extends BaseAdapter {       
        int[] images = new int[] {R.drawable.icon,
                R.drawable.icon,
                R.drawable.icon};
        public GGAdapter() {}
        @Override public int getCount() {return images.length;}
        @Override public Object getItem(int pos) {return pos;}
        @Override public long getItemId(int pos) {return pos;}
        @Override public View getView(final int pos, View convertView, ViewGroup parent) {
            ImageView mIV = new ImageView(Test.this);
            mIV.setBackgroundResource(images[pos]);
            mIV.setLayoutParams(new Gallery.LayoutParams(gv.getWidth(), gv.getHeight()/3));         
            return mIV;
        }
    }
    

    }

    and my xml file:

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <GridView xmlns:android="http://schemas.android.com/apk/res/android" 
        android:id="@+id/gridview"
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent"
        android:numColumns="1"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        android:gravity="center"/>
     </LinearLayout>