Membuat Spinner Bertingkat di Basic4Android
Pernahkah kamu melihat dalam suatu aplikasi Android terdapat Spinner atau ComboBox yang isinya tergantung dari isi Spinner yang lain? Misalnya, dalam aplikasi itu ada pilihan Kategori dan Sub Kategori. Saat dipilih kategori Elektronik, lalu di Spinner Sub Kategori hanya akan berisi sub kategori dari Elektronik, misal: Komputer, Handphone, Televisi, dll. Atau juga ada pilihan Provinsi dan Kota. Saat dipilih Provinsi Jawa Barat, lalu di Spinner Kota hanya akan berisi kota-kota dari Provinsi Jawa Barat.
Nah, kalau seperti itu bagaimana sih cara membuatnya? Oke, jangan khawatir, saya akan share tutorial cara membuatnya di sini.
Membuat Database dan Table
Dalam tutorial ini, kita membutuhkan sebuah database SQLite, dengan nama (misalnya) myspinner, dengan dua buah table dengan nama: provinsi dan kota.
Kemudian tambahkan beberapa record pada masing-masing table, seperti gambar di bawah ini.
Table provinsi
Table kota
Jika database sudah dibuat, pastikan database-nya (myspinner.db) ditaruh di folder Files yang berada di root folder project ini. Kemudian silakan ikuti langkah-langkah berikut…
Membuat Project B4A Baru
Baca juga:
- Buat project baru, lalu save dengan nama: MySpinner.
- Lalu import Code Module: DBUtils. Dan aktifkan library SQL-nya.
Cara import Class atau Code Module bisa lihat postingan ini.
Cara mengaktifkan library SQL bisa lihat poin 5 pada postingan ini.
- Kemudian beralih ke Activity Main. Pada Process_Globals, masukkan code berikut:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
Sub Process_Globals 'These global variables will be declared once when the application starts. 'These variables can be accessed from all modules. 'Deklarasikan variabel object SQL-nya (ini berasal dari Library SQL). Dim SQL As SQL 'Tentukan dimana letak database disimpan, 'Yaitu di root SD Card/Android/data/folder package project/files. Dim DBDir As String : DBDir = File.DirDefaultExternal 'Tentukan nama database yang akan digunakan di project ini. Dim DBName As String : DBName = "myspinner.db" 'Map untuk menampung data di spinner. Dim mProvinsi As Map Dim mKota As Map End Sub |
- Buka jendela Designer dengan mengklik menu Designer.
- Buat layout baru dengan nama: main. Lalu tambahkan object-object seperti gambar berikut:
- Kemudian deklarasikan object spnProvinsi dan spnKota. Untuk spnProvinsi tambahkan event ItemClick.
|
1 2 3 4 5 6 7 8 9 10 11 |
Sub Globals 'These global variables will be redeclared each time the activity is created. 'These variables can only be accessed from this module. Private spnProvinsi As Spinner Private spnKota As Spinner End Sub Sub spnProvinsi_ItemClick (Position As Int, Value As Object) 'Saat spinner provinsi dipilih. End Sub |
- Pada event Activity_Create masukkan code seperti di bawah ini:
|
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 |
Sub Activity_Create(FirstTime As Boolean) 'Do not forget to load the layout file created with the visual designer. For example: 'Panggil layout yg akan digunakan pada activity ini. Activity.LoadLayout("main") 'Set judul untuk activity ini. Activity.Title = "My Spinner" 'Saat Activity pertama kali di-create. If FirstTime Then 'Jika di DBDir belum ada DBName, maka copy-kan DBName ke DBDir. If File.Exists(DBDir, DBName) = False Then File.Copy(File.DirAssets, DBName, DBDir, DBName) End If 'Initialize object SQL-nya. SQL.Initialize(DBDir, DBName, True) End If 'Initialize Map. mProvinsi.Initialize mKota.Initialize 'Disable spinner kota. spnKota.Enabled = False 'Fungsi untuk mengisi data di spinner. FillSpinner End Sub |
- Buat fungsi baru dengan nama: ExecuteSpinner. Fungsi ini digunakan untuk mengisi data di Spinner sesuai dengan parameter-parameter yang dikirimkan.
|
1 2 3 4 5 6 7 8 9 10 |
Sub ExecuteSpinner(List As List, Spinner1 As Spinner, SpinnerMap As Map, Hint As String) Spinner1.Clear Spinner1.Add(Hint) For row = 0 To List.Size-1 Dim Record() As Object = List.Get(row) Spinner1.Add(Record(1)) 'Tampung ID-nya di map. SpinnerMap.Put(Record(1), Record(0)) Next End Sub |
- Buat fungsi baru lagi dengan nama: FillSpinner. Fungsi ini digunakan untuk mengisi data provinsi di Spinner. Untuk Spinner kota akan diisi setelah provinsi dipilih.
|
1 2 3 4 5 |
Sub FillSpinner Dim listProvinsi As List listProvinsi = DBUtils.ExecuteMemoryTable(SQL, "Select id, nama from provinsi", Null, 0) ExecuteSpinner(listProvinsi, spnProvinsi, mProvinsi, "- - Pilih Provinsi - -") End Sub |
- Kemudian pada spnProvinsi_ItemClick, masukkan code berikut.
|
1 2 3 4 5 6 7 8 |
Sub spnProvinsi_ItemClick (Position As Int, Value As Object) 'Saat provinsi dipilih, enable spinner kota. 'Lalu tampilkan data kota sesuai dengan provinsinya. spnKota.Enabled = True Dim listKota As List listKota = DBUtils.ExecuteMemoryTable(SQL, "Select id, nama from kota where provinsi_id = " & mProvinsi.Get(Value), Null, 0) ExecuteSpinner(listKota, spnKota, mKota, "- - Pilih Kota - -") End Sub |
- Save, kemudian Compile/Run project ini dalam versi Release.
- Lalu lihat, apa yang terjadi…
- Saat aplikasi dibuka, semua spinner kosong.
- Saat dipilih Provinsi Jawa Barat, maka Spinner kota akan terisi kota-kota yang ada di Provinsi Jawa Barat.
- Saat dipilih Provinsi Jawa Tengah, maka Spinner kota akan terisi kota-kota yang ada di Provinsi Jawa Tengah.
- Saat dipilih Provinsi Jawa Timur, maka Spinner kota akan terisi kota-kota yang ada di Provinsi Jawa Timur.
Oke, demikian cara membuat Spinner bertingkat di B4A. Semoga bermanfaat. Jika masih ada kesulitan atau problem jangan ragu untuk bertanya di form komentar. Dan… Tetap nantikan juga tutorial-tutorial menarik lainnya seputar Basic4Android.
Happy Coding! 🙂
Silakan download source code lengkapnya di sini.
Related Posts
About The Author
Chairruddin Arrasid
Orang yang suka belajar, juga suka membaca, juga suka menulis, dan juga suka makan kalau lapar. Dulu waktu kecil tidak punya cita-cita jadi programmer, tapi sekarang jadi programmer. Lah? Mungkin dulu masih belum tahu bahwa programming itu menyenangkan.
Maaf pak, Databasnya boleh minta ? kalo bisa program jadinya juga soalnya unutk saya pelajari strukturnya . . kalo boleh prioritas databasenya saja .
Terimakasih telah membagikan ilmu 😀
Sudah saya update post ini, saya tambahkan link download source code-nya.
Boleh kirim ke hackmedev@gmail.com
Sekali lagi terimakasih jika berkenan mengirim .
source code myspinner nya korup.mohon di upload ulang ya
gan ,punya spinner yang dropdownnya bisa di edit warnanya,baik itu warna text,backgroundnya? jika ada bolehkah saya minta?
kang, kalau ada 3 spinner gimana y ? kalau yang akang 2 spinner..
Mas, kalau spinner add image bagaimana caranya yah?
Mas kalau acSpinner add image gmn caranya yah?