Android ExpandableListView Kullanımı

 

Merhaba dostlar, bugün Android‘de genişletilebilir (açılıp kapanabilir) listview kullanımı hakkında konuşacağız. Hemen başlayalım.

Öncelikle bu özelliğin kullanım senaryosunu anlatalım; örneğin uzun bir liste göstermek istiyorsunuz, bu listedeki elemanların alt elemanları mevcut ve bu alt elemanların, ana elemana tıklandığında açılmasını ve gözükmesini istiyorsunuz, o zaman projemizde ExpandableListView kullanmak tam olarak yapmamız gereken şey olacaktır. Ufak bir proje örneğini github hesabımda bulabilirsiniz.

Şimdi buna nasıl ulaşacağımızı adım adım konuşmaya başlayalım.

 

1. ExpandableListView widget’ını istenilen layout’a eklemek

Genişletilebilir ListView‘i eklemek istediğimiz layout dosyamızı açıyoruz ve içine widget kodlarımızı ekliyoruz.

 

activity_main.xml:





    

    




Yukarıda paylaştığım xml dosyasında ana layout olarak RelativeLayout ve içinde de sadece ExpandableListView widget’ımız mevcut, siz kendi projenize eklerken kendi şemanıza göre ExpandableLayout‘u eklemeniz yeterli olacaktır.

 

2. Liste Elemanları için xml dosyası oluşturmak

İkinci yapmamız gereken ise listemizde gözükecek elemanları tutacak layout‘u oluşturmak olacak. Bunun için projemiz içinde layout klasörüne sağ tıklamak ve new>Layout resource file diyerek yeni bir xml dosyası oluşturmak. Adını list_group.xml koyalım ve içini aşağıdaki gibi kodlayalım.

 

list_group.xml:







    




Elemanlarımızın isminin gözükeceği bir TextView oluşturduk. Birazdan üstlerine tıkladıklarında ortaya çıkacak olan alt elemanlarımızı tutacak layout’u da aynı şekilde ekleyeceğiz.

 

3. Alt Elemanlar için xml dosyası oluşturmak

Bir üst aşamada yaptığımız gibi yeni bir Layout resource file daha oluşturalım ve adını list_item koyalım.

 

list_item.xml:









 

4. Genişletilebilir ListView için Adaptör oluşturmak

Bu aşamada ise ExpandableListView widget’ımız için fonksiyonlarını tanımladığımız ExpandableListAdaptor sınıfımızı oluşturacağız.

 

ExpandableListAdaptor.java:

package com.example.akilinc.expandablelistview;

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;

public class ExpandableListAdapter extends BaseExpandableListAdapter {

    private Context context;
    private List listDataHeader;
    private HashMap<String, List> listHashMap;


    public ExpandableListAdapter(Context context, List listDataHeader, HashMap<String, List> listHashMap) {

        this.context = context;
        this.listDataHeader = listDataHeader;
        this.listHashMap = listHashMap;
    }

    @Override
    public int getGroupCount() {

        return listDataHeader.size();
    }

    @Override
    public int getChildrenCount(int groupPosition) {

        return listHashMap.get(listDataHeader.get(groupPosition)).size();
    }

    @Override
    public Object getGroup(int groupPosition) {

        return listDataHeader.get(groupPosition);
    }

    @Override
    public Object getChild(int groupPosition, int childPosition) {
        return listHashMap.get(listDataHeader.get(groupPosition)).get(childPosition);
    }

    @Override
    public long getGroupId(int groupPosition) {

        return groupPosition;
    }

    @Override
    public long getChildId(int groupPosition, int childPosition) {
        return childPosition;
    }

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

    @Override
    public View getGroupView(int groupPosition, boolean isExpanded, View convertView, ViewGroup parent) {

        String headerTitle = (String) getGroup(groupPosition);

        if (convertView == null){

            LayoutInflater inflater = (LayoutInflater)this.context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = inflater.inflate(R.layout.list_group, null);
        }

        TextView lblListHeader = convertView.findViewById(R.id.lblListHeader);
        lblListHeader.setTypeface(null, Typeface.BOLD);
        lblListHeader.setText(headerTitle);

        return convertView;
    }

    @Override
    public View getChildView(int groupPosition, int childPosition, boolean isLastChild, View convertView, ViewGroup parent) {

        final String childText = (String) getChild(groupPosition, childPosition);

        if (convertView == null){

            LayoutInflater inflater = (LayoutInflater)this.context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = inflater.inflate(R.layout.list_item, null);
        }

        TextView txtListChild = convertView.findViewById(R.id.lblListItem);
        txtListChild.setText(childText);
        return convertView;
    }

    @Override
    public boolean isChildSelectable(int groupPosition, int childPosition) {

        return true;
    }
}

 

5. Main sınıfımızda ListView elemanlarını tanımlamak

Son aşamamız ise Listemizde görmek istediğimiz elemanları ve listeyi genişlettiğimizde görmek istediğimiz elemanları tanımlamak olacak.

 

MainActivity.java:

 

public class MainActivity extends AppCompatActivity {

    private ExpandableListView listView;
    private ExpandableListAdapter listAdapter;
    private List listDataHeader;
    private HashMap<String, List> listHash;

    @Override
    protected void onCreate(Bundle savedInstanceState) {

        //size ait kodlar.
        ...        

        //ExpandableListView tanımı ve verileri alma
        listView = findViewById(R.id.lvExp);
        initData();
        listAdapter = new ExpandableListAdapter(this, listDataHeader, listHash); //ExpandableListAdapter adaptörümüzden nesnemizi 
                                                                                 //oluşturduk.
        listView.setAdapter(listAdapter);

        ...
        //daha fazla size ait kod.
    }

    //listview elemanlarımızı eklediğimiz kısım
    private void initData() {

        listDataHeader = new ArrayList<>();   //Ana elemanlar için yeni bir ArrayList oluşturduk.
        listHash = new HashMap<>();           //HashMap oluşturduk.

        listDataHeader.add("Dell XPS 15");     //ArrayList'e yani ana kategorilere eleman ekledik.
        listDataHeader.add("Dell Alienware 15");

        List pc = new ArrayList<>();   //Alt elemanlar için yeni bir ArrayList oluşturduk.
        pc.add("15");                          //Ana Elemanların alt elemanlarını bu List'e ekledik
        pc.add("i7 7700HQ İşlemci");
        pc.add("16 GB DDR4 Ram");
        pc.add("GTX1050 Ekran Kartı");
        pc.add("512 GB SSD");
        pc.add("10.319 TL");

        List pc1 = new ArrayList<>();  //Aynı şekilde ikinci Ana elemanımız için alt elemanları ekledik.
        pc1.add("15");
        pc1.add("i7 7700HQ İşlemci");
        pc1.add("16 GB DDR4 Ram");
        pc1.add("GTX1060 Ekran Kartı");
        pc1.add("1TB HDD + 512 GB SSD");
        pc1.add("12.500 TL");


        listHash.put(listDataHeader.get(0), pc);   //HashMap'e ana eleman ve alt eleman bağlantısını söyledik. 
                                                   //(Sıfırıncı ana eleman ın alt elemanları: pc adlı ArrayList)
        listHash.put(listDataHeader.get(1), pc1);
    }
}

 

En saf hali ile bir ExpandableListView örneği yapmış olduk dostlar, kendi projelerinize uyarlamada yardımcı olur umarım. Soru ve görüşleriniz için herhangi bir iletişim aracı ile bana ulaşabilirsiniz. İyi günler diliyorum.

ahmet

Ahmet Kılınç - Software Developer

Bunlar da hoşunuza gidebilir...

4 Cevaplar

  1. Salih dedi ki:

    Çok büyük faydası oldu, bu güzel paylaşım için teşekkür ederim.

  2. Alper dedi ki:

    Android studioda Expandable List’i bulamıyorum yardımcı olur musunuz?

    • ahmet dedi ki:

      Merhaba,

      widget olarak arıyorsanız o panelde gözükmeyebilir ama xml (layout) dosyanızın kod kısmına direk ekleyerek expandablelistview’i kullanabilirsiniz.

      iyi günler dilerim.

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

This site uses Akismet to reduce spam. Learn how your comment data is processed.