pada materi ini membahas tentang membuat layout Gridview pada Kotlin Android dengan BaseAdapter. adapun langkahnya buat terlebih dahulu desain layout main GridView (main_grid.xml). layout seperti gambar di bawah ini.
<?xml version="1.0" encoding="utf-8"?> <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="match_parent" tools:context=".MainActivity"> <GridView android:id="@+id/gvmenu" android:layout_width="match_parent" android:layout_height="match_parent" android:columnWidth="130dp" android:horizontalSpacing="13dp" android:numColumns="auto_fit" android:verticalSpacing="13dp" /> </LinearLayout>
kemudian buat layout konten grid misal terdiri dari gambar dan textview dapat dilihat pada gambar.
(menu.xml)
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="150dp" android:layout_height="wrap_content" android:background="#ddd" android:gravity="center" android:orientation="vertical" android:padding="15dp"> <ImageView android:id="@+id/imgmenu" android:layout_width="130dp" android:layout_height="120dp" app:srcCompat="@drawable/riki" /> <TextView android:id="@+id/tvmenu" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="Menu" android:textSize="20sp" /> </LinearLayout>
Buatlah konstruktor Menu (Menu.kt) yang melakukat set Text dan Gambar
package a.riki.cobahello class Menu{ var name: String? = null var image: Int? = null constructor(name: String, image: Int) { this.name = name this.image = image } }
Kemudian coding MainActivity. codenya menghubungkan dengan BaseAdapter untuk memasukkan nama-nama menu dan gambar pada ArrayList.
package a.riki.cobahello import android.content.Context import android.support.v7.app.AppCompatActivity import android.os.Bundle import android.view.LayoutInflater import android.view.View import android.view.ViewGroup import android.widget.BaseAdapter import kotlinx.android.synthetic.main.main_grid.* import kotlinx.android.synthetic.main.menu.view.* class MainActivity : AppCompatActivity() { var adapter: MenuAdapter? = null var menusList = ArrayList<Menu>() override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.main_grid) // list menu menusList.add(Menu("Riki", R.drawable.riki)) menusList.add(Menu("Kotlin", R.drawable.kotlin)) menusList.add(Menu("Java", R.drawable.java)) menusList.add(Menu("Flutter",R.drawable.flutter)) menusList.add(Menu("C++", R.drawable.cplusplus)) menusList.add(Menu("Android", R.drawable.ic_launcher_background)) adapter = MenuAdapter(this, menusList) gvmenu.adapter = adapter } class MenuAdapter : BaseAdapter { var menusList = ArrayList<Menu>() var context: Context? = null constructor(context: Context, menusList: ArrayList<Menu>) : super() { this.context = context this.menusList = menusList } override fun getCount(): Int { return menusList.size } override fun getItem(position: Int): Any { return menusList[position] } override fun getItemId(position: Int): Long { return position.toLong() } override fun getView(position: Int, convertView: View?, parent: ViewGroup?): View { val menu = this.menusList[position] var inflator = context!!.getSystemService(Context.LAYOUT_INFLATER_SERVICE) as LayoutInflater var menuView = inflator.inflate(R.layout.menu, null) menuView.imgmenu.setImageResource(menu.image!!) menuView.tvmenu.text = menu.name!! return menuView } } }
Outputnya sebagai berikut: