Belajar Cara Membuat GridView Sederhana di Android Studio

GridView adalah salah satu class atau library ,yang berupa container(wadah), yang digunakan untuk menampilkan konten View , dalam bentuk kotak-kotak. Lebih mudahnya kalian bisa bayangkan saja ,jika ada sebuah rak lemari , (yang menjadi GridView) , yang dimana kita dapat menyimpan buku ,kertas, barang-barang elektronik (yang menjadi TextView ,ImageView) didalam rak lemari tersebut. Untuk penulisan codingan ,beserta struktur data sebenarnya , sama halnya seperti ListView ,namun dengan cara menampilkan dan memparsing di xml secara grid atau kotak-kotak.  Pada tutorial belajar android kali ini ,kita akan mencoba membuat konten View ,seperti TextView , dan ImageView ,dalam bentuk GridView ,atau bisa kita ingat gampangnya kotak-kotak. Kotak-kotak yang saya maksud disini dilihat secara tatanan atau tata letaknya.

Menampilkan dalam bentuk text (TextView):

1. Pertama pastinya kalian bisa buat project baru ,atau project yang sudah ada di Android Studio.

2. Secara default ,atau standarnya , menurut main resource (developer.android.com). Jika kalian ingin menampilkan data atau konten View ,secara Grid alias kotak-kotak ,kalian bisa menerapkan code berikut :

Codenya bisa kita terapkan langsung , ke activity_main,xml

3.  Nah ,untuk source code ,dari Javanya , kita bisa menggunakan source code ,yang saya sudah bagikan di tutorial belajar android sebelumnya:

Baca sebelumnya:  Belajar Cara Membuat ListView Sederhana di Android


Seperti berikut:


Penjelasan :

Pertama-tama , kita akan buat struktur data Array dengan var atau object ,dari namanegara lalu deklarasi oject dari class GridView. Yang dimana nilai atau valuenya ,akan kita tampilkan dalam bentuk kotak-kotak.

Lalu kita inisialisasi object  dari gridView  yang dimana kita akan parsing ke dalam id gridview ,pada layout XML.

Sama seperti ListView ,disni kita akan menggunakan Adapter yang berfungsi untuk binding data ,memproses dan memformat konten (pull konten)  dari resource seperti Array atau Database ,kemudian di convert setiap item ke dalam tampilan kotak-kotak.

Disini kita menggunakan class ArrayAdapter , yang sudah tersedia di library (android.widget).

Perhatikan,  disini kita akan membuat Argument , berdasarkan nilai atau value dari Parameter ,yang sudah didefinisikan pada Constructor di Class ArrayAdapter.

Syntax nilai atau value dari ArrayAdapter

Argumentnya :

 ArrayAdapter<String> adapter = new ArrayAdapter<String>(MainActivity.this,
                android.R.layout.simple_list_item_1, android.R.id.text1, namanegara);
     

Lalu kita menset datanya ke dalam objek gridView

  gridView.setAdapter(adapter);

Kita ingin jika user atau pengguna , mengclick atau menghandle event salah satu kontenView, pada GridView .sama saja saat kita menggunakan ListView ,kita bisa menggunakan .setOnItemClickListener(new AdapterView.OnItemClickListener() , nah setelah salah satu objek dari gridView dapat menghandle event,  kita ingin  menampilkan reaksi dari handle event tersebut ,sebagai contoh kita akan menggunakan Toast pesan berdasarkan index atau element dari Array pada object namanegara.

4. Lalu kita coba jalankan Aplikasinya,  di Android Studio.

Contoh Hasil Aplikasi GridView Text

---

Menampilkan dalam bentuk gambar(ImageView):

1. Jika ingin menampilkan dalam bentuk gambar , yang pasti kita harus siapkan dulu gambar-gambarnya , yang dimana nanti .kita akan tampilkan dalam bentuk kotak-kotak. Terserah kalian gambarnya mau seperti apa , sebagai contoh disini saya menggunakan gambar-gambar dari EmojiOne.com. Dan jangan lupa copy simpan di folder drawable ,seperti biasanya.

2. Lalu ,kita akan membuat class baru ,dengan nama GambarAdapter , dengan cara klik kanan New > lalu pilih Java Class. 

New Java Class

Pada class GambarAdapter kalian bisa menggunakan codingan berikut:



Penjelasan :

Pertama-tama , agar kita bisa menggunakan beberapa method , yang diperlukan di dalam Adapter. Kita akan mewariskan (extends) class BaseAdapter , ke dalam class GambarAdapter.

Deklarasi  objek Context  context ,yang dimana sebagai penyalur untuk mengakses resource pada Aplikasi Android.

Membuat Constructor dari class GambarAdapter

Method getCount() digunakan untuk  mengembalikan nilai , berdasarkan jumlah item yang ada di dalam list (total list)

Method getItem() digunakan untuk mengambil nilai secara objek ,yang terkait dengan posisi yang ditentukan dalam kumpulan data. Di dalam public method Object ,sebenarnya sudah ada secara built in ,pada library bahasa pemrograman Java. Selengkapnya kalian bisa lihat disini.

Method getItemId() digunakan untuk mengambil nilai ,berdasarkan index(element) yang berhubungan dengan posisi dengan constant id  , yang mewakili objek di dalam list. Karena kita ingin mengakses  konten View yang jenisnya sama(ImageView),maka kita harus mengembalikan nilainya ,berdasarkan urutan awal index(element) yaitu 0.

Method getView digunakan untuk memproses dan mengambil kontenView, yang akan ditampilkan berdasarkan posisi tertentu. Parameter yang di definisikan di dalam getView , contohnya disini int position, View convertView, ViewGroup parent

Didalam method getView ,kita akan menampilkan object dari class ImageView ,lalu kita dapat membuat method dari object , yang dimana kita membangunya secara programatically (bahasa pemrograman).

Setelah itu kita membuat stuktur data Array di dalam class ini , kita menggunakan class Integer dengan objek idGambar , yang dimana untuk mengurutkan nilai atau value nya (nama gambar resource dari R.drawable) , sama dengan tipe data int.

Contoh nama  gambar di resource drawable = nilai int

Dimana untuk mengaksesnya kita menggunakan object imageView, dengan method .setImageResource(idGambar[position]);  akses resource gambar dan tampilkan berdasarkan posisi.

3.  Pada class MainActivity.java ,sebenarnya sama saja ,saat kita menampilkan Text(TextView), hanya  saja lebih di pangkas sedikit,  penulisan codinganya.


MainActivity.java


4. Kita jalankan Aplikasinya ,hasilnya kira-kira akan terlihat seperti ini:

Contoh Hasil Aplikasi GridView Gambar

Demikian ,kurang lebih begitulah cara membuat GridView Sederhana, pada Aplikasi Android. Yang dimana kita menampilkanya dalam bentuk kotak-kotak ,dari Konten View yang berupa Text(TextView) dan juga Gambar (ImageView).

Location:

Share :