In this article I am going to discuss about what is GridView , How to create GridView in android using ArrayAdapter ? and Android GridView example.

Android GridView is a ViewGroup which is used to show the elements in a two dimensional scrollable view. Android GridView is a subclass of AdapterView which shows the items in a two dimensional, scrollable grids (rows & columns) .

The best example of GridView is our android mobile’s Gallery that arrange the pictures and videos in a GridView fashion.

As similar to ListView, GridView is also a ViewGroup . GridView arranges the items in a two-dimensional, scrollable view. They can be inserted automatically into GridView using Adapter from an external source like Array, List etc.

Adapter :

Adapter works as an intermediate between external data source and gridview that bind the elements into the GridView. GridView items can be inserted into the layout using Adapters.

1. Create a New Project :

Create a new project in Android Studio from File ⇒ New Project and select Empty Activity from templates to implement GridView to your app .

2. Add GridView to your activity_main.xml or main layout

Add GridView to your layout resource file i.e activity_main.xml

<GridView
        android:id="@+id/grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="4"
        android:columnWidth="100dp"
        android:stretchMode="columnWidth"
        android:layout_centerInParent="true"/>

Now open res -> layout -> activity_main.xml  file and just implement the following xml code .

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <GridView
        android:id="@+id/grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="4"
        android:columnWidth="100dp"
        android:stretchMode="columnWidth"
        android:layout_centerInParent="true"/>

</RelativeLayout>

3. Now open your MainActivity.java and add following code :

Now create an instance of ArrayAdapter and setAdapter( ) to GridView to pull the items into the GridView .

MainActivity.java :

package net.technxt.gridview;

import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.GridView;

public class MainActivity extends AppCompatActivity {

    String[] date = {"1","2","3","4","5","6","7","8","9","10",
                    "11","12","13","14","15","16","17","18","19","20",
                    "21","22","23","24","25","26","27","28","29","30"};

    GridView grid;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        grid=(GridView)findViewById(R.id.grid);

        ArrayAdapter adapter = new ArrayAdapter(MainActivity.this,R.layout.support_simple_spinner_dropdown_item,date);
        grid.setAdapter(adapter);
        grid.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                Snackbar snack = Snackbar.make(view,"Item name : "+parent.getItemAtPosition(position),Snackbar.LENGTH_LONG);
                snack.show();
            }
        });


    }
}

Here when an item is selected, a Android SnackBar message will display the name of the item.

You can also customize the view of GridView using CustomAdpter which we will discuss in our next tutorial .

Now run the project/app to test GridView in android app through android device or any Emulator .

%d bloggers like this: