安卓开发入门教程-UI控件_RecyclerView 什么是RecyclerView 基础样例

什么是RecyclerView

RecyclerView是当前主流用于显示列表的UI控件.

基础样例

效果图

方案简要介绍

  1. 在app模块build.gradle文件中增加如下依赖
implementation 'androidx.recyclerview:recyclerview:1.1.0'
  1. 在activity对应的布局文件中增加RecyclerView
<androidx.recyclerview.widget.RecyclerView
    android:id="@+id/recyclerView"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
  1. 新增一个Adapter用于展示列表中每一行内容(含对应布局文件)
    详见下面完整代码中的RvAdapter及其布局文件.
  2. 在activity中实例化Adapter,设置数据,并将adapter设置给RecyclerView
private fun initRecyclerView() {
    var dataList = getData()
    val adapter = RvAdapter()
    adapter.setData(dataList)
    recyclerView.adapter = adapter
    recyclerView.layoutManager = LinearLayoutManager(this)
}

private fun getData(): List<String> {
    val dataList = ArrayList<String>()
    for (index in 0 until 100) {
        val text = " 数据$index "
        dataList.add(text)
    }
    return dataList
}

完整代码

  1. activity代码:MainActivity
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        initRecyclerView()
    }

    private fun initRecyclerView() {
        var dataList = getData()
        val adapter = RvAdapter()
        adapter.setData(dataList)
        recyclerView.adapter = adapter
        recyclerView.layoutManager = LinearLayoutManager(this)
    }

    private fun getData(): List<String> {
        val dataList = ArrayList<String>()
        for (index in 0 until 100) {
            val text = " 数据$index "
            dataList.add(text)
        }
        return dataList
    }
}
  1. MainActivity对应布局文件: activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

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

</LinearLayout>
  1. RecyclerView对应Adapter: RvAdapter
class RvAdapter : RecyclerView.Adapter<RecyclerView.ViewHolder>() {
    private var mDataList = mutableListOf<String>()
    private lateinit var mContext: Context
    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        mContext = parent.context
        val view = LayoutInflater.from(mContext).inflate(R.layout.item_layout, parent, false)
        return ViewHolder(view)
    }

    override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
        val data = mDataList[position]
        //更新UI上nameTv展示内容
        holder.itemView.nameTv.text = data
        //设置点击事件
        holder.itemView.setOnClickListener {
            Toast.makeText(mContext, data, Toast.LENGTH_SHORT).show()
        }
    }

    fun setData(dataList: List<String>) {
        mDataList.clear()
        mDataList.addAll(dataList)
        notifyDataSetChanged()
    }

    override fun getItemCount(): Int = mDataList.size

    class ViewHolder(itemView: View) : RecyclerView.ViewHolder(itemView)
}
  1. RvAdapter对应布局文件: item_layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical">

    <TextView
        android:id="@+id/nameTv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="20dp"
        tools:text="姓名" />

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_marginStart="15dp"
        android:layout_marginEnd="15dp"
        android:layout_marginTop="5dp"
        android:background="#E7E7E7" />
</LinearLayout>

基础样例完整源代码

https://gitee.com/cxyzy1/recyclerView_Demo

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章