Menampilkan List Dengan SpinnerView

Dalam contoh latihan-latihan sebelumnya kita sudah tahu bahwa ListView menampilkan daftar item yang panjang di dalam activity, tetapi terkadang kita ingin bahwa UI kita juga menampilkan view-view yang lain dan kita perlu ruangan di dalam layar sehingga tidak akan tepat kalau kita menggunakan ‘ListView’ karena ‘ListView’ akan menyita banyak ruangan. Dalam hal seperti ini, kita sebaiknya menggunakan ‘SpinnerView’. SpinnerView akan menampilkan satu item saja dari suatu list dan membolehkan user untuk memilih item yang dipilih diantara item yang ada dalam list.

Berikut adalah contoh latihan menampilkan list dengan menggunakan SpinnerView.

1. Kita buat project baru dengan nama “View Dasar 6”.

2. Kita modifikasi file layout ‘activity_main.xml’ seperti berikut:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="id.co.blogspot.diansano.viewdasar6.MainActivity">

<Spinner
android:id="@+id/spinner1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"/>

</android.support.constraint.ConstraintLayout>

3. Kita modifikasi file “strings.xml” di dalam folder “res/values” seperti berikut:

<resources>
<string name="app_name">SpinnerView</string>

<string-array name="array_pahlawan">
<item>Dewi Sartika</item>
<item>Pangeran Diponegoro</item>
<item>Soekarno</item>
<item>Cut Nyak Dien</item>
<item>Cut Meutia</item>
<item>Sri Sultan HB IX</item>
<item>Boedi Oetomo</item>
<item>R.A. Kartini</item>
<item>Patimuran</item>
<item>Sultan Hasanudin</item>
<item>I Gusti Ngurah Rai</item>
<item>Jendral Ahmad Yani</item>
<item>Yos Soedarso</item>
<item>Juanda</item>
<item>Adi Sucipto</item>
<item>Moh. Hatta</item>
<item>Pangeran Antasari</item>
</string-array>
</resources>

5. Kita modifikasi file “MainActivity.java” seperti berikut:

package id.co.blogspot.diansano.viewdasar6;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {
String[] pahlawan;

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

pahlawan = getResources().getStringArray(R.array.array_pahlawan);

Spinner spinner = (Spinner) findViewById(R.id.spinner1);

ArrayAdapter adapter = new ArrayAdapter(this,
android.R.layout.simple_spinner_item, pahlawan);

spinner.setAdapter(adapter);

spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView adapterView, View view, int i, long l) {
int index = adapterView.getSelectedItemPosition();
Toast.makeText(getBaseContext(), "Anda klik item: " + pahlawan[index],
Toast.LENGTH_SHORT).show();
}

@Override
public void onNothingSelected(AdapterView adapterView) { 

}
});
}
}

5. Jalankan di emulator Android Studio seperti berikut:

Penjelasan

Contoh latihan di atas memiliki cara kerja yang sangat mirip dengan ‘ListView’. Satu tambahan method yang kita implementasikan dalah method ‘onNothingSelected()’. Method ini dipicu bila user menekan tombol ‘back’ yang akan membubarkan list item yang ditampilkan. Dalam hal ini, tidak ada item yang dipilih sehingga kita tidak perlu menampilkan apapun.

Sebagai pengganti menampilkan item-item di dalam ‘ArrayAdapter’ dengan bentuknya yang sederhana, kita juga bisa menampilkannya dengan menggunakan ‘radio button’. Untuk melakukan hal ini, kita perlu memodifikasi parameter kedua di dalam contructor dari class ‘ArrayAdapter’ seperti berikut:

ArrayAdapter adapter = new ArrayAdapter(this,
android.R.layout.simple_list_item_single_choice, pahlawan);

Hasilnya adalah seperti berikut: