GridView

Step 1: Start an android project.

Step 2: Open the strings.xml file and write the following code

<resources>
    <string name="app_name">GridView demo</string>
    <integer-array name="emojiImages">
        <item>@drawable/emoji_a</item>
        <item>@drawable/emoji_b</item>
        <item>@drawable/emoji_c</item>
        <item>@drawable/emoji_d</item>
        <item>@drawable/emoji_e</item>
        <item>@drawable/emoji_f</item>
        <item>@drawable/emoji_g</item>
        <item>@drawable/emoji_h</item>
        <item>@drawable/emoji_i</item>
        <item>@drawable/emoji_j</item>
    </integer-array>

    <string-array name="emoji_desc">
        <item>Happy</item>
        <item>What?</item>
        <item>Cool</item>
        <item>Lol</item>
        <item>Haha</item>
        <item>Haha</item>
        <item>Blessing</item>
        <item>Amazing</item>
        <item>Good luck</item>
        <item>All emoji</item>
    </string-array>
</resources>

Step 3: Design the form (activity_main.xml ) as shown in the video.

activity_main.xml file

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    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"
    tools:context=".MainActivity">

    <GridView
        android:id="@+id/GridViewDemo"
        android:layout_width="411dp"
        android:layout_height="623dp"
        android:gravity="center"
        android:horizontalSpacing="10dp"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:verticalSpacing="10dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />
    
</androidx.constraintlayout.widget.ConstraintLayout>

Step 4: Create a new java class namely  ImageAdapter.java file and write the following code.

package com.example.part_a7_gridview;

import android.content.Context;
import android.content.res.TypedArray;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.ListAdapter;

public class ImageAdapter extends BaseAdapter {
    private Context mContext;

    public ImageAdapter(Context c) {
        mContext = c;
    }

    public int getCount() {
        return thumbImages.length;
    }
    public Object getItem(int position) {
        return null;
    }
    public long getItemId(int position) {
        return 0;
    }

    // create a new ImageView for each item referenced by the Adapter
    public View getView(int position, View convertView, ViewGroup parent) {
        ImageView imageView = new ImageView(mContext);
        imageView.setLayoutParams(new GridView.LayoutParams(200, 200));
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        //imageView.setPadding(8, 8, 8, 8);

        imageView.setImageResource(thumbImages[position]);//Working
        return imageView;
    }
    //Working
    public Integer[] thumbImages = {
            R.drawable.emoji_a, R.drawable.emoji_b,
            R.drawable.emoji_c, R.drawable.emoji_d,
            R.drawable.emoji_e, R.drawable.emoji_f,
            R.drawable.emoji_g, R.drawable.emoji_h,
            R.drawable.emoji_i, R.drawable.emoji_j,
    };
}

Step 5: Open MainActivity.java file and write the following code.

package com.example.part_a7_gridview;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final String[] emoji_desc=getResources().getStringArray(R.array.emoji_desc);
        GridView gv=(GridView)findViewById(R.id.GridViewDemo);
        gv.setAdapter(new ImageAdapter(this));

        gv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                Toast.makeText(MainActivity.this, "Clicked on emoji: " + emoji_desc[position], Toast.LENGTH_SHORT).show();
            }
        });
    }
}

Step 6: Run the project