Android笔记本kotlinAndroid技术分享Android技术知识

仿QQ联系人可折叠列表

2018-11-30  本文已影响3人  莫语莫雨
QQ手机联系人有一个联系人列表折叠的功能,这个功能怎么实现的呢?其实很简单 Screenshot_2018-11-30-15-52-35-262_com.tencent.mo.png

实现步骤

1.使用系统控件ExpandableListView来实现这个功能,ExpandableListView是一个系统的可折叠控件

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

    <ExpandableListView
            android:id="@+id/qq_list"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>
</LinearLayout>

2.准备数据

 private fun setListData() {
        // 创建二个一级条目标题
        val title_1 = HashMap<String, String>()
        val title_2 = HashMap<String, String>()
        val title_3 = HashMap<String, String>()
        title_1["group"] = "林炳文"
        title_2["group"] = "文炳林"
        gruops.add(title_1)
        gruops.add(title_2)

        // 创建二级条目内容
        // 内容一
        val title_1_content_1 = HashMap<String, String>()
        val title_1_content_2 = HashMap<String, String>()
        val title_1_content_3 = HashMap<String, String>()
        title_1_content_1["child"] = "工人"
        title_1_content_2["child"] = "学生"
        title_1_content_3["child"] = "农民"

        val childs_1 = ArrayList<Map<String, String>>()
        childs_1.add(title_1_content_1)
        childs_1.add(title_1_content_2)
        childs_1.add(title_1_content_3)

        // 内容二
        val title_2_content_1 = HashMap<String, String>()
        val title_2_content_2 = HashMap<String, String>()
        val title_2_content_3 = HashMap<String, String>()
        title_2_content_1["child"] = "猩猩"
        title_2_content_2["child"] = "老虎"
        title_2_content_3["child"] = "狮子"
        title_2_content_3["child"] = "狮子"
        val childs_2 = ArrayList<Map<String, String>>()
        childs_2.add(title_2_content_1)
        childs_2.add(title_2_content_2)
        childs_2.add(title_2_content_3)

        childs.add(childs_1)
        childs.add(childs_2)

        setAdapter()
    }

3.准备条目布局文件

<LinearLayout
       xmlns:android="http://schemas.android.com/apk/res/android"
       android:orientation="vertical"
       android:layout_width="match_parent"
       android:layout_height="wrap_content">

   <TextView
           android:id="@+id/textGroup"
           android:layout_width="fill_parent"
           android:layout_height="fill_parent"
           android:paddingLeft="40dp"
           android:paddingTop="6dp"
           android:paddingBottom="6dp"
           android:textSize="25sp"
           android:text="No data"/>

</LinearLayout>
<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
      

    <TextView
            android:id="@+id/textChild"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingLeft="60dp"
            android:paddingTop="10dp"
            android:paddingBottom="10dp"
            android:textSize="20sp"
            android:text="No Data"
            />

</LinearLayout>

3.设置适配器

private fun setAdapter() {
        //创建ExpandableList的Adapter容器 参数:
        // 1.上下文
        // 2.一级集合
        // 3.一级样式文件
        // 4. 一级条目键值
        // 5.一级显示控件名
        // 6. 二级集合
        // 7. 二级样式
        // 8.二级条目键值
        // 9.二级显示控件名
        val simpleExpandableListAdapter = SimpleExpandableListAdapter(
            this,
            gruops,
            R.layout.groups,
            arrayOf("group"),
            intArrayOf(R.id.textGroup),
            childs,
            R.layout.childs,
            arrayOf("child"),
            intArrayOf(R.id.textChild)
        )
        qq_list.setAdapter(simpleExpandableListAdapter)
    }

4.搞定!是的你没有看错,这就搞定了(如果你还想进行自定义其他的布局文件,需要继承并自定义适配器,然后也同样的简单)


Screenshot_2018-11-30-15-57-43-280_com.clb.js.png

总结

完整的逻辑代码

class QQContactActivity : Activity() {
    var gruops = ArrayList<Map<String, String>>()
    var childs = ArrayList<List<Map<String, String>>>()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_qq_contact)
        setListData()
    }

    private fun setListData() {
        // 创建二个一级条目标题
        val title_1 = HashMap<String, String>()
        val title_2 = HashMap<String, String>()
        val title_3 = HashMap<String, String>()
        title_1["group"] = "林炳文"
        title_2["group"] = "文炳林"
        gruops.add(title_1)
        gruops.add(title_2)

        // 创建二级条目内容
        // 内容一
        val title_1_content_1 = HashMap<String, String>()
        val title_1_content_2 = HashMap<String, String>()
        val title_1_content_3 = HashMap<String, String>()
        title_1_content_1["child"] = "工人"
        title_1_content_2["child"] = "学生"
        title_1_content_3["child"] = "农民"

        val childs_1 = ArrayList<Map<String, String>>()
        childs_1.add(title_1_content_1)
        childs_1.add(title_1_content_2)
        childs_1.add(title_1_content_3)

        // 内容二
        val title_2_content_1 = HashMap<String, String>()
        val title_2_content_2 = HashMap<String, String>()
        val title_2_content_3 = HashMap<String, String>()
        title_2_content_1["child"] = "猩猩"
        title_2_content_2["child"] = "老虎"
        title_2_content_3["child"] = "狮子"
        title_2_content_3["child"] = "狮子"
        val childs_2 = ArrayList<Map<String, String>>()
        childs_2.add(title_2_content_1)
        childs_2.add(title_2_content_2)
        childs_2.add(title_2_content_3)

        childs.add(childs_1)
        childs.add(childs_2)

        setAdapter()
    }

    private fun setAdapter() {
        //创建ExpandableList的Adapter容器 参数:
        // 1.上下文
        // 2.一级集合
        // 3.一级样式文件
        // 4. 一级条目键值
        // 5.一级显示控件名
        // 6. 二级集合
        // 7. 二级样式
        // 8.二级条目键值
        // 9.二级显示控件名
        val simpleExpandableListAdapter = SimpleExpandableListAdapter(
            this,
            gruops,
            R.layout.groups,
            arrayOf("group"),
            intArrayOf(R.id.textGroup),
            childs,
            R.layout.childs,
            arrayOf("child"),
            intArrayOf(R.id.textChild)
        )
        qq_list.setAdapter(simpleExpandableListAdapter)
    }
}
上一篇下一篇

猜你喜欢

热点阅读