Membuat Aplikasi Spinner View Di Android

Pada tutorial Programming Android kali ini kita akan membuat Spinner View yang merupakan salah satu cabang dari User Interface (UI) yang sudah pernah kita buat pada tutorial Membuat User Interface Dasar Pada Aplikasi Android.

Spinner View adalah list dari item pada saat tertentu dan membolehkan user untuk memilihnya. Secara sederhana Spinner View akan menyediakan cara cepat untuk memilih salah satu dari nilai set. Dalam keadaan default, Spinner menunjukkan nilai yang sedang dipilih. Ketika user menyentuh

spinner view maka aplikasi akan menampilkan menu dengan semua nilai-nilai lain yang tersedia, sehingga user dapat memilih item yang baru.

Untuk memudahkan dalam mempelajarinya kita akan langsung membuat aplikasi spinner view sederhana, ikuti langkah-langkah berikut.

Buat project android seperti berikut:
Application Name                     : SpinnerView
Project Name                            : SpinnerView
Package Name                          : com.android.spinnerview
Minimum Required SDK         : Andoid 2.2
Target SDK                                : Android 4.2
Yang lain biarkan default.
Buat file baru spinner di res/layout/spinner.xml dan isi dengan coding sehingga menjadi seperti berikut:
spinner.xml

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    
    <Spinner
	    android:id="@+id/spinner1"
	    android:layout_width="wrap_content"
	    android:layout_height="wrap_content"
	    android:drawSelectorOnTop="true" />
     
</LinearLayout>

Tambahkan coding pada class src/com.android.spinnerview/SpinnerView.java
SpinnerView.java

package com.android.spinnerview;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.Toast;
import android.widget.AdapterView.OnItemSelectedListener;

public class SpinnerView extends Activity {
	String[] tutorial = {
            "Android",
            "PHP",
            "HTML",
            "Java",
            "C++",
            "Laravel",
            "CodeIgniter",
            "CSS",
            "YII",
            "Angular",
            "Node js"
    };
 
    Spinner s1;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.spinner);
		
		 s1 = (Spinner) findViewById(R.id.spinner1);
		 
	        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
	            android.R.layout.simple_spinner_item, tutorial);
	 
	        s1.setAdapter(adapter);
	        s1.setOnItemSelectedListener(new OnItemSelectedListener()
	        {
	            public void onItemSelected(AdapterView<?> arg0, 
	            View arg1, int arg2, long arg3) 
	            {
	                int index = s1.getSelectedItemPosition();
	                Toast.makeText(getBaseContext(), 
	                    "You have selected item : " + tutorial[index], 
	                    Toast.LENGTH_SHORT).show();                
	            }
	 
	            public void onNothingSelected(AdapterView<?> arg0) {}
	        });
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.spinner_view, menu);
		return true;
	}

}

Pastikan file AndroidManifest.xml seperti berikut:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.android.spinnerview"
    android:versionCode="1"
    android:versionName="1.0" >
    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="17" />
    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.android.spinnerview.SpinnerView"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
</manifest>

Kemudian buat satu file java tambahan dengan nama ViewActivity.java dan isikan coding seperti berikut: ViewActivity.java

package com.android.spinnerview;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
 
public class ViewActivity extends Activity 
{
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);         
 
        startActivity(new Intent(this, SpinnerView.class));
 
    }
}

Running aplikasi yang baru saja kita buat dan klik salah satu pilihan pada menu list yang ditampilkan sehingga akan memunculkan pesan dalam bentuk Toast apa yang kita pilih.

 

Ubah cara menampilkan list di SpinnerView.java menjadi seperti berikut:

ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
     android.R.layout.simple_spinner_dropdown_item, tutorial);

Running ulang aplikasi dan lihat perbedaan hasilnya..

Sekian Tutotial Programming kali ini, pada tutorial selanjutnya kita masih akan mempelajari seputar User Interface(UI) pada android. Semoga bermanfaat.
DOWNLOAD CODE

You may also like...

Leave a Reply

Your email address will not be published. Required fields are marked *