Pertanyaan Bagaimana cara menambahkan bagian pemisah / pembagi ke ListView?


Saat ini saya membuat menu untuk aplikasi saya, menggunakan DrawerLayout dan subclass ArrayAdapter untuk mencapai sesuatu yang tampak seperti menu laci Facebook.

Saat ini saya tidak memiliki masalah dalam membuat daftar, tetapi sekarang terlihat bagus, saya ingin menambahkan pemisah antara berbagai jenis opsi (yaitu opsi yang terkait dengan aplikasi dan aplikasi) dan bilah pencarian di bagian atas menu.

Kode subclass ArrayAdaptor saya saat ini adalah sebagai berikut:

public class DrawerMenuAdapter extends ArrayAdapter<String>{
    private Context context;
    private String[] values;
    private int resId;

    public DrawerMenuAdapter(Context context, int textViewResourceId, String[] values) {
        super(context, textViewResourceId, values);
        this.context = context;
        this.values = values;
        this.resId = textViewResourceId;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent){
        LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View rowView = inflater.inflate(this.resId, parent, false);

        TextView elementText = (TextView)rowView.findViewById(R.id.element_text);
        ImageView elementImage = (ImageView)rowView.findViewById(R.id.element_icon);
        String textValue = values[position];

        elementText.setText(textValue);

        //This switch adds the icons to the related elements
        switch (position){
            case 0:
                elementImage.setImageResource(R.drawable.search);
                break;
            case 1:
                elementImage.setImageResource(R.drawable.facebook_friends);
                break;
            case 2:
                elementImage.setImageResource(R.drawable.flirts_history);
                break;
            case 3:
                elementImage.setImageResource(R.drawable.premium);
                break;
            case 4:
                elementImage.setImageResource(R.drawable.settings);
                break;
            case 5:
                elementImage.setImageResource(R.drawable.share_app);
                break;
            case 6:
                elementImage.setImageResource(R.drawable.cgu);
                break;
        }


        return rowView;
    }
}

Saya berasumsi bahwa saya harus mengesampingkan fungsi yang mengisi ListView dengan memanggil fungsi getView, tetapi saya tidak dapat menemukan fungsi itu.


32
2017-08-18 18:42


asal


Jawaban:


Jika Anda ingin sederhana bagian dalam ListView Anda, lihat tutorial ini:

http://cyrilmottier.com/2011/07/05/listview-tips-tricks-2-section-your-listview/

atau tutorial ini:

http://bartinger.at/listview-with-sectionsseparators/

Yang kedua tidak begitu rinci, tetapi mungkin lebih mudah dipahami / disimpan lebih sederhana.

Ide dasarnya adalah Anda membuat ListAdapter Anda memiliki berbagai macam tampilan berbeda. Misalnya dua Tampilan berbeda di mana satu jenis adalah item daftar sebenarnya yang menampilkan informasi, dan jenis lainnya dari Tampilan sebagai Pembagi bagian.

Dari tutorial:

ListViews dan lebih spesifik Adaptor dapat menangani beberapa jenis Views. Jika Anda melihat antarmuka Adaptor Anda akan melihat itu berisi dua metode spesifik:

  • getViewTypeCount() yang mengembalikan jumlah jenis Tampilan Anda AdapterView mengelola. Sebagian besar waktu metode ini mengembalikan 1 karena semua item dari ListView serupa. Dalam hal ini, dengan mengembalikan 2, ListView akan menangani dua jenis Tampilan: Tampilan item reguler dan Tampilan pemisah
  • getItemViewType(int) harus mengembalikan bilangan bulat antara 0 (inklusif) dan getViewTypeCount() (eksklusif). Nomor yang diberikan mengekspresikan tipe Tampilan pada posisi tertentu. Misalnya, kita dapat memastikan nilai yang dikembalikan adalah 0 untuk Tampilan item reguler dan 1 untuk pemisah

37
2017-08-18 18:47



Saya menambahkan jawaban di sini karena saya sudah menemukan cara lain untuk ini. Sepertinya sedikit mirip dengan tautan yang diposting @Phil.

Pertama saya mengatur array string dari menu yang ingin saya tampilkan. Saya telah menulis array ini dalam file sumber daya XML untuk kenyamanan pribadi.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array
            name="drawer_menu_options">
        <item>Username</item>
        <item>-sep-Flirter</item>
        <item>Recherche</item>
        <item>Amis Facebook</item>
        <item>Flirts</item>
        <item>Compte premium</item>
        <item>-sep-Menu</item>
        <item>Réglages</item>
        <item>Inviter des amis</item>
        <item>CGU</item>
    </string-array>
</resources>

Perhatikan bahwa saya memiliki dua elemen menggunakan awalan -sep-. Ini akan menjadi pemisah kita.

Kemudian muncul DrawerMenuAdapter yang saya tunjukkan sebelumnya, yang masih merupakan ArrayAdapter, di mana saya menambahkan beberapa fungsi:

public class DrawerMenuAdapter extends ArrayAdapter<String>{
    private Context context;
    private String[] values;
    private int resId;
    private int separatorId = 0;
    private int userbarId = 0;

    public DrawerMenuAdapter(Context context, int textViewResourceId, String[] values) {
        super(context, textViewResourceId, values);
        this.context = context;
        this.values = values;
        this.resId = textViewResourceId;
    }

    public void setSeparator(int resId){
        separatorId = resId;
    }

    public void setUserbarId(int resId){
        userbarId = resId;
    }

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

        LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        if(userbarId != 0 && values[position].equals("Username")){
            rowView = inflater.inflate(this.userbarId, parent, false);

        }else if(separatorId != 0 && values[position].startsWith("-sep-")){
            rowView = inflater.inflate(this.separatorId, parent, false);

        }else{
            rowView = inflater.inflate(this.resId, parent, false);
        }

        TextView elementText = (TextView)rowView.findViewById(R.id.element_text);
        String textValue = values[position];

        /* If the current line is a separator, just display a separator. Otherwise, set the
        matching picture
         */
        if(textValue.startsWith("-sep-")){
            elementText.setText(textValue.substring("-sep-".length()));

        }else{
            if(textValue.equals("Username")){
                elementText.setText(context.getSharedPreferences("LovRUserSettings", 0)
                        .getString("firstName", "Username"));
            }else{
                elementText.setText(textValue);
            }
            ImageView elementImage = (ImageView)rowView.findViewById(R.id.element_icon);
            switch (position){
                case 2:
                    elementImage.setImageResource(R.drawable.search);
                    break;
                case 3:
                    elementImage.setImageResource(R.drawable.facebook_friends);
                    break;
                case 4:
                    elementImage.setImageResource(R.drawable.flirts_history);
                    break;
                case 5:
                    elementImage.setImageResource(R.drawable.premium);
                    break;
                case 7:
                    elementImage.setImageResource(R.drawable.settings);
                    break;
                case 8:
                    elementImage.setImageResource(R.drawable.share_app);
                    break;
                case 9:
                    elementImage.setImageResource(R.drawable.cgu);
                    break;
            }
        }


        return rowView;
    }
}

Dalam kode ini, ada objek yang disebut userBar. Anda tidak perlu memperhatikan hal ini tetapi jika Anda tertarik, itu adalah elemen menu lainnya, menggunakan file tata letak spesifik daripada yang saya gunakan untuk elemen menu biasa. Ini adalah cara untuk menunjukkan bahwa Anda dapat menambahkan tata letak spesifik apa pun di mana pun yang Anda inginkan, hanya dengan membaca string Anda.

Titik utama di sini adalah cara pencarian kode untuk pemisah, string dengan -sep-awalan. Setelah satu ditemukan, awalan dihapus, dan tata letak yang cocok dikaitkan dengan pemisah.

Aight, itulah yang saya temukan. Setelah ini, Anda harus menemukan cara Anda sendiri untuk menambahkan pendengar klik. Tambang diimplementasikan dalam DrawerLayout.setOnCliclListener yang pada dasarnya melakukan pekerjaan dengan cara yang persis sama seperti yang dikatakan dokumentasi Google. Tetapi Anda juga bisa menggunakannya setOnclickListenerke tampilan Anda saat Anda menambahkannya, dan gunakan file XML tempat Anda dapat mengaturnya sendiri onClick atribut ...

Semoga itu akan membantu =)


7
2017-08-19 21:36