Android GridView shows items in two-dimensional scrolling grid (rows & columns) and the grid items are not necessarily predetermined but they automatically inserted to the layout using a ListAdapter
An adapter actually bridges between UI components and the data source that fill data into UI Component. Adapter can be used to supply the data to like spinner, list view, grid view etc.
The ListView and GridView are subclasses of AdapterView and they can be populated by binding them to an Adapter, which retrieves data from an external source and creates a View that represents each data entry.
grid_view_android_example.xml :
Main xml file used in GridViewExample.java filexml version="1.0" encoding="utf-8"?> android:id="@+id/gridView1" android:numColumns="auto_fit" android:gravity="center" android:columnWidth="100dp" android:stretchMode="columnWidth" android:layout_width="fill_parent" android:layout_height="fill_parent" ></GridView>GridViewAndroidExample.java :
This is Main java file to create gridview object and set Custom adapter to gridview.public class GridViewExample extends Activity {
GridView gridView;
// This Data show in grid ( Used by adapter )
static final String[ ] GRID_DATA = new String[] {
Windows" ,
"iOS",
"Android" ,
"Blackberry",
"Java" ,
"JQuery",
"Phonegap",
"SQLite",
"Thread" ,
"Video"
};
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView( R.layout.grid_view_android_example );
// Get gridview object from xml file
gridView = (GridView) findViewById(R.id.gridView1);
// Set custom adapter (GridAdapter) to gridview
gridView.setAdapter( new GridAdapter( this, GRID_DATA ) );
gridView.setOnItemClickListener(new OnItemClickListener() {
public void onItemClick(AdapterView parent, View v,
int position, long id) {
Toast.makeText(
getApplicationContext(),
((TextView) v.findViewById( R.id.grid_item_label ))
.getText(), Toast.LENGTH_SHORT).show();
}
});
}
}
CustomGridAdapter.java :
Custom adapter to create each element in grid view.CustomGridAdapter extends BaseAdapter and override methods.
Depending upon passed array data , getview() method called each time and create gridview elements.
GridView elements show according to external grid_item.xml file. ( Defined below )
public class CustomGridAdapter extends BaseAdapter { private Context context; private final String[] gridValues; //Constructor to initialize values public CustomGridAdapter(Context context, String[ ] gridValues) { this.context = context; this.gridValues = gridValues; } @Override public int getCount() { // Number of times getView method call depends upon gridValues.length return gridValues.length; } @Override public Object getItem(int position) { return null; } @Override public long getItemId(int position) { return 0; } // Number of times getView method call depends upon gridValues.length public View getView(int position, View convertView, ViewGroup parent) { // LayoutInflator to call external grid_item.xml file LayoutInflater inflater = (LayoutInflater) context .getSystemService(Context.LAYOUT_INFLATER_SERVICE); View gridView; if (convertView == null) { gridView = new View(context); // get layout from grid_item.xml ( Defined Below ) gridView = inflater.inflate( R.layout.grid_item , null); // set value into textview TextView textView = (TextView) gridView .findViewById(R.id.grid_item_label); textView.setText(gridValues[position]); // set image based on selected text ImageView imageView = (ImageView) gridView .findViewById(R.id.grid_item_image); String arrLabel = gridValues[ position ]; if (arrLabel.equals("Windows")) { imageView.setImageResource(R.drawable.windows_logo); } else if (arrLabel.equals("iOS")) { imageView.setImageResource(R.drawable.ios_logo); } else if (arrLabel.equals("Blackberry")) { imageView.setImageResource(R.drawable.blackberry_logo); } else { imageView.setImageResource(R.drawable.android_logo); } } else { gridView = (View) convertView; } return gridView; }}grid_item.xml :
Grid view column elements will look according to grid_item.xml file. android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="5dp" > <ImageView android:id="@+id/grid_item_image" android:layout_width="50px" android:layout_height="50px" android:layout_marginRight="10px" android:src="@drawable/android_logo" > </ImageView> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:padding="0dp" android:orientation="vertical"> <TextView android:id="@+id/grid_item_label" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="" android:layout_marginTop="3px" android:textSize="15px" > </TextView> <TextView android:id="@+id/grid_item_label_static" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Example" android:layout_marginTop="3px" android:textSize="12px" /> </LinearLayout> </LinearLayout>