安卓開發入門教程-UI控件_ListView 什麼是ListView 基礎樣例

什麼是ListView

ListView是用於顯示列表的UI控件.不過當前主流的已經是RecyclerView了,更強大,更好用.

基礎樣例

效果圖

方案簡要介紹

1. 在activity對應的佈局文件中增加ListView

<ListView
    android:id="@+id/listView"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

2. 新增一個Adapter用於展示列表中每一行內容(含對應佈局文件)
   詳見下面完整代碼中的ListViewAdapter及其佈局文件.
3. 在activity中實例化Adapter,設置數據,並將adapter設置給ListView

private fun initListView() {
    var dataList = getData()
    val adapter = ListViewAdapter(this)
    adapter.setData(dataList)
    listView.adapter = adapter
    //隱藏自帶的分隔符，在ListViewAdapter對應的佈局裏自定義分隔符，這樣可以更靈活。
    listView.divider = null
    //添加點擊事件
    listView.setOnItemClickListener { adapterView, _, position, _ ->
        val text = adapterView.getItemAtPosition(position).toString()
        toast(text)
    }
}

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)
        initListView()
    }

    private fun initListView() {
        var dataList = getData()
        val adapter = ListViewAdapter(this)
        adapter.setData(dataList)
        listView.adapter = adapter
        //隱藏自帶的分隔符，在ListViewAdapter對應的佈局裏自定義分隔符，這樣可以更靈活。
        listView.divider = null
        //添加點擊事件
        listView.setOnItemClickListener { adapterView, _, position, _ ->
            val text = adapterView.getItemAtPosition(position).toString()
            toast(text)
        }
    }

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

    /**
     * 顯示toast短暫提示
     */
    private fun toast(text: String) = Toast.makeText(this, text, Toast.LENGTH_SHORT).show()
}

2. MainActivity對應佈局文件: activity_main.xml

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

    <ListView
        android:id="@+id/listView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

3. ListView對應Adapter: ListViewAdapter

class ListViewAdapter(var context: Context) : BaseAdapter() {
    private var mDataList = mutableListOf<String>()

    /**
     * 設置數據
     */
    fun setData(dataList: List<String>) {
        mDataList.clear()
        mDataList.addAll(dataList)
        //數據變更後，需要調用notifyDataSetChanged通知數據變化。
        notifyDataSetChanged()
    }

    override fun getView(position: Int, convertView: View?, viewGroup: ViewGroup?): View {
        var viewHolder: ViewHolder
        var view: View
        //下面對convertView進行判斷，是爲了複用已存在的視圖，提升效率。
        if (convertView == null) {
            view = View.inflate(context, R.layout.item_layout, null);
            viewHolder = ViewHolder(view)
            view.tag = viewHolder
        } else {
            view = convertView
            viewHolder = view.tag as ViewHolder
        }
        //獲取當前位置數據
        val item = getItem(position)
        //顯示用戶名
        if (item is String) {
            viewHolder.nameTv.text = item
        }
        return view
    }

    override fun getItem(position: Int): Any {
        return mDataList[position]
    }

    override fun getItemId(position: Int): Long {
        return 0
    }

    override fun getCount(): Int {
        return mDataList.size
    }

    class ViewHolder(view: View) {
        var nameTv: TextView = view.findViewById(R.id.nameTv)
    }
}

4. ListViewAdapter對應佈局文件: 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/ListViewDemo