Can a GridView have a footer and header just like ListView?

Question

A quick question:

In ListView I use this code:

list.addHeaderView(headerView);

How to deal with it when working on

Answer 1

You'd have to use a ListView, then make each row of the list look like it's actually a row of a grid. So if you have a 3 column grid, you'd make a layout for the ListView that looks like 3 columns. You'd then have to modify certain aspects of the Adapter to make it work so that each ListView row actually represents 3 lines of data -- so you know, getCount()/3 type stuff.

Answer 2

You can use this. The footer appears/hides at the bottom of the grid when you reach/leave the last number of items. It does not actually scroll, but I hardly notice the difference.

In your activity/fragment's onCreate/onCreateView you add an OnScrollListener to the GridView:

    ....
    GridView gridview = (YMAnimatedGridview) v.findViewById(R.id.my_gridview);
    gridview.setAdapter(adapter);
    final View footerView = mainView
            .findViewById(R.id.my_grid_footer_view);
    gridview.setOnScrollListener(new GridView.OnScrollListener() {

        @Override
        public void onScroll(AbsListView view, int firstVisibleItem,
                int visibleItemCount, int totalItemCount) {

                if (firstVisibleItem + visibleItemCount == totalItemCount) {

                    // last item in grid is on the screen, show footer:
                    footerView.setVisibility(View.VISIBLE);

                } else if (footerView.getVisibility() != View.GONE) {

                    // last item in grid not on the screen, hide footer:
                    footerView.setVisibility(View.GONE);
                }
            }

        @Override
        public void onScrollStateChanged(AbsListView view,
                int scrollState) {
        }
    });

Your layout should look something like the below. Notice the layout_weight (and layout_height) parameter in the gridview, it is needed to make the correct space for the footer when it becomes visible.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <GridView
        android:id="@+id/my_gridview"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:columnWidth="160dp"
        android:gravity="center_horizontal"
        android:horizontalSpacing="12dp"
        android:numColumns="auto_fit"
        android:layout_weight="1"
        android:stretchMode="columnWidth"
        android:verticalSpacing="6dp" />

    <TextView
        android:id="@+id/my_grid_footer_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:layout_marginBottom="8dp"
        android:orientation="horizontal"
        android:visibility="gone"
        android:text="footer text here" >
    </TextView>
</LinearLayout>

Answer 3

Why don't you change the appearance of the cells for the first rows? if you know how many columns you have, you know how many items will appear in the header = number of columns.It works for me

Answer 4

Sample code:

GridViewWithHeaderAndFooter gridView = (GridViewWithHeaderAndFooter) v.findViewById(R.id.ly_image_list_grid);

LayoutInflater layoutInflater = LayoutInflater.from(this);
View headerView = layoutInflater.inflate(R.layout.test_header_view, null);
View footerView = layoutInflater.inflate(R.layout.test_footer_view, null);
gridView.addHeaderView(headerView);
gridView.addFooterView(footerView);

Gradle build: .

compile 'in.srain.cube:grid-view-with-header-footer:1.0.12'

Answer 5

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent"
              android:layout_height="fill_parent" android:orientation="vertical">

    <com.test.Breadcrumbs android:layout_width="fill_parent" android:layout_height="100dp" />

    <GridView
            android:id="@+id/grid"
            android:numColumns="auto_fit"
            android:gravity="center"
            android:stretchMode="columnWidth"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:verticalSpacing="10dp"
            android:horizontalSpacing="10dp">
    </GridView>

</LinearLayout>

and Breadcrumbs:

public class Breadcrumbs extends LinearLayout {

    public Breadcrumbs(final Context context, final AttributeSet attrs) {
        super(context, attrs);

        final LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        layoutView = inflater.inflate(R.layout.breadcrumbs, this, true);

works fine, scroll for grid works as well.

Answer 6

How about checking for the "0" index element in your adapter? You can inflate the custom view for the first one.

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    View view = convertView;
            if(view==null){
                 if(position==0){
                      //  ...inflate header view
                 }else{
                      //  ...do as usual

Haven't tested it, but should work.