Adding header/footer to GridView

Question

I'm having a hard time to design a GridView layout with header and footer like this:

What I did is, create a ListView with just one item which is the GridView and add the header/footer using addHeaderView() and addFooterView() . The problem is that the GridView doesn't show the whole items. I've disabled the GridView scrolling using:

  gridview.setOnTouchListener(new View.OnTouchListener(){

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if(event.getAction() == MotionEvent.ACTION_MOVE){
                    return true;
                }
                return false;
            }

        });

Is there a way to show the make the GridView show all items? I've tried setting the height of the GridView to wrap_content but it doesn't work. Here is the layout for the GridView :

<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="2"
    android:background="@color/main_gray"
    android:verticalSpacing="10dp"
    android:horizontalSpacing="10dp"
    android:stretchMode="columnWidth"
    android:gravity="center">

</GridView>

I know it is not right to put gridview inside a listview but the client requested for this kind of layout..

Answer 1

Here is a good starting point :

https://android.googlesource.com/platform/packages/apps/Gallery2/+/idea133/src/com/android/photos/views/HeaderGridView.java

This class handles headers very well, exaclty the same way as ListView does.

You should manage to add footer handling as well, but it'a a bit more complicated, as you have to put placeholders depending on the number of elements you have in your Gridview . And as the height of a Gridview row is based on the height of its last element, you will have to get the height of the last item of your GridView

convertView.setVisibility(View.INVISIBLE);
convertView.setMinimumHeight(lastItemHeight);

I use this to calculate last item height. It's probably not optimal, but it works for my use cases :

View v = mAdapter.getView(adjPosition, convertView, parent);

//measure last item height for placeholders before footer views
v.setLayoutParams(new LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT));
v.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
                lastItemHeight = v.getMeasuredHeight();
lastItemHeight = v.getMeasuredHeight();

Answer 2

Check This Out Hope it Resolve Your Problem

    <LinearLayout
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal"
        android:background="#AAFFDD" >
    </LinearLayout>

    <GridView
        android:id="@+id/gridview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="0.97"
        android:background="@color/main_gray"
        android:gravity="center"
        android:horizontalSpacing="10dp"
        android:numColumns="2"
        android:stretchMode="columnWidth"
        android:verticalSpacing="10dp" >
    </GridView>

    <LinearLayout
        android:id="@+id/footer"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal"
        android:background="#FADFAE" >
    </LinearLayout>

</LinearLayout>

Answer 3

gridview 类不提供 addheaderview() 和 addfooterview() 方法，您可以采用垂直方向的线性布局，并且可以通过膨胀布局添加自定义标题，然后在该页脚视图之后膨胀 gridview 。