Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> Android

Android ऐप में मल्टी-लेवल ExpandableListView कैसे बनाएं?

परिचय

यह ट्यूटोरियल दर्शाता है कि Android में ExpandableListView का उपयोग करके दो-स्तरीय (ग्रुप → चाइल्ड) सूची कैसे बनाएं। हम खेल श्रेणियों (क्रिकेट, फुटबॉल, टेनिस) और उनके खिलाड़ियों का उदाहरण बनाएंगे।

आवश्यक चरण

चरण 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:padding="4dp"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ExpandableListView
        android:id="@+id/expendableList"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:divider="@android:color/background_light"
        android:dividerHeight="0.5dp" />

</RelativeLayout>

चरण 3: मुख्य गतिविधि (src/MainActivity.java)

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.ExpandableListAdapter;
import android.widget.ExpandableListView;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

public class MainActivity extends AppCompatActivity {
    ExpandableListView expandableListView;
    ExpandableListAdapter expandableListAdapter;
    List<String> expandableListTitle;
    HashMap<String, List<String>> expandableListDetail;

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

        expandableListView = findViewById(R.id.expendableList);
        expandableListDetail = ExpandableListData.getData();
        expandableListTitle = new ArrayList<>(expandableListDetail.keySet());

        expandableListAdapter = new CustomExpandableListAdapter(this, expandableListTitle, expandableListDetail);
        expandableListView.setAdapter(expandableListAdapter);

        // ग्रुप एक्सपैंड लिसनर
        expandableListView.setOnGroupExpandListener(new ExpandableListView.OnGroupExpandListener() {
            @Override
            public void onGroupExpand(int groupPosition) {
                Toast.makeText(getApplicationContext(),
                        expandableListTitle.get(groupPosition) + " सूची खुली",
                        Toast.LENGTH_SHORT).show();
            }
        });

        // ग्रुप कॉलैप्स लिसनर
        expandableListView.setOnGroupCollapseListener(new ExpandableListView.OnGroupCollapseListener() {
            @Override
            public void onGroupCollapse(int groupPosition) {
                Toast.makeText(getApplicationContext(),
                        expandableListTitle.get(groupPosition) + " सूची बंद हुई",
                        Toast.LENGTH_SHORT).show();
            }
        });

        // चाइल्ड क्लिक लिसनर
        expandableListView.setOnChildClickListener(new ExpandableListView.OnChildClickListener() {
            @Override
            public boolean onChildClick(ExpandableListView parent, View v, int groupPosition, int childPosition, long id) {
                String group = expandableListTitle.get(groupPosition);
                String child = expandableListDetail.get(group).get(childPosition);
                Toast.makeText(getApplicationContext(), group + " → " + child, Toast.LENGTH_SHORT).show();
                return false;
            }
        });
    }
}

चरण 4: डेटा क्लास (ExpandableListData.java)

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

class ExpandableListData {
    static HashMap<String, List<String>> getData() {
        HashMap<String, List<String>> expandableListDetail = new HashMap<>();

        List<String> myFavCricketPlayers = new ArrayList<>();
        myFavCricketPlayers.add("एम.एस. धोनी");
        myFavCricketPlayers.add("सहवाग");
        myFavCricketPlayers.add("शेन वॉटसन");
        myFavCricketPlayers.add("रिकी पोंटिंग");
        myFavCricketPlayers.add("शाहिद अफरीदी");

        List<String> myFavFootballPlayers = new ArrayList<>();
        myFavFootballPlayers.add("क्रिस्टियानो रोनाल्डो");
        myFavFootballPlayers.add("लियोनेल मेसी");
        myFavFootballPlayers.add("गैरेथ बेल");
        myFavFootballPlayers.add("नेमार जूनियर");
        myFavFootballPlayers.add("डेविड डी गेया");

        List<String> myFavTennisPlayers = new ArrayList<>();
        myFavTennisPlayers.add("रोजर फेडरर");
        myFavTennisPlayers.add("राफेल नडाल");
        myFavTennisPlayers.add("एंडी मरे");
        myFavTennisPlayers.add("नोवाक जोकोविच");
        myFavTennisPlayers.add("सानिया मिर्जा");

        expandableListDetail.put("क्रिकेट खिलाड़ी", myFavCricketPlayers);
        expandableListDetail.put("फुटबॉल खिलाड़ी", myFavFootballPlayers);
        expandableListDetail.put("टेनिस खिलाड़ी", myFavTennisPlayers);

        return expandableListDetail;
    }
}

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

package app.com.sample;

import android.content.Context;
import android.graphics.Typeface;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseExpandableListAdapter;
import android.widget.TextView;
import java.util.HashMap;
import java.util.List;
import java.util.Objects;

class CustomExpandableListAdapter extends BaseExpandableListAdapter {
    private Context context;
    private List<String> expandableListTitle;
    private HashMap<String, List<String>> expandableListDetail;

    CustomExpandableListAdapter(Context context, List<String> expandableListTitle,
                                HashMap<String, List<String>> expandableListDetail) {
        this.context = context;
        this.expandableListTitle = expandableListTitle;
        this.expandableListDetail = expandableListDetail;
    }

    @Override
    public Object getChild(int listPosition, int expandedListPosition) {
        return Objects.requireNonNull(this.expandableListDetail.get(this.expandableListTitle.get(listPosition)))
                .get(expandedListPosition);
    }

    @Override
    public long getChildId(int listPosition, int expandedListPosition) {
        return expandedListPosition;
    }

    @Override
    public View getChildView(int listPosition, final int expandedListPosition,
                             boolean isLastChild, View convertView, ViewGroup parent) {
        final String expandedListText = (String) getChild(listPosition, expandedListPosition);
        if (convertView == null) {
            LayoutInflater layoutInflater = (LayoutInflater) this.context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = Objects.requireNonNull(layoutInflater).inflate(R.layout.list_row, null);
        }
        TextView textView = convertView.findViewById(R.id.listTitle);
        textView.setText(expandedListText);
        return convertView;
    }

    @Override
    public int getChildrenCount(int listPosition) {
        return this.expandableListDetail.get(this.expandableListTitle.get(listPosition)).size();
    }

    @Override
    public Object getGroup(int listPosition) {
        return this.expandableListTitle.get(listPosition);
    }

    @Override
    public int getGroupCount() {
        return this.expandableListTitle.size();
    }

    @Override
    public long getGroupId(int listPosition) {
        return listPosition;
    }

    @Override
    public View getGroupView(int listPosition, boolean isExpanded, View convertView, ViewGroup parent) {
        String listTitle = (String) getGroup(listPosition);
        if (convertView == null) {
            LayoutInflater layoutInflater = (LayoutInflater) this.context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = Objects.requireNonNull(layoutInflater).inflate(R.layout.list_row, null);
        }
        TextView listTitleTextView = convertView.findViewById(R.id.listTitle);
        listTitleTextView.setTypeface(null, Typeface.BOLD);
        listTitleTextView.setText(listTitle);
        return convertView;
    }

    @Override
    public boolean hasStableIds() {
        return false;
    }

    @Override
    public boolean isChildSelectable(int listPosition, int expandedListPosition) {
        return true;
    }
}

चरण 6: लिस्ट रो लेआउट (list_row.xml)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/listTitle"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:padding="10dp"
        android:textColor="@android:color/black" />

</LinearLayout>

चरण 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>

ऐप चलाएं

डिवाइस कनेक्ट करें, Run क्लिक करें। ग्रुप पर टैप करके खोलें/बंद करें, चाइल्ड पर क्लिक करके टोस्ट देखें।

Android ऐप में मल्टी-लेवल ExpandableListView कैसे बनाएं? Android ऐप में मल्टी-लेवल ExpandableListView कैसे बनाएं?

महत्वपूर्ण बिंदु

  • ExpandableListView - दो-स्तरीय सूची के लिए बिल्ट-इन विजेट।
  • BaseExpandableListAdapter - कस्टम डेटा बाइंडिंग के लिए एक्सटेंड करें।
  • डेटा संरचना: List<String> ग्रुप टाइटल्स के लिए, HashMap<String, List<String>> चाइल्ड डेटा के लिए।
  • आधुनिक विकल्प: RecyclerView + Groupie लाइब्रेरी या नस्टेड RecyclerView।
  1. Android ऐप में पारदर्शी एक्टिविटी कैसे बनाएं? Android ऐप में पारदर्शी एक्टिविटी कैसे बनाएं?

    पारदर्शी (Translucent) एक्टिविटी बनाना यह उदाहरण दर्शाता है कि कस्टम थीम का उपयोग करके एक्टिविटी को पारदर्शी कैसे बनाएं, जिससे पिछली एक्टिविटी या होम स्क्रीन दिखती रहे। चरण 1: नया प्रोजेक्ट बनाएं Android Studio में File → New Project चुनें। चरण 2: styles.xml में पारदर्शी थीम <resources>

  1. एंड्रॉइड ऐप में TextToSpeech कैसे बनाएं? एंड्रॉइड ऐप में TextToSpeech कैसे बनाएं?

    एंड्रॉइड ऐप में टेक्स्ट-टू-स्पीच (TTS) लागू करना यह उदाहरण दिखाता है कि एंड्रॉइड ऐप में TextToSpeech फीचर कैसे जोड़ा जाता है, जिससे ऐप लिखे गए टेक्स्ट को आवाज़ में बदल सके। चरण 1: नया प्रोजेक्ट बनाएं Android Studio खोलें, File → New Project चुनें और आवश्यक विवरण भरकर नया प्रोजेक्ट बनाएं। चरण 2: ले

  1. Facebook पर Android ऐप कैसे बनाएं? Facebook पर Android ऐप कैसे बनाएं?

    Facebook Developer Console पर ऐप बनाकर App ID प्राप्त करने की चरण-दर-चरण प्रक्रिया। चरण 1: Facebook Developer Console पर ऐप बनाएं developers.facebook.com पर जाएं My Apps → Create App चुनें ऐप नाम और ईमेल दर्ज करें Create App ID पर क्लिक करें चरण 2: Android Studio में SDK जोड़ें प्रोजेक्ट-लेवल bu