如何创建多层列表?

时间:2016-04-21 08:39:44

标签: android listview android-recyclerview material-design

我想创建一个带有divider的多个后续列表,如下所示:

Multi layer list

任何想法我该怎么做? 我熟悉简单的RecyclerView和ListView及其适配器,但仍然不理解这个列表背后的想法!

4 个答案:

答案 0 :(得分:1)

您需要覆盖recyclerview适配器的getItemViewType方法,并区分标头和常规项。然后在onCreateViewHolder上,根据类型扩展正确的布局。最后,如果需要它,ViewHolder本身也可以做类型特定的事情。

为了简化操作,您可以使用不同的布局作为视图类型,因为它们是整数。这是一个例子: https://github.com/urandom/gearshift/blob/master/gearshift/src/main/java/org/sugr/gearshift/ui/TorrentListMenuFragment.java#L1084

答案 1 :(得分:0)

您可以使用库SectionedRecyclerViewAdapter轻松实现此目的。您可以将项目分组为多个部分,并为每个部分添加标题:

class MySection extends StatelessSection {

    String title;
    List<String> list;

    public MySection(String title, List<String> list) {
        // call constructor with layout resources for this Section header and items 
        super(R.layout.section_header, R.layout.section_item);

        this.title = title;
        this.list = list;
    }

    @Override
    public int getContentItemsTotal() {
        return list.size(); // number of items of this section
    }

    @Override
    public RecyclerView.ViewHolder getItemViewHolder(View view) {
        // return a custom instance of ViewHolder for the items of this section
        return new MyItemViewHolder(view);
    }

    @Override
    public void onBindItemViewHolder(RecyclerView.ViewHolder holder, int position) {
        MyItemViewHolder itemHolder = (MyItemViewHolder) holder;

        // bind your view here
        itemHolder.tvItem.setText(list.get(position));
    }

    @Override
    public RecyclerView.ViewHolder getHeaderViewHolder(View view) {
        return new SimpleHeaderViewHolder(view);
    }

    @Override
    public void onBindHeaderViewHolder(RecyclerView.ViewHolder holder) {
        MyHeaderViewHolder headerHolder = (MyHeaderViewHolder) holder;

        // bind your header view here
        headerHolder.tvItem.setText(title);
    }
}

然后使用您的章节设置RecyclerView:

// Create an instance of SectionedRecyclerViewAdapter 
SectionedRecyclerViewAdapter sectionAdapter = new SectionedRecyclerViewAdapter();

// Create your sections with the list of data
MySection testSection = new MySection("Test Group", testList);
MySection commSection = new MySection("Communicate", commList);

// add your sections to the adapter
sectionAdapter.addSection(testSection);
sectionAdapter.addSection(commSection);

// Set up your RecyclerView with the SectionedRecyclerViewAdapter
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recyclerview);
recyclerView.setLayoutManager(new LinearLayoutManager(getContext()));
recyclerView.setAdapter(sectionAdapter);

在section_header.xml中,使用节标题和分隔符创建布局。在section_item.xml中,您可以创建项目图像和文本的布局。

答案 2 :(得分:0)

我做了这个我把它作为粗略草图,现在你只需要根据自己的喜好进行调整。希望它有所帮助!

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

<TextView
    android:padding="19dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="25sp"
    android:textAlignment="center"
    android:textColor="#000000"
    android:textStyle="bold"
    android:drawableStart="@drawable/ic_vulling"
    android:text="Import"
    android:id="@+id/textView1"
    android:layout_alignParentTop="true"
    android:layout_alignParentStart="true" />

<TextView
    android:padding="19dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="25sp"
    android:textColor="#000000"
    android:textAlignment="center"
    android:textStyle="bold"
    android:drawableStart="@drawable/ic_vulling"
    android:text="Gallery"
    android:id="@+id/textView2"
    android:layout_below="@+id/textView1"
    android:layout_alignParentStart="true" />

<TextView
    android:padding="19dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="25sp"
    android:textColor="#000000"
    android:textAlignment="center"
    android:textStyle="bold"
    android:drawableStart="@drawable/ic_vulling"
    android:text="Slideshow"
    android:id="@+id/textView3"
    android:layout_below="@+id/textView2"
    android:layout_alignParentStart="true" />

<TextView
    android:padding="19dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="25sp"
    android:textColor="#000000"
    android:textAlignment="center"
    android:textStyle="bold"
    android:drawableStart="@drawable/ic_vulling"
    android:text="Tools"
    android:id="@+id/textView4"
    android:layout_below="@+id/textView3"
    android:layout_alignParentStart="true"/>

<View android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="#000000"
    android:layout_alignBottom="@+id/textView4"
    android:layout_alignParentStart="true"
    android:id="@+id/view" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="30sp"
    android:text="Test Group"
    android:id="@+id/textView5"
    android:layout_below="@+id/view"
    android:layout_alignParentStart="true" />

<TextView
    android:padding="19dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="25sp"
    android:textColor="#000000"
    android:textAlignment="center"
    android:textStyle="bold"
    android:drawableStart="@drawable/ic_vulling"
    android:text="Test"
    android:id="@+id/textView6"
    android:layout_below="@+id/textView5"
    android:layout_alignParentStart="true"/>

<View android:layout_width="fill_parent"
    android:layout_height="1dp"
    android:background="#000000"
    android:id="@+id/view2"
    android:layout_alignBottom="@+id/textView6"
    android:layout_alignParentStart="true" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="30sp"
    android:text="Communicate"
    android:id="@+id/textView7"
    android:layout_below="@+id/view2"
    android:layout_alignParentStart="true" />

<TextView
    android:padding="19dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="25sp"
    android:textColor="#000000"
    android:textAlignment="center"
    android:textStyle="bold"
    android:drawableStart="@drawable/ic_vulling"
    android:text="Share"
    android:id="@+id/textView8"
    android:layout_below="@+id/textView7"
    android:layout_alignParentStart="true"/>

<TextView
    android:padding="19dp"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:textSize="25sp"
    android:textColor="#000000"
    android:textAlignment="center"
    android:textStyle="bold"
    android:drawableStart="@drawable/ic_vulling"
    android:text="Send"
    android:id="@+id/textView9"
    android:layout_below="@+id/textView8"
    android:layout_alignParentStart="true"/>

Example

答案 3 :(得分:0)

如果你想为导航抽屉创建这个,我会说看看this

菜单组使创建组非常简单,状态跟踪有助于更改所选选项的颜色