android RecyclerView嵌套RecyclerView，显示标题+图片

        最近在做功能，看到这种标题下面还能滑动的图片，这种实现效果是一个RecyclerView嵌套一个RecyclerView，特此记录一下。预览图，外层是一个RecyclerView，里面又是一个RecyclerView。

上代码

布局文件

activity_main.xml 

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

item_recycler.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="3dp">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="我是标题"
        android:textSize="20sp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_item"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView" />
</androidx.constraintlayout.widget.ConstraintLayout>

item_img.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center">

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="10dp">

        <ImageView
            android:id="@+id/img"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:scaleType="fitXY"
            android:src="@drawable/girl1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/tv"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/img"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="10dp"
            android:text="我是名字"
            android:textSize="15sp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/img" />
    </RelativeLayout>
</RelativeLayout>

实体类

class DataItemBean(val title: String, val list: MutableList<ItemBean>) {
}

class ItemBean(val img: Int, val name: String) {
}

回调接口

点击item回调

interface OnItemClickListener {
    fun onItemClick(view: View, position:Int)
}

点击item 子控件回调 

interface OnItemChildClickListener {
    fun onItemChildClick(view: View, position:Int)
}

适配器

外层的

class MainAdapter(val context: Context,val dataItemList:MutableList<DataItemBean>):RecyclerView.Adapter<MainAdapter.RecyclerViewHolder>(){

    lateinit var recyclerItemAdapter:RecyclerItemAdapter

    lateinit var onItemClickListener: OnItemClickListener

    fun onItemClickListener(onItemClickListener:OnItemClickListener){
        this.onItemClickListener= onItemClickListener;
    }
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerViewHolder {
        var view = LayoutInflater.from(context).inflate(R.layout.item_recycler,parent,false)
        var recyclerViewHolder:RecyclerViewHolder = RecyclerViewHolder(view)
        view.setOnClickListener {
            onItemClickListener.onItemClick(view, recyclerViewHolder.adapterPosition)
        }
        return recyclerViewHolder
    }

    override fun getItemCount(): Int {
        return dataItemList.size
    }

    override fun onBindViewHolder(holder: RecyclerViewHolder, position: Int) {

        // 创建一个包含五彩缤纷字体效果的SpannableString
        val spannableString = SpannableString(dataItemList.get(position).title)
        // 设置不同部分的颜色
        spannableString.setSpan(ForegroundColorSpan(Color.RED), 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        spannableString.setSpan(ForegroundColorSpan(Color.GREEN), 1, 2, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        spannableString.setSpan(ForegroundColorSpan(Color.BLUE), 2, 3, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        spannableString.setSpan(ForegroundColorSpan(Color.MAGENTA), 3, 4, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        holder.textView.text=spannableString

        recyclerItemAdapter = RecyclerItemAdapter(context,dataItemList.get(position).list)

        holder.recyclerItem.adapter =recyclerItemAdapter
        recyclerItemAdapter.onItemChildImgClickListener(object:OnItemChildClickListener{
            override fun onItemChildClick(view: View, position2: Int) {
                Toast.makeText(context,position.toString()+"-"+position2.toString(),Toast.LENGTH_SHORT).show()
            }
        })
        recyclerItemAdapter.onItemChildTvClickListener(object:OnItemChildClickListener{
            override fun onItemChildClick(view: View, position2: Int) {
                Toast.makeText(context,dataItemList.get(position).list.get(position2).name,Toast.LENGTH_SHORT).show()
            }
        })
        val linearLayoutManager = LinearLayoutManager(context)
        linearLayoutManager.orientation = LinearLayoutManager.HORIZONTAL
        holder.recyclerItem.layoutManager = linearLayoutManager
    }

    inner class RecyclerViewHolder(view: View) : RecyclerView.ViewHolder(view){
        var textView: TextView = view.findViewById(R.id.textView)
        var recyclerItem:RecyclerView = view.findViewById(R.id.recycler_item)
    }
}

 嵌套的RecyclerView

class RecyclerItemAdapter(val context: Context, val list:MutableList<ItemBean>) : RecyclerView.Adapter<RecyclerItemAdapter.ViewHolder>(){

    lateinit var onItemChildImgClickListener: OnItemChildClickListener
    lateinit var onItemChildTvClickListener: OnItemChildClickListener

    fun onItemChildImgClickListener(onItemChildImgClickListener: OnItemChildClickListener){
        this.onItemChildImgClickListener= onItemChildImgClickListener;
    }
    fun onItemChildTvClickListener(onItemChildTvClickListener: OnItemChildClickListener){
        this.onItemChildTvClickListener= onItemChildTvClickListener;
    }

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        val view =LayoutInflater.from(context).inflate(R.layout.item_img,null,false)
        val viewHolder=ViewHolder(view)
        viewHolder.img.setOnClickListener {
            onItemChildImgClickListener.onItemChildClick(view, viewHolder.adapterPosition)
        }
        viewHolder.text.setOnClickListener {
            onItemChildTvClickListener.onItemChildClick(view, viewHolder.adapterPosition)
        }
        return viewHolder
    }

    override fun getItemCount(): Int {
        return list.size
    }

    override fun onBindViewHolder(holder: ViewHolder, position: Int) {
        holder.img.setImageResource(list.get(position).img)
        holder.text.text = list.get(position).name
    }

    inner class ViewHolder(view: View):RecyclerView.ViewHolder(view){
        val img: ImageView = view.findViewById(R.id.img)
        val text:TextView = view.findViewById(R.id.tv)
    }

}

MainActivity.java

class MainActivity : AppCompatActivity() {

    lateinit var binding:ActivityMainBinding
    lateinit var mainAdapter:MainAdapter

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

        val list1: MutableList<ItemBean> = mutableListOf()
        list1.add(ItemBean(R.drawable.girl1,"美女-1"))
        list1.add(ItemBean(R.drawable.girl2,"美女-2"))
        list1.add(ItemBean(R.drawable.girl3,"美女-3"))

        val list2: MutableList<ItemBean> = mutableListOf()
        list2.add(ItemBean(R.drawable.girl4,"中森明菜-1"))
        list2.add(ItemBean(R.drawable.girl5,"中森明菜-2"))
        list2.add(ItemBean(R.drawable.girl6,"中森明菜-3"))

        val list3: MutableList<ItemBean> = mutableListOf()
        list3.add(ItemBean(R.drawable.girl7,"工藤静香-1"))
        list3.add(ItemBean(R.drawable.girl8,"工藤静香-2"))
        list3.add(ItemBean(R.drawable.girl9,"工藤静香-3"))

        var dataBean1 = DataItemBean("美女图片",list1)
        var dataBean2 = DataItemBean("中森明菜",list2)
        var dataBean3 = DataItemBean("工藤静香",list3)

        val dataItemList: MutableList<DataItemBean> = mutableListOf()
        dataItemList.add(dataBean1)
        dataItemList.add(dataBean2)
        dataItemList.add(dataBean3)

        mainAdapter = MainAdapter(this,dataItemList)
        mainAdapter.onItemClickListener(object:OnItemClickListener{
            override fun onItemClick(view: View, position: Int) {
                Toast.makeText(this@MainActivity,dataItemList.get(position).title,Toast.LENGTH_SHORT).show()
            }
        })
        binding.recyclerList.adapter=mainAdapter
        var linearLayoutManager = LinearLayoutManager(this)
        linearLayoutManager.orientation = LinearLayoutManager.VERTICAL
        binding.recyclerList.layoutManager = linearLayoutManager

    }
}