Bagikan melalui


Xamarin.Android Spinner

Spinner adalah widget yang menyajikan daftar drop-down untuk memilih item. Panduan ini menjelaskan cara membuat aplikasi sederhana yang menampilkan daftar pilihan di Spinner, diikuti dengan modifikasi yang menampilkan nilai lain yang terkait dengan pilihan yang dipilih.

Spinner Dasar

Di bagian pertama tutorial ini, Anda akan membuat widget spinner sederhana yang menampilkan daftar planet. Saat planet dipilih, pesan toast menampilkan item yang dipilih:

Example screenshots of HelloSpinner app

Mulai proyek baru bernama HelloSpinner.

Buka Sumber Daya/Tata Letak/Main.axml dan sisipkan XML berikut:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:padding="10dip"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dip"
        android:text="@string/planet_prompt"
    />
    <Spinner
        android:id="@+id/spinner"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:prompt="@string/planet_prompt"
    />
</LinearLayout>

Perhatikan bahwa TextViewatribut Spinnerdan android:text atribut 's android:prompt keduanya mereferensikan sumber daya string yang sama. Teks ini berulah sebagai judul untuk widget. Saat diterapkan ke Spinner, teks judul akan muncul dalam dialog pemilihan yang muncul saat memilih widget.

Edit Sumber Daya/Nilai/Strings.xml dan ubah file agar terlihat seperti ini:

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <string name="app_name">HelloSpinner</string>
  <string name="planet_prompt">Choose a planet</string>
  <string-array name="planets_array">
    <item>Mercury</item>
    <item>Venus</item>
    <item>Earth</item>
    <item>Mars</item>
    <item>Jupiter</item>
    <item>Saturn</item>
    <item>Uranus</item>
    <item>Neptune</item>
  </string-array>
</resources>

Elemen kedua <string> menentukan string judul yang dirujuk oleh TextView dan Spinner dalam tata letak di atas. Elemen <string-array> mendefinisikan daftar string yang akan ditampilkan sebagai daftar di Spinner widget.

Sekarang buka MainActivity.cs dan tambahkan pernyataan berikut using :

using System;

Selanjutnya, sisipkan kode berikut untuk OnCreate()metode ) :

protected override void OnCreate (Bundle bundle)
{
    base.OnCreate (bundle);

    // Set our view from the "Main" layout resource
    SetContentView (Resource.Layout.Main);

    Spinner spinner = FindViewById<Spinner> (Resource.Id.spinner);

    spinner.ItemSelected += new EventHandler<AdapterView.ItemSelectedEventArgs> (spinner_ItemSelected);
    var adapter = ArrayAdapter.CreateFromResource (
            this, Resource.Array.planets_array, Android.Resource.Layout.SimpleSpinnerItem);

    adapter.SetDropDownViewResource (Android.Resource.Layout.SimpleSpinnerDropDownItem);
    spinner.Adapter = adapter;
}

Setelah tata Main.axml letak diatur sebagai tampilan konten, Spinner widget diambil dari tata letak dengan FindViewById<>(int). Tje CreateFromResource() metode kemudian membuat baru ArrayAdapter, yang mengikat setiap item dalam array string ke tampilan awal untuk Spinner (yaitu bagaimana setiap item akan muncul di spinner ketika dipilih). Resource.Array.planets_array ID mereferensikan yang string-array ditentukan di atas dan Android.Resource.Layout.SimpleSpinnerItem ID mereferensikan tata letak untuk tampilan spinner standar, yang ditentukan oleh platform. SetDropDownViewResource dipanggil untuk menentukan tampilan untuk setiap item saat widget dibuka. Terakhir, ArrayAdapter diatur untuk mengaitkan semua itemnya dengan dengan Spinner mengatur Adapter properti .

Sekarang berikan metode panggilan balik yang memberi tahu aplikasi ketika item telah dipilih dari Spinner. Seperti inilah metode ini akan terlihat:

private void spinner_ItemSelected (object sender, AdapterView.ItemSelectedEventArgs e)
{
    Spinner spinner = (Spinner)sender;
    string toast = string.Format ("The planet is {0}", spinner.GetItemAtPosition (e.Position));
    Toast.MakeText (this, toast, ToastLength.Long).Show ();
}

Saat item dipilih, pengirim ditransmisikan ke Spinner sehingga item dapat diakses. Position Menggunakan properti pada ItemEventArgs, Anda dapat mengetahui teks objek yang dipilih, dan menggunakannya untuk menampilkan Toast.

Jalankan aplikasi; akan terlihat seperti ini:

Screenshot example of Spinner with Mars selected as the planet

Spinner Menggunakan Pasangan Kunci/Nilai

Seringkali perlu digunakan Spinner untuk menampilkan nilai kunci yang terkait dengan beberapa jenis data yang digunakan oleh aplikasi Anda. Karena Spinner tidak berfungsi langsung dengan pasangan kunci/nilai, Anda harus menyimpan pasangan kunci/nilai secara terpisah, mengisi Spinner dengan nilai kunci, lalu menggunakan posisi kunci yang dipilih di Spinner untuk mencari nilai data terkait.

Dalam langkah-langkah berikut, aplikasi HelloSpinner dimodifikasi untuk menampilkan suhu rata-rata untuk planet yang dipilih:

Tambahkan pernyataan berikut using ke MainActivity.cs:

using System.Collections.Generic;

Tambahkan variabel instans berikut ke MainActivity kelas . Daftar ini akan menampung pasangan kunci/nilai untuk planet dan suhu rata-ratanya:

private List<KeyValuePair<string, string>> planets;

Dalam metode , OnCreate tambahkan kode berikut sebelum adapter dinyatakan:

planets = new List<KeyValuePair<string, string>>
{
    new KeyValuePair<string, string>("Mercury", "167 degrees C"),
    new KeyValuePair<string, string>("Venus", "464 degrees C"),
    new KeyValuePair<string, string>("Earth", "15 degrees C"),
    new KeyValuePair<string, string>("Mars", "-65 degrees C"),
    new KeyValuePair<string, string>("Jupiter" , "-110 degrees C"),
    new KeyValuePair<string, string>("Saturn", "-140 degrees C"),
    new KeyValuePair<string, string>("Uranus", "-195 degrees C"),
    new KeyValuePair<string, string>("Neptune", "-200 degrees C")
};

Kode ini menciptakan penyimpanan sederhana untuk planet dan suhu rata-rata terkait. (Dalam aplikasi dunia nyata, database biasanya digunakan untuk menyimpan kunci dan data terkaitnya.)

Segera setelah kode di atas, tambahkan baris berikut untuk mengekstrak kunci dan memasukkannya ke dalam daftar (dalam urutan):

List<string> planetNames = new List<string>();
foreach (var item in planets)
    planetNames.Add (item.Key);

Teruskan daftar ini ke ArrayAdapter konstruktor (bukan planets_array sumber daya):

var adapter = new ArrayAdapter<string>(this,
    Android.Resource.Layout.SimpleSpinnerItem, planetNames);

Ubah spinner_ItemSelected sehingga posisi yang dipilih digunakan untuk mencari nilai (suhu) yang terkait dengan planet yang dipilih:

private void spinner_ItemSelected(object sender, AdapterView.ItemSelectedEventArgs e)
{
    Spinner spinner = (Spinner)sender;
    string toast = string.Format("The mean temperature for planet {0} is {1}",
        spinner.GetItemAtPosition(e.Position), planets[e.Position].Value);
    Toast.MakeText(this, toast, ToastLength.Long).Show();
}

Jalankan aplikasi; roti panggang akan terlihat seperti ini:

Example of planet selection displaying temperature

Sumber

Bagian halaman ini adalah modifikasi berdasarkan pekerjaan yang dibuat dan dibagikan oleh Proyek Sumber Terbuka Android dan digunakan sesuai dengan istilah yang dijelaskan dalamLisensi Atribusi Creative Commons 2.5.