Android ऐप में GridView लेआउट कैसे बनाएं?

Android में GridView और कस्टम एडाप्टर के साथ ग्रिड लेआउट

यह उदाहरण दर्शाता है कि GridView और कस्टम BaseAdapter का उपयोग करके इमेज और टेक्स्ट का ग्रिड लेआउट कैसे बनाया जाए।

चरण 1: नया प्रोजेक्ट बनाएं

Android Studio में File → New Project चुनें।

चरण 2: मेन लेआउट (`res/layout/activity_main.xml`)

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

    <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="2"
        android:verticalSpacing="10dp"
        android:horizontalSpacing="10dp"
        android:stretchMode="columnWidth"
        android:gravity="center"/>

</RelativeLayout>

चरण 3: build.gradle में निर्भरता जोड़ें

dependencies {
    implementation 'com.android.support:gridlayout-v7:28.0.0'
    // अन्य निर्भरताएं...
}

चरण 4: रो आइटम लेआउट (`res/layout/rowitem.xml`)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="16dp"
    android:gravity="center">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:scaleType="centerCrop"/>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Numbers"
        android:textSize="18sp"
        android:layout_marginTop="8dp"
        android:gravity="center"/>

</LinearLayout>

चरण 5: कस्टम एडाप्टर (`MainAdapter.java`)

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

public class MainAdapter extends BaseAdapter {

    private Context context;
    private LayoutInflater layoutInflater;
    private String[] numbersInWords;
    private int[] numberImages;

    public MainAdapter(Context context, String[] numbersInWords, int[] numberImages) {
        this.context = context;
        this.numbersInWords = numbersInWords;
        this.numberImages = numberImages;
        this.layoutInflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        return numbersInWords.length;
    }

    @Override
    public Object getItem(int position) {
        return numbersInWords[position];
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;

        if (convertView == null) {
            convertView = layoutInflater.inflate(R.layout.rowitem, parent, false);
            holder = new ViewHolder();
            holder.imageView = convertView.findViewById(R.id.imageView);
            holder.textView = convertView.findViewById(R.id.textView);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        holder.imageView.setImageResource(numberImages[position]);
        holder.textView.setText(numbersInWords[position]);

        return convertView;
    }

    // ViewHolder पैटर्न परफॉर्मेंस के लिए
    static class ViewHolder {
        ImageView imageView;
        TextView textView;
    }
}

चरण 6: MainActivity (`src/MainActivity.java`)

import android.support.v7.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 {

    private GridView gridView;
    private String[] numberInWords = {"One", "Two", "Three", "Four", "Five", 
                                       "Six", "Seven", "Eight", "Nine", "Ten"};
    private int[] numberImages = {R.drawable.one, R.drawable.two, R.drawable.three,
                                   R.drawable.four, R.drawable.five, R.drawable.six,
                                   R.drawable.seven, R.drawable.eight, R.drawable.nine,
                                   R.drawable.ten};

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

        gridView = findViewById(R.id.gridView);
        
        MainAdapter adapter = new MainAdapter(this, numberInWords, numberImages);
        gridView.setAdapter(adapter);

        gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView parent, View view, int position, long id) {
                Toast.makeText(getApplicationContext(), 
                    "क्लिक किया: " + numberInWords[position], Toast.LENGTH_SHORT).show();
            }
        });
    }
}

चरण 7: AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android"
    package="app.com.sample">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">

        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

    </application>
</manifest>

💡 आधुनिक विकल्प: नए प्रोजेक्ट्स के लिए RecyclerView के साथ GridLayoutManager उपयोग करने की सलाह दी जाती है, जो अधिक लचीला और परफॉर्मेंट है।