آموزش ListView به زبان کوتلین در برنامه نویسی اندروید

سلام دوستان امیدوارم حالتان خوب باشد در این سری از آموزش برنامه نویسی اندروید به آموزش ListView به زبان کوتلین در برنامه نویسی اندروید می پردازیم قبلا آموزش ListView به زبان جاوا در اندروید را برای شما قرار داده بودیم همانطور که قول داده بودیم سعی می کنیم بیشتر آموزش های سایت را به زبان کوتلین نیز برای شما قرار دهیم در ادامه با ما همراه باشید.
در این آموزش ما ListView سفارشی ایجاد می کنیم یعنی با آداپتور و امکان تغییر در شکل ظاهری آیتم ها تا در صورتی که خواستید از این آموزش آن را درست کنید بتوانید آن را سفارشی کنید.
قبل از هرکاری باید زبان کوتلین را به اندروید استودیو اضافه کنید برای اینکار می توانید از آموزش زیر استفاده کنید.

آموزش اضافه کردن kotlin به اندروید استودیو

بعد از اینکار یک layout به نام activity_list_view.xml ایجاد کنید (این layout اصلی ما است) و کدهای زیر را در آن قرار دهید.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     tools:context=".ListViewActivity">
    <ListView android:id="@+id/list"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".ListViewActivity">

<ListView android:id="@+id/list"

android:layout_width="wrap_content"

android:layout_height="wrap_content"/>

</RelativeLayout>

در بالا فقط یک ListView ساده قرار گرفته است.
همانطور که گفتیم ما آن را سفارشی ایجاد می کنیم تا اگر خواستید آن را تغییر دهید پس یک فایل به نام list_row.xml در layout ایجاد کرده و کدهای زیر را در آن قرار دهید.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="16dp">
    <TextView
        android:id="@+id/label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>
</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:padding="16dp">

<TextView

android:id="@+id/label"

android:layout_width="wrap_content"

android:layout_height="wrap_content"/>

</RelativeLayout>

کد بالا شکل ظاهری هر آیتم از ListView را ایجاد می کند.
چون layout سفارشی داریم باید آن را Inflate کنیم پس باید آداپتور سفارشی برای آن ایجاد کنیم.
پس در اکتیویتی اصلی که در اینجا نام آن برابر با ListViewActivity.kt است کدهای زیر را قرار دهید.

package ir.programchi
import android.content.Context
import android.os.Bundle
import android.support.v7.app.AppCompatActivity
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.BaseAdapter
import android.widget.ListView
import android.widget.TextView
public class ListViewActivity() : AppCompatActivity() {
    override fun onCreate(savedState: Bundle?) {
        super.onCreate(savedState)
        setContentView(R.layout.activity_list_view)
        val lv = findViewById(R.id.list) as ListView
        lv.adapter = ListExampleAdapter(this)
    }
    private class ListExampleAdapter(context: Context) : BaseAdapter() {
        internal var sList = arrayOf("One", "Two", "Three", "Four", "Five", "Six", "Seven",
                "Eight", "Nine", "Ten", "Eleven", "Twelve", "Thirteen")
        private val mInflator: LayoutInflater
        init {
            this.mInflator = LayoutInflater.from(context)
        }
        override fun getCount(): Int {
            return sList.size
        }
        override fun getItem(position: Int): Any {
            return sList[position]
        }
        override fun getItemId(position: Int): Long {
            return position.toLong()
        }
        override fun getView(position: Int, convertView: View?, parent: ViewGroup): View? {
            val view: View?
            val vh: ListRowHolder
            if (convertView == null) {
                view = this.mInflator.inflate(R.layout.list_row, parent, false)
                vh = ListRowHolder(view)
                view.tag = vh
            } else {
                view = convertView
                vh = view.tag as ListRowHolder
            }
            vh.label.text = sList[position]
            return view
        }
    }
    private class ListRowHolder(row: View?) {
        public val label: TextView
        init {
            this.label = row?.findViewById(R.id.label) as TextView
        }
    }
}

package ir.programchi

import android.content.Context

import android.os.Bundle

import android.support.v7.app.AppCompatActivity

import android.view.LayoutInflater

import android.view.View

import android.view.ViewGroup

import android.widget.BaseAdapter

import android.widget.ListView

import android.widget.TextView

public class ListViewActivity() : AppCompatActivity() {

override fun onCreate(savedState: Bundle?) {

super.onCreate(savedState)

setContentView(R.layout.activity_list_view)

val lv = findViewById(R.id.list) as ListView

lv.adapter = ListExampleAdapter(this)

}

private class ListExampleAdapter(context: Context) : BaseAdapter() {

internal var sList = arrayOf("One", "Two", "Three", "Four", "Five", "Six", "Seven",

"Eight", "Nine", "Ten", "Eleven", "Twelve", "Thirteen")

private val mInflator: LayoutInflater

init {

this.mInflator = LayoutInflater.from(context)

}

override fun getCount(): Int {

return sList.size

}

override fun getItem(position: Int): Any {

return sList[position]

}

override fun getItemId(position: Int): Long {

return position.toLong()

}

override fun getView(position: Int, convertView: View?, parent: ViewGroup): View? {

val view: View?

val vh: ListRowHolder

if (convertView == null) {

view = this.mInflator.inflate(R.layout.list_row, parent, false)

vh = ListRowHolder(view)

view.tag = vh

} else {

view = convertView

vh = view.tag as ListRowHolder

}

vh.label.text = sList[position]

return view

}

private class ListRowHolder(row: View?) {

public val label: TextView

init {

this.label = row?.findViewById(R.id.label) as TextView

}

در کد بالا یک کلاسی داریم به نام ListExampleAdapter این کلاس همان آداپتور سفارشی ما است اول اینکه باید layout ساخته شده را در هر سطر Inflate کنیم برای اینکار از LayoutInflater استفاده کردیم دوم باید آن TextView که در layout ی که Inflate شده است را find کنیم که از ListRowHolder برای انجام این کار استفاده کردیم. و در بخش main اصلی ابتدا view مربوط به listview پیدا شده و سپس اداپتور ست شده است و sList هم یکسری داده sample است که می خواهد در listview قرار بگیرد.

این آموزش هم به پایان رسید.

موفق و پیروز باشید.

مطالعه بیشتر