Beranda / Android Programming / Basic Android / Widget

Belajar Cara Membuat Spinner di Android Studio

Oleh Wildan M Athoillah

Assalamualaikum Warahmatullahi Wabarakatuh.

Spinner adalah salah satu view atau widge yang cukup banyak digunakan pada Aplikasi Android, Widget Spinner digunakan untuk menampilkan List/Dropdown menu, yang terdiri dari item-item, untuk memuahkan user dalam memilih sebuah konten pada aplikasi, kita dapat menyimpan item/valuenya menggunakan sebuah Array atau ArrayList, lalu menampilkannya pada Spinner.


Pada tutorial ini, kita akan belajar bagaimana cara membuat Spinner untuk aplikasi android, disini kita akan membuat contoh program sederhana beserta pejelasannya, Untuk itu mari kita simak tutorial berikut ini.

Materi lainnya yang direkomendasikan:

Belajar Cara Membuat Spinner di Android Studio

Buka aplikasi Android Studio kalian, Buat Project Baru.

Ada dua cara untuk membuat sebuah menu item pada Spinner, yang pertama yaitu dengan menggunakan resource dari xml, cara ini bersifat static, yang artinya item pada Spinner tidak atau jarang diubah-ubah.

Dan yang kedua yaitu dengan menggunakan file java, kita data membuat menu item dengan menggunakan Array atau ArrayList pada Java, cara ini bersifat dinamis, cara tersebut berguna jika data yang hendak kita sajikan, harus berubah-ubah. Kedua cara tersebut akan kita bahas satu per satu disini.

A.Membuat Menu Resource menggunakan file xml

Disini kita akan membahas cara yang pertama terlebih dahulu, untuk membut string array dengan menggunakan file xml, caranya kalian buka file strings.xml yang tersapat pada folder res/values.



Lalu kita tambahkan string-array , misalnya kita ingin membuat daftar menu makanan menggunakan Spinner, tambahkan baris kode seperti berikut:
<string-array name="daftar_makanan">
     <item>Bakso</item>
     <item>Ayam Goreng</item>
     <item>Mie Rebus</item>
     <item>Nasi Padang</item>
     <item>Ikan Bakar</item>
     <item>Seblak</item>
     <item>Gorengan</item>
     <item>Mie Ayam</item>
</string-array>
Disana kita dapat mengunakan tag <sting-array> yang digunakan untuk membungkus item-item yang ingin diampilkan pada Spinner, lalu tag <item> digunakan untuk membuat sebuah item.

Selanjutnya buka file activity_main.xml pada project kalian, disini kita akan menambahkan widget Spinner dan juga komponen tambahan seperti Button, yang digunakan untuk mengeksekusi item yang dipilih.
<?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"
    android:layout_margin="8dp"
    android:orientation="vertical"
    android:background="#FFF5F5F5"
    tools:context="android.cianjur.developer.net.basicandroid.MainActivity">

    <Spinner
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/listItem"
        android:entries="@array/daftar_makanan"
        android:padding="15dp">

    </Spinner>

    <Button
        android:id="@+id/submit"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Pesan Makanan"/>

</LinearLayout>
Pada tag <Spinner> kita menggunakan atribut android:entries, yang digunakan untuk menentukan daftar item mana yang ingin ditampilkna, daftar item tersebut yang sebelumnya sudah kita buat pada file xml, dengan nama "daftar_makanan".

Selanjutnya kit buka file MainActivity.java, disini kita akan membuat sebuah fungsi pada Spinner dan juga button, pada saat Button tersebut diklik, maka akan muncul pesan singkat sesuai dengan nama item yang dikliknya
package android.cianjur.developer.net.basicandroid;

/*
 Dibuat Oleh WILDAN M ATHOILLAH
 */

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

public class MainActivity extends AppCompatActivity{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final Spinner List = findViewById(R.id.listItem);
        Button Submit = findViewById(R.id.submit);
        Submit.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(getApplicationContext(), "Saya Memesan "+List.getSelectedItem(), Toast.LENGTH_SHORT).show();
            }
        });
    }
}
Pada program tersebut kita menggunakan Toast untuk menampilkan pesan saat salah satu item dipilih, serta menggunakan fungsi getSelectedItem() yang digunakan untuk mengambil value dari daftar menu yang dipilih.

 Demo:







B.Membuat Menu Resource menggunakan Array pada Java

Cara yang kedua ini, kita dapat menggunakan sebuah Array atau ArrayList untuk menyimpan menu item, karena tidak menggunakan menu resource dari xml, sebagai gantinya kita menggunakan SpinnerAdapter yang berfungsi untuk mengolah data Array yang nantinya akan ditampilkan pada Spinner.

Untuk itu, pertama kita hapus terlebih dahulu atribut android:entries pada Spinner kita di activity_main.xml. dan juga kita tidak akan menggunakan Button untuk contoh berikut ini.
<Spinner
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/listItem"
    android:padding="15dp">

</Spinner>
Selanjutnya kita edit source code pada MainActivity,java menjadi seperti berikut ini:
package android.cianjur.developer.net.basicandroid;

/*
 Dibuat Oleh WILDAN M ATHOILLAH
 */

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
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{

    //Menginisialisasi Menu Item pada Variable Array
    private String[] Item = {"Bakso","Ayam Goreng","Mie Rebus","Nasi Padang",
                             "Ikan Bakar","Seblak","Gorengan","Mie Ayam"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        final Spinner List = findViewById(R.id.listItem);

        //Inisialiasi Array Adapter dengan memasukkan String Array
        final ArrayAdapter<String> adapter = new ArrayAdapter<>(this,
                android.R.layout.simple_spinner_dropdown_item,Item);

        //Memasukan Adapter pada Spinner
        List.setAdapter(adapter);

        //Mengeset listener untuk mengetahui event/aksi saat item dipilih
        List.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView adapterView, View view, int i, long l) {
                Toast.makeText(getApplicationContext(),"Saya Memesan "+adapter.getItem(i), Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onNothingSelected(AdapterView adapterView) {
                
            }
        });
    }
}
Penjelasan:

Pada program tersebut, kita mendefinisikan Itemnya kedalam String[] array yang berisi data yang nantinya akan kita gunakan di Spinner. Lelu memasukan Array tersebut kedalalam ArrayAdapter.

OnItemSelectedListener() pada Spinner., digunaakn agar kita dapat memonitor Item yang dipilih oleh user pada Spinner saat user selesai memilih sebuah item pada Spinner maka akan memunculkan pesan singkat menggunakan Toast.

Source Codenya bisa kalian download di Github Saya.

Terimakasih atas kunjungannya, semoga tutorial yang saya berikan bisa bermanfaat untuk kalian semua, selebihnya, mohon maaf bila ada kesalahan.

Wassalamualaikum Warahmatullahi Wabarakatuh.

Wildan M Athoillah
Wildan M Athoillah Blogger dan spesialis pembuat aplikasi android.