WebÖğren Ücretsiz Online Eğitimler
Spinner‘ların ne olduğu ve nasıl çalıştıkları ile ilgili esasen bilgili oldunuz. Öyleyse bir örneğe bakalım ve onu Android Uygulamamızda nasıl uygulayabileceğimizi öğrenelim.
Bu eğitimde, bağımsız iki Spinner ile çalışan bir uygulama oluşturacağız. Uygulamanın ana düzeni, bir TextView ve alt bileşen görünümleri olarak iki Spinner içerecektir. Bu nedenle, bir Spinnerin TextView’un altına yerleştirildiği ve diğer spinnerin ilk spinnerin altına yerleştirildiği düzeni (aşağıdaki görselde gösterilen) özelleştirmemiz gerekiyor.
İkinci Spinner içindeki seçenekler, ilk Spinnerda ne seçtiğimize bağlı olacağından, başlangıçta ikinci spinner gizlenecek ve sadece kullanıcı ilk spinnerdan bir seçenek seçtiğinde görünecektir.
İkinci spinner, isVisible eşittir GONE özelliğini sunantir; bu, düzende var olduğu, yalnız görünür olmayacağı (ya da gizleneceği) anlamına gelir.
Bu nedenle, aşağıdaki görselde, orada değil gibi görünüyor. Ancak orada olup olmadığını görmek için isVisible işaretini VISIBLE olarak değiştirmeyi deneyebilirsiniz. Ama sonra şimdilik GONE olarak değiştirin.
İlk Spinner(classSpinner) kullanıcı tarafından seçilecek iller listesini ve bu seçime göre dşayetleri ikinci Spinner(divSpinner) a atayacağız. Kullanıcı ikinci spinner’dan da bir opsiyon seçtiğinde, bir Tost oluşturacağız ve seçilen dşayetleri ekranda görüntüleyeceğiz.
Öyleyse başlayalım, burada düzen XML dosyasına sahibiz. İsterseniz, mahalli makinenizde bu örnekle başlamak için aşağıdaki XML’i kopyalayıp yapıştırın.
main_activity.xml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout 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" tools:context="com.example.tkodlama.MainActivity"> <TextView android:id="@+id/textView" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentStart="true" android:layout_alignParentTop="true" android:gravity="center" android:text="TASARIM KODLAMA" android:layout_alignParentLeft="true" /> <Spinner android:id="@+id/spinnerIller" android:layout_width="match_parent" android:layout_height="40dp" android:layout_below="@+id/textView" android:layout_marginTop="25dp" android:entries="@array/iller" /> <Spinner android:id="@+id/spinnerIlceler" android:visibility="gone" android:layout_width="match_parent" android:layout_height="40dp" android:layout_below="@id/spinnerIller" android:layout_marginTop="10dp" /> </RelativeLayout> |
NOT: Bunda bir hata alıyorsanız, bunun sebebi aşağıdaki veri XML dosyasını henüz oluşturmamış olmanızdır. Bunu oluşturduktan sonra, bu dosyadaki hata çözülecektir.
Gördüğünüz gibi, xml dosyası içinde bir kaç özelliğin yanı sıra bir TextView ve iki Spinner görünümüne sahibiz.
Spinner unsur eklemek için, ona bir dizi seçenek sunmanın iki olası yolu vardır. Bir dizi bildirerek ve içindeki unsurları tanımlayarak. Ancak bu örnek için diğer yolu deneyeceğiz, yani bir XML kullanarak.Aşağıda strings.xml dosyasında gösterdiğimiz gibi XML’de bir string dizisi tanımlayabiliriz. Android’de, strings.xml dosyamız gibi veri XML dosyalarını app → res → işaretler → strings.xml içine koymalıyız.
string.xml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 |
<resources> <string name="app_name">Tasarım Kodlama</string> <string-array name="iller"> <item>İstanbul</item> <item>Ankara</item> <item>Edirne</item> <item>Konya</item> </string-array> <string-array name="ilceler_34"> <item>Bakırköy</item> <item>Esenler</item> <item>Bağcılar</item> <item>Beylikdüzü</item> </string-array> <string-array name="ilceler_06"> <item>Beypazarı</item> <item>Kızılcahamam</item> <item>Çankaya</item> <item>Polatlı</item> </string-array> <string-array name="ilceler_22"> <item>Enez</item> <item>Havsa</item> <item>İpsala</item> <item>Keşan</item> </string-array> <string-array name="ilceler_42"> <item>Beyşehir</item> <item>Bozkır</item> <item>Ahırlı</item> <item>Çeltik</item> </string-array> </resources> |
Şimdiye kadar, aşağıdaki şeylerle işimiz bitti:
1 TextView ve 2 Spinner‘a sahip olacak olan Android Uygulamamızda oluşturduğumuz dizaynı anladık.
Kullanıcı kullanıcı arayüzü için layout XML’i tanımladık.
Ayrıca Spinnerlar için veri setimizi tanımladık.
Veri kümemizde, unsurları açılır listede görüntülemek için iller isimli string dizisi spinnerIller‘e atanacaktır.
Bu girişleri spinnere eklemek için tek yapmamız gereken, main_activity düzeni XML dosyasına android:entries=”@array/iller” özelliğini eklemek. Bunu yapmak, iller dizisinde bulunan işaretleri spinnerIllere atayacaktır.
Kullanıcının ilk spinnerdaki opsiyonu seçmesine bağlı olarak, ikinci Spinner, ilk spinner tercihine dayalı seçeneklerle beraber görünecektir. Kullanıcı, çalışma zamanında, yani hareketli olarak ilk açılır menüden seçeceği için bunu Java kodu vasıtasıyla yapacağız.
GUI olaylarını sürdürmek için MainActivity.java dosyasının içindeki kodu uygulamamız gerekiyor. Her iki spinnerın örneklerini oluşturarak başlayacağız ve sonrasında her iki spinnera setOnItemSelectedListener() atayacağız.
MainActivity.java
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
package com.example.tkodlama; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.AdapterView; import android.widget.Spinner; public class MainActivity extends AppCompatActivity { Spinner spinnerIller,spinnerIlceler; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); spinnerIller = (Spinner) findViewById(R.id.spinnerIller); spinnerIlceler = (Spinner) findViewById(R.id.spinnerIlceler); spinnerIller.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) { } @Override public void onNothingSelected(AdapterView<?> adapterView) { } }); spinnerIlceler.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) { } @Override public void onNothingSelected(AdapterView<?> adapterView) { } }); } } |
Birinci Spinner işaretine göre ikinci Spinner İşaretini Değiştirme
spinnerIller‘in onItemSelected() metodunun içinde, açılır listeden seçilen unsuru almanız ve bu işarete bağlı olarak, string dizisi kaynağından spinnerIlceler‘e girişler, yani seçenekler atamanız gerekir. Aşağıdaki kodu spinnerIller‘in onItemSelected() tekniğinin içine ekleyin.
MainActivity.java
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 |
package com.example.tkodlama; import androidx.appcompat.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 { Spinner spinnerIller,spinnerIlceler; String seciliIl, seciliIlce; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); spinnerIller = (Spinner) findViewById(R.id.spinnerIller); spinnerIlceler = (Spinner) findViewById(R.id.spinnerIlceler); spinnerIller.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) { seciliIl = adapterView.getSelectedItem().toString(); switch (seciliIl) { case "İstanbul": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_22))); break; case "Ankara": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_06))); break; case "Edirne": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_22))); break; case "Konya": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_42))); break; } spinnerIlceler.setVisibility(View.VISIBLE); } @Override public void onNothingSelected(AdapterView<?> adapterView) { } }); spinnerIlceler.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) { } @Override public void onNothingSelected(AdapterView<?> adapterView) { } }); } } |
spinnerIllerden seçilen adın işaretini alabiliriz. Bunun için apadapterView.getSelectedItem().toString() metodunu kullandık. Burada ebeveyn, spinnerIller görünümünün değeridir.
İlk açılır menüde sınıfın adını seçtikten sonra, ikinci açılır menüyü makul işaretlerle başlatmak için kolay bir geçiş durumu kullanabiliriz.
Bir ArrayAdapter’ı ilgili string-array ile başlatacağız ve adaptörü ikinci spinner spinnerIlcelerimize yönlendireceğiz.
XML’deki dize kaynağından dize dizisine erişmek için getResources().getStringArray(ID_ARRAY) tekniğini kullanmamız gerekecek.
Ve sonunda, ikinci spinner visibility özelliğini VISIBLE olarak ayarlayacağız.
Seçilen işaretleri göstermek için bir Toast oluşturma
Ardından, kullanıcı ikinci Spinner’dan bir seçenek seçtiğinde, bir Tost oluşturacağız ve seçilen işaretleri ekranda görüntüleyeceğiz.
|
1 2 3 4 5 6 7 |
seciliIlce = adapterView.getSelectedItem().toString(); String mesaj = String.format("Seçilen İl:%s ve Seçilen İlçe:%s",seciliIl,seciliIlce); Toast.makeText(getApplication(), mesaj, Toast.LENGTH_LONG).show(); |
Tüm MainActivity Kodları:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 |
package com.example.tkodlama; import androidx.appcompat.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 { Spinner spinnerIller,spinnerIlceler; String seciliIl, seciliIlce; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); spinnerIller = (Spinner) findViewById(R.id.spinnerIller); spinnerIlceler = (Spinner) findViewById(R.id.spinnerIlceler); spinnerIller.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) { seciliIl = adapterView.getSelectedItem().toString(); switch (seciliIl) { case "İstanbul": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_22))); break; case "Ankara": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_06))); break; case "Edirne": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_22))); break; case "Konya": spinnerIlceler.setAdapter(new ArrayAdapter<String>(MainActivity.this, R.layout.support_simple_spinner_dropdown_item, getResources().getStringArray(R.array.ilceler_42))); break; } spinnerIlceler.setVisibility(View.VISIBLE); } @Override public void onNothingSelected(AdapterView<?> adapterView) { } }); spinnerIlceler.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() { @Override public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) { seciliIlce = adapterView.getSelectedItem().toString(); String mesaj = String.format("Seçilen İl:%s ve Seçilen İlçe:%s",seciliIl,seciliIlce); Toast.makeText(getApplication(), mesaj, Toast.LENGTH_LONG).show(); } @Override public void onNothingSelected(AdapterView<?> adapterView) { } }); } } |
Android programınızı çalıştırdığınız zaman, ilk unsur esasen spinnera atanmış olmasından varsayılan olarak ilk toast mesajını alacaksınız. Bunun için endişelenme. Sadece gidin ve birinci bölüm açılır menüleri için spinner seçimini değiştirmeye çalışın ve sonuçları aşağıdaki görseller gibi görmelisiniz.
