Contoh Android ListView pada Android Studio

Pada tutorial Android Studio kali ini, kita akan membuat aplikasi sederhana dengan menggunakan ListView.

ListView merupakan tampilan yang mengelompokkan beberapa item data dalam bentuk daftar yang dapat kita scroll secara vertikal.
Item data pada ListView dapat dihasilkan dari data yang berasal dari array ataupun dari database. Jika kita menggunakan data dari array, berarti kita harus mendefinisikannya secara statik pada koding. Jika diambil dari database, harus melakukan establish connection ke database terlebih dahulu.

Agar item data tersebut dapat ditampilkann kedalam ListView, maka diperlukan sebuah penghubung. Penghubung inilah yang dinamakan Adapter. Karena kita akan menyajikan data yang berasal dari Array, maka disini kita menggunakan ArrayAdapter.

Cara Pertama

1. Create project baru 
Disini kita berinama Contoh ListView pada Application name. Kemudian pada Target Android Device pilihla Phone and Tablet, kemudian set Minimum SDK : API 10 : Android 2.3.3 (Gingerbread). Lalu pilih Blank Activity, dan biarkan default untuk Activity Name : MainActivity.

2. Buka file res/layout/content_main.xml
Dalam file ini kita akan menambahkan ListView container ListView. Terlebih dahulu hapus koding TextView yang dihasilkan secara default, kemudian tambahkan ListView sehingga kodingnya menjadi :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:showIn="@layout/activity_main"
    tools:context="com.ilmudetil_blogspot.contohlistview.MainActivity">
    
    <ListView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/provView" />
</RelativeLayout>

3. Buka file java/MainActivity.java
Dalam file ini kita akan mendefinisikan data untuk Array, kemudian menghubungkan data array tersebut dengan  ListView melalui bantuan ArrayAdapter. Berikut ini koding lengkap untuk MainActivity.java 

package com.ilmudetil_blogspot.contohlistview;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ListView;
import android.widget.ArrayAdapter;



public class MainActivity extends AppCompatActivity {
    String[] namaProvinsi = {"Aceh","Jambi","Maluku","Jawa Timur","Papua Barat","Jawa Barat","Sumatera Barat","Kalimantan Barat"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ArrayAdapter adapter = new ArrayAdapter<String>(this,android.R.layout.simple_list_item_1,namaProvinsi);
        ListView listView = (ListView)findViewById(R.id.provView);
        listView.setAdapter(adapter);

    }
}

Output dari contoh aplikasi Android ListView yang telah kita buat, ditunjukkan oleh Gambar.1(a) dan Gambar.1(b) dibawah ini :

Gambar.1(a) dan (b)

Cara Kedua

Model cara kedua ini, kita akan membuat tambahan activity yang nantinya akan menjadi style yang kita inginkan.

1. Lakukan langkah 1 dan 2 seperti pada "Cara Pertama" diatas untuk pembuatan project dan file content_main.xml.

2. Kemudian tambahkan activity baru, dengan mengklik kanan pada res/layout. Berikan nama dengan content_provinsi.xml. Hapus koding defaultnya, kemudian copy paste kode berikut dalam content_provinsi.xml :

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/label"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dip"
    android:textSize="18dip"
    android:textStyle="bold"
    android:background="#adea5dfa">
</TextView>

3. Buka file java/MainActivity.java
Secara keseluruhan koding dalam MainActivity.java sama dengan Cara Pertama. Disini kita hanya merubah pemanggilan activitynya, yaitu dengan menambahkan  R.Layout.content_provinsi  pada ArrayAdapter. Berikut ini kode lengkapnya dari MainActivity.java :

package com.ilmudetil_blogspot.contohlistview;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.ListView;
import android.widget.ArrayAdapter;

public class MainActivity extends AppCompatActivity {
    String[] namaProvinsi = {"Aceh","Jambi","Maluku","Jawa Timur","Papua Barat","Jawa Barat","Sumatera Barat","Kalimantan Barat"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        ArrayAdapter adapter = new ArrayAdapter<String>(this,R.layout.content_provinsi,namaProvinsi);
        ListView listView = (ListView)findViewById(R.id.provView);
        listView.setAdapter(adapter);
    }
}

Output dari aplikasi yang kita buat ditunjukkan oleh Gambar.2 dibawah ini :

Gambar.2

Catatan :
Ketika kita membuat activity baru, akan terbuat dua file yaitu : “activity_provinsi.xml“ dan “content_provinsi.xml“. Disini yang kita gunakan adalah  content_provinsi.xml yang kode defaultnya telah kita hapus (mengandung RelativeLayout). Jika kita gunakan activity_provinsi.xml , maka aplikasi akan error. 

Solusinya dengan menambahkan  R.Layout.activity_provinsi, R.id.label , namun tampilannya akan berantakan seperti yang ditunjukkan oleh Gambar.3

Gambar.3

Tweet

Subscribe to receive free email updates: