效果图

只能实现两层折叠。
image.png

属性简单介绍

  1. divider          :父布局之间的分割线样式
  2. childDivider     :子布局之间分割样式
  3. dividerHeight    :用于设置分割线的高度
  4. childIndicator    :用于设置子布局前显示的图标，不设置的话默认是没有图标的
  5. groupIndicator    :设置父布局前显示的图标
  7. indicatorLeft/indicatorStart:默认图标距左侧距离
  8. indicatorRight/indicatorEnd    :默认图标距右侧距离

使用详解

  1. 主界面

    1. <?xml version="1.0" encoding="utf-8"?>
    2. <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    3.  android:layout_width="match_parent"
    4.  android:layout_height="match_parent">
    5.  <ExpandableListView
    6.      android:id="@+id/elvExpandList"
    7.      android:layout_width="match_parent"
    8.      android:layout_height="match_parent"
    9.      android:groupIndicator="@null"/>
    10. </androidx.constraintlayout.widget.ConstraintLayout>

  2. activity

    1. class ExpandActivity: AppCompatActivity(R.layout.activity_expand) {
    2.  override fun onCreate(savedInstanceState: Bundle?) {
    3.      super.onCreate(savedInstanceState)
    5.      initData()
    7.  }
    9.  lateinit var adapter: ExpandAdapter
    10.  private fun initData() {
    11.      val list = ArrayList<Contact>()
    12.      var contact: Contact
    13.      for (i in 0..8){
    14.          contact = Contact("朋友$i",
    15.              arrayListOf(
    16.                  Person("张三","123658956987"),
    17.                  Person("李四","123658956987"),
    18.                  Person("王五","123658956987")
    19.              ))
    20.          list.add(contact)
    21.      }
    22.      adapter = ExpandAdapter(this,list)
    23.      elvExpandList.setAdapter(adapter)
    24.      //默认展开第几个
    25.      elvExpandList.expandGroup(3)
    26.      //子布局点击
    27.      elvExpandList.setOnChildClickListener { parent, v, groupPosition, childPosition, id ->
    28.          Toast.makeText(this, "${list[groupPosition].list[childPosition].name}", Toast.LENGTH_SHORT).show()
    29.          true
    30.      }
    31.  }
    32. }

  3. bean ```kotlin data class Contact( var title: String?, var list: List )

data class Person(var name: String?, var phone: String?)

  2. 4. adpter
  3. ```kotlin
  4. class ExpandAdapter(val context: Context, private val list: List<Contact>) :
  5.     BaseExpandableListAdapter() {
  7.     var layoutInflater: LayoutInflater = LayoutInflater.from(context)
  9.     override fun getGroupCount(): Int = list.size
  11.     override fun getChildrenCount(groupPosition: Int): Int = list[groupPosition].list.size
  13.     override fun getGroup(groupPosition: Int): Any {
  14.         return list[groupPosition]
  15.     }
  17.     override fun getChild(groupPosition: Int, childPosition: Int): Any {
  18.         return list[groupPosition].list[childPosition]
  19.     }
  21.     override fun getGroupId(groupPosition: Int): Long {
  22.         return groupPosition.toLong()
  23.     }
  25.     override fun getChildId(groupPosition: Int, childPosition: Int): Long {
  26.         return childPosition.toLong()
  27.     }
  29.     override fun hasStableIds(): Boolean = false
  31.     override fun getGroupView(
  32.         groupPosition: Int,
  33.         isExpanded: Boolean,
  34.         convertView: View?,
  35.         parent: ViewGroup?
  36.     ): View {
  37.         var convertView = convertView
  38.         val holder: GroupViewHolder
  39.         if (convertView == null) {
  40.             convertView = layoutInflater.inflate(R.layout.item_expand_group, parent, false)
  41.             holder = GroupViewHolder(convertView)
  42.             convertView.tag = holder
  43.         } else {
  44.             holder = convertView.tag as GroupViewHolder
  45.         }
  46.         val groupData = list[groupPosition]
  47.         holder.tvTitle.text = groupData.title
  48.         holder.ivArrow.setImageResource(if (isExpanded) R.drawable.arrow_down else R.drawable.arrow_right)
  49.         return convertView!!
  50.     }
  52.     override fun getChildView(
  53.         groupPosition: Int,
  54.         childPosition: Int,
  55.         isLastChild: Boolean,
  56.         convertView: View?,
  57.         parent: ViewGroup?
  58.     ): View {
  59.         var convertView = convertView
  60.         val holder: ChildViewHolder
  61.         if (convertView == null) {
  62.             convertView = layoutInflater.inflate(R.layout.item_expand_child, parent, false)
  63.             holder = ChildViewHolder(convertView!!)
  64.             convertView.tag = holder
  65.         } else {
  66.             holder = convertView.tag as ChildViewHolder
  67.         }
  68.         val childData = list[groupPosition].list[childPosition]
  69.         holder.tvName.text = childData.name
  70.         holder.tvMoblie.text = childData.phone
  71.         return convertView
  72.     }
  74.     //子项是否可选中,如果要设置子项的点击事件,需要返回true
  75.     override fun isChildSelectable(groupPosition: Int, childPosition: Int): Boolean = true
  77. /*    internal class TestViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
  78.         var tvTitle: TextView = itemView.findViewById(R.id.tvItemExpandGroupTitle)
  80.     }*/
  82.     class GroupViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
  83.         var tvTitle: TextView = itemView.findViewById<TextView>(R.id.tvItemExpandGroupTitle)
  84.         var ivArrow: ImageView = itemView.findViewById<ImageView>(R.id.ivExpandGroupArrow)
  85.     }
  87.     class ChildViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView) {
  88.         var tvName = itemView.findViewById<TextView>(R.id.tvItemExpandChildName)
  89.         var tvMoblie = itemView.findViewById<TextView>(R.id.tvItemExpandChildPhone)
  90.     }
  91. }

  1. 外层 Item 布局

    1. <?xml version="1.0" encoding="utf-8"?>
    2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    3.  android:layout_width="match_parent"
    4.  android:layout_height="50dp"
    5.  android:paddingHorizontal="15dp">
    7.  <TextView
    8.      android:id="@+id/tvItemExpandGroupTitle"
    9.      android:layout_width="wrap_content"
    10.      android:layout_height="wrap_content"
    11.      android:text="分组"
    12.      android:layout_centerVertical="true"/>
    14.  <ImageView
    15.      android:id="@+id/ivExpandGroupArrow"
    16.      android:layout_width="wrap_content"
    17.      android:layout_height="wrap_content"
    18.      android:src="@drawable/arrow_right"
    19.      android:layout_centerVertical="true"
    20.      android:layout_alignParentRight="true"/>
    21. </RelativeLayout>

  2. 内层 item 布局

    1. <?xml version="1.0" encoding="utf-8"?>
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    3.  android:orientation="horizontal"
    4.  android:layout_width="match_parent"
    5.  android:layout_height="40dp"
    6.  android:background="@color/colorAccent">
    8.  <TextView
    9.      android:id="@+id/tvItemExpandChildName"
    10.      android:layout_width="wrap_content"
    11.      android:layout_height="wrap_content"
    12.      android:text="@string/app_name"
    13.      android:layout_gravity="center_vertical"
    14.      android:layout_marginStart="50dp"
    15.      android:textColor="@color/white"/>
    17.  <TextView
    18.      android:id="@+id/tvItemExpandChildPhone"
    19.      android:layout_width="wrap_content"
    20.      android:layout_height="wrap_content"
    21.      android:text="@string/app_name"
    22.      android:layout_gravity="center_vertical"
    23.      android:layout_marginStart="20dp"
    24.      android:textColor="@color/white"/>
    25. </LinearLayout>

    参考

    ExpandableListView
    ExpandableListView使用方法详解
    ExpanableListView