By this post, I would like to introduce GridViewWithHeaderAndFooter libary, one of most radically solution. With it, we can make header/footer views by calling above methods like ListView. This is DEMO VIDEO for tut output:
Declaring to use this libary by adding dependency to gradle. So, open local build.gradle (usally in app module after creating new project) and add this line:
compile 'in.srain.cube:grid-view-with-header-footer:1.0.12'Now, we will setup a main activity with only contain a GridView and show a grid of images. In activity layout, only include a "customizing GridView" and never forget to some it's important properties like android:stretchMode="columnWidth" and android:numColumns="auto_fit",...:
In activity programmatically code, now, adding header/footer views so simple with this GridView type. We can locate each view items and set vent for them like this code:
private void setGridViewHeaderAndFooter() {
LayoutInflater layoutInflater = LayoutInflater.from(this);
View headerView = layoutInflater.inflate(R.layout.layout_header, null, false);
View footerView = layoutInflater.inflate(R.layout.layout_footer, null, false);
//locate views
TextView headerText = (TextView)headerView.findViewById(R.id.text);
TextView footerText = (TextView)footerView.findViewById(R.id.text);
headerText.setText("GridView Header");
footerText.setText("GridView Footer");
headerView.setOnClickListener(onClickListener(0));
footerView.setOnClickListener(onClickListener(1));
gridView.addHeaderView(headerView);
gridView.addFooterView(footerView);
}
private View.OnClickListener onClickListener(final int i) {
return new View.OnClickListener() {
@Override
public void onClick(View v) {
if (i == 0) {
Toast.makeText(MainActivity.this, "Header Clicked!", Toast.LENGTH_SHORT).show();
} else {
Toast.makeText(MainActivity.this, "Footer Clicked!", Toast.LENGTH_SHORT).show();
}
}
};
}
Set data and adapter for GridView, we have full activity code:
package info.devexchanges.headerfootergridview;
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.TextView;
import android.widget.Toast;
import in.srain.cube.views.GridViewWithHeaderAndFooter;
public class MainActivity extends AppCompatActivity {
private GridViewWithHeaderAndFooter gridView;
private ArrayAdapter<Integer> adapter;
private Integer[] drawablesResource = {R.mipmap.a, R.mipmap.b, R.mipmap.c, R.mipmap.d, R.mipmap.f,
R.mipmap.e, R.mipmap.g, R.mipmap.h, R.mipmap.i, R.mipmap.j, R.mipmap.k};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
gridView = (GridViewWithHeaderAndFooter) findViewById(R.id.grid_view);
setGridViewHeaderAndFooter();
adapter = new GridViewAdapter(this, R.layout.item_grid, drawablesResource);
gridView.setAdapter(adapter);
}
@SuppressLint({"InflateParams", "SetTextI18n"})
private void setGridViewHeaderAndFooter() {
LayoutInflater layoutInflater = LayoutInflater.from(this);
View headerView = layoutInflater.inflate(R.layout.layout_header, null, false);
View footerView = layoutInflater.inflate(R.layout.layout_footer, null, false);
//locate views
TextView headerText = (TextView)headerView.findViewById(R.id.text);
TextView footerText = (TextView)footerView.findViewById(R.id.text);
headerText.setText("GridView Header");
footerText.setText("GridView Footer");
headerView.setOnClickListener(onClickListener(0));
footerView.setOnClickListener(onClickListener(1));
gridView.addHeaderView(headerView);
gridView.addFooterView(footerView);
}
private View.OnClickListener onClickListener(final int i) {
return new View.OnClickListener() {
@Override
public void onClick(View v) {
if (i == 0) {
Toast.makeText(MainActivity.this, "Header Clicked!", Toast.LENGTH_SHORT).show();
} else {
Toast.makeText(MainActivity.this, "Footer Clicked!", Toast.LENGTH_SHORT).show();
}
}
};
}
}
Create an own GridView adapter based on ArrayAdapter, give a ViewHolder class to scroll smoother:
package info.devexchanges.headerfootergridview;
import android.app.Activity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
public class GridViewAdapter extends ArrayAdapter<Integer> {
private Activity activity;
private Integer[] drawablesResource;
public GridViewAdapter(Activity context, int resource, Integer[] objects) {
super(context, resource, objects);
this.activity = context;
this.drawablesResource = objects;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder;
LayoutInflater inflater = (LayoutInflater) activity.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
// If holder not exist then locate all view from UI file.
if (convertView == null) {
// inflate UI from XML file
convertView = inflater.inflate(R.layout.item_grid, parent, false);
// get all UI view
holder = new ViewHolder(convertView);
// set tag for holder
convertView.setTag(holder);
} else {
// if holder created, get tag from view
holder = (ViewHolder) convertView.getTag();
}
//set drawable to imageview
holder.imageView.setImageResource(getItem(position));
return convertView;
}
private class ViewHolder {
private ImageView imageView;
public ViewHolder(View v) {
imageView = (ImageView) v.findViewById(R.id.img);
}
}
}
And layout for each GridView item, only include an ImageView:
Our result after running app:
