Cara Membuat Spinner pada Android Studio

Cara Membuat Spinner pada Android Studio - Jika pada web kita menggunakan Select untuk membuat list item, maka pada android kita menggunakan spinner. Spinner merupakan elemen yang digunakan untuk membentuk suatu pilihan dropdown item yang berasal dari suatu array. Lalu, bagaimana cara membuat spinner di android studio ?.

Array yang digunakan untuk membuat spinner dapat berasal dari beberapa sumber dan dapat berupa beberapa bentuk.

Cara Membuat Spinner Menggunakan String-array XML

Untuk tutorial yang pertama, kita akan membuat spinner android menggunakan array statis yang berasal dari XML.

Jadi, buka android studio kalian kemudian masukkan beberapa script di bawah.

Contoh Aplikasi :

Layout :

Copy dan paste pada activity_main.xml untuk membentuk layout.

<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<TextView
android:layout_marginTop="50dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:textColor="#000"
android:text="Daftar Siswa STM Negeri 1"
android:textAlignment="center"
android:textAppearance="?android:textAppearanceMedium"/>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_margin="20dp"
android:gravity="center">
<Spinner
android:id="@+id/spinner"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="50dp"
android:entries="@array/siswa">
</Spinner>
<Button
android:id="@+id/btn_submit"
android:layout_marginTop="10dp"
android:layout_width="150dp"
android:layout_height="50dp"
android:text="Submit"
android:background="#ccd1d1"
android:textAppearance="?android:textAppearanceButton"/>
<LinearLayout
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Siswa : "
android:textColor="#000"
android:textSize="16sp" />
<TextView
android:id="@+id/tv_siswa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#000"
android:layout_marginLeft="5dp"
/>
</LinearLayout>

</LinearLayout>

</LinearLayout>

Strings.xml

Kalian dapat menemukan strings.xml pada res->values->strings.xml. Jika kalian bingung, silahkan liat gambar di bawah :

Sudah ketemu?

Salin dan tempelkan kode berikut :

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

<string-array name="siswa">
<item>Wawan</item>
<item>Mamat</item>
<item>Bambang</item>
<item>Alan Suryajana</item>
<item>Darwin Simajuntak</item>
<item>Dadang Suradang</item>
<item>Eko Sulistyaningtyas</item>
<item>Beni Subeni</item>
</string-array>
</resources>

MainActivity.java

Pada java, silahkan salin dan tempelkan kode berikut :

package com.example.pkl.spinnerfuntechsy;

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.Button;
import android.widget.Spinner;
import android.widget.TextView;
import android.widget.Toast;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

Spinner spinner;
String nama;
TextView tv_siswa;
Button btn_submit;

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

spinner = (Spinner) findViewById(R.id.spinner);
tv_siswa = (TextView) findViewById(R.id.tv_siswa);
btn_submit = (Button) findViewById(R.id.btn_submit);
spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
nama = spinner.getSelectedItem().toString();
}

@Override
public void onNothingSelected(AdapterView<?> parent) {

}
});

btn_submit.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(!nama.equals("")){
tv_siswa.setText(nama);
Toast.makeText(MainActivity.this, "Anda Memilih "+nama, Toast.LENGTH_LONG).show();
}
}
});

}
}

Kita bahas sedikit ya,

spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener()

Merupakan perintah untuk ‘mendengarkan’ event ketika suatu item pada spinner dipilih.

nama = spinner.getSelectedItem().toString();

Perintah di atas digunakan untuk menangkap item yang dipilih dari spinner dan disimpan pada variabel nama.

Toast.makeText(MainActivity.this, "Anda Memilih "+nama, Toast.LENGTH_LONG).show();

Perintah di atas untuk memunculkan Toast atau Pop Up.

Hasil Aplikasi

Cara Membuat Spinner Menggunakan ArrayList String

Untuk tutorial yang kedua, kita menggunakan Array statis yang didefinisikan langsung di java.

Contoh Aplikasi

Layout :

Copy dan paste pada activity_main.xml untuk membentuk layout.

<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<TextView
android:layout_marginTop="50dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textStyle="bold"
android:textColor="#000"
android:text="Daftar Guru STM Negeri 1"
android:textAlignment="center"
android:textAppearance="?android:textAppearanceMedium"/>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_margin="20dp"
android:gravity="center">
<Spinner
android:id="@+id/spinner"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="50dp">
</Spinner>
<Button
android:id="@+id/btn_submit"
android:layout_marginTop="10dp"
android:layout_width="150dp"
android:layout_height="50dp"
android:text="Submit"
android:background="#ccd1d1"
android:textAppearance="?android:textAppearanceButton"/>
<LinearLayout
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Guru : "
android:textColor="#000"
android:textSize="16sp"/>
<TextView
android:id="@+id/tv_guru"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#000"
android:layout_marginLeft="5dp"/>
</LinearLayout>

</LinearLayout>

</LinearLayout>

MainActivity.java

Pada java, silahkan salin dan tempelkan kode berikut :

package com.example.pkl.spinnerfuntechsy;

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.Button;
import android.widget.Spinner;
import android.widget.TextView;
import android.widget.Toast;

import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {

Spinner spinner;
String nama;
TextView tv_guru;
Button btn_submit;
ArrayList<String> daftar_guru; // Mendefinisikan variabel daftar_guru menjadi tipe ArrayList<String>

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

spinner = (Spinner) findViewById(R.id.spinner);
tv_guru = (TextView) findViewById(R.id.tv_guru);
btn_submit = (Button) findViewById(R.id.btn_submit);

daftar_guru = new ArrayList<String>();

daftar_guru.add("Pak Hermawan");
daftar_guru.add("Pak Tanto");
daftar_guru.add("Bu Sulis");
daftar_guru.add("Pak Putri");
daftar_guru.add("Bu Marwan");
daftar_guru.add("Pak Ugik");

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,R.layout.support_simple_spinner_dropdown_item,daftar_guru);

spinner.setAdapter(adapter);

spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
nama = spinner.getSelectedItem().toString();
}

@Override
public void onNothingSelected(AdapterView<?> parent) {

}
});

btn_submit.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if(!nama.equals("")){
tv_guru.setText(nama);
Toast.makeText(MainActivity.this, "Anda Memilih "+nama, Toast.LENGTH_LONG).show();
}
}
});

}
}

Kita bahas kode di atas ya,

daftar_guru = new ArrayList<String>();

Perintah di atas digunakan untuk membentuk objek ArrayList<String> baru pada variabel daftar_guru.

daftar_guru.add("Pak Hermawan");
daftar_guru.add("Pak Tanto");
daftar_guru.add("Bu Sulis");
daftar_guru.add("Pak Putri");
daftar_guru.add("Bu Marwan");
daftar_guru.add("Pak Ugik");

Perintah di atas digunakan untuk mengisi ArrayList daftar_guru dengan beberapa data.

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,R.layout.support_simple_spinner_dropdown_item,daftar_guru);

spinner.setAdapter(adapter);

Baris kode di atas digunakan untuk membuat objek Adapter ArrayString baru, kemudian di-set / dipasang pada spinner.

Hasil Aplikasi

Kesimpulan

Spinner adalah elemen yang digunakan untuk membentuk suatu pilihan dropdown item yang berasal dari suatu array. Untuk membuat spinner kita dapat membuat Array statis pada XML, Array Statis pada java, dan Array Dinamis yang didapat dari proses get / post.

Terima kasih :).

Cara Membuat Spinner pada Android Studio