Android Basic #2 — Harus pake ViewGroup yang mana ya?
Objective:
- Cara memilih jenis ViewGroup yang pas untuk membuat aplikasi Android
Aloha Chevas…
Selamat datang kembali di serial Android Basic, sesuai judulnya kita sekarang akan mempelajari gimana sih caranya memilih jenis ViewGroup (Layout) yang pas untuk tampilan Android app kita? Anyway, kalau teman-teman mau sambil mencoba, silakan gunakan Android Studio untuk latihan. Kalau belum pernah menyentuh Android Studio sama sekali gimana kak? Santai, bisa mampir ke tutorial di bawah ini dulu yaaa… 👌
So… Jenis-jenis ViewGroup (layout) untuk Android XML tuh banyak banget, tapi di sini kita akan ambil beberapa yang paling sering digunakan, seperti LinearLayout, RelativeLayout, ScrollView, etc. By the way, untuk pembahasan kali ini, kodingannya gak terlalu banyak kok, kita cuma ngobrolin jenis-jenis dan penggunaan komponennya secara general ya.
Jenis-Jenis Layout dan Views
ConstraintLayout
Ini adalah ViewGroup default atau bawaan Android Studio pas kita membuat project baru. Tujuan dari ConstraintLayout ini adalah membuat tampilan yang rumit menjadi lebih mudah dan memiliki sifat responsive (mengikuti dimensi perangkat yang berbeda).
Apa yang bikin ConstraintLayout beda dengan ViewGroup yang lain? Nah, jawabannya Constraint Chain. Ada 4 constraint chain yang disebut anchorpoint. Nah, komponen di layout ini bisa di-constraint dengan komponen lain menggunakan id-nya atau langsung di-constraint dengan parent seperti .gif di bawah.
Nah, 4 lingkaran yang ada di .gif tersebut namanya anchorpoint dengan jenis-jenisnya, yaitu:
- ConstraintTop = Menghubungkan sisi atas komponen dengan komponen lain
- ConstraintBottom = Menghubungkan sisi bawah komponen dengan komponen lain
- ConstraintLeft / ConstraintStart (untuk API 17+) = Menghubungkan sisi kiri komponen dengan komponen lain
- ConstraintRight / ConstraintEnd (untuk API 17+) = Menghubungkan sisi kanan komponen dengan komponen lain
RelativeLayout
Sesuai namanya, ViewGroup ini menggunakan sistem relasi. Tujuan dari RelativeLayout sendiri untuk membuat tampilan yang cukup rumit dan sulit. Mirip ConstraintLayout, cuma bedanya RelativeLayout tidak terlalu memerhatikan 4 aspek Top/Bottom/Left (Start)/Right (End), cukup id dari komponen yang kita mau hubungkan saja. Jadi, bisa dibilang, RelativeLayout adalah simple version of ConstraintLayout.
Contohnya ada di gambar atas ini. Kita bisa memakai ConstraintLayout, cuma terlalu “ribet” karena kita harus ada masing-masing constraint/anchorpoint-nya, so… RelativeLayout might help. Cukup drag and drop komponen ke Blueprint, lalu setting relasinya ke komponen yang kita mau, bisa lihat di .gif ini ya.
Karena ConstraintLayout dan RelativeLayout ini bisa dimanfaatkan untuk membuat responsive UI, nah… Teman-teman bisa mampir ke Android ConstraintLayout documentaion-nya ya untuk referensi bagaimana implementasiinnya.
LinearLayout
Nah kalau ViewGroup ini biasanya banyak digunakan untuk membuat tampilan super simple. LinearLayout hanya menampilkan tampilan dengan orientasi full vertical ataupun full horizontal. Nah, beda sama Relative ataupun Constraint, posisi komponen di jenis layout ini tidak bisa diubah kecuali menggunakan metode nested LinearLayout-ing atau fitur margin. Nah, contoh tampilan LinearLayout sendiri seperti di bawah.
ScrollView
Nah… Dari namanya, berarti fungsinya langsung ketebak ya? Sip, untuk memperjelas, nah ScrollView ini untuk tampilan yang perlu nge-scroll apabila melebihi kapasitas dimensi perangkat, misalkan halaman detail pada suatu aplikasi, halaman biodata, halaman settings, dan halaman overflowed lainnya.
Sifat orientasi ScrollView juga dapat diatur seperti LinearLayout, sehingga aplikasi dapat di-scroll secara vertical ataupun horizontal. Selain itu ViewGroup ini memiliki sifat lain, yaitu harus memiliki child ViewGroup. Jadi, dia tidak dapat berdiri sendiri, harus ada layout lain yang akan menampung komponen-komponennya, misalkan seperti hirarki di bawah.
CardView
Ini adalah layout yang memiliki fitur background shadow dan corner radius. Fungsinya untuk membuat tampilan UI yang unik dan menarik. Contohnya ada di screenshot data makanan berikut.
Biasanya, CardView dimanfaatin untuk nampilin item per item dari RecyclerView. Apa itu RecyclerView? Nah… Tunggu yaaa, pasti dibahas di tutorial yang akan datang, stay tune ya! By the way, Sama seperti ScrollView, salah satu sifatnya harus ada child layout, jadi di dalam CardView ada layout lain, misalnya RelativeLayout. Jadi, hirarkinya kurang-lebih begini.
Nah itu semua ringkasan ViewGroups a.k.a Layout apa saja yang biasa digunakan Android developer untuk membuat aplikasi Android tingkat sederhana sampai yang rumit. Untuk lebih detail-nya lagi, teman-teman bisa explore lebih lanjut di Android documentation tentang UI dan coba untuk experiment yaaa! Untuk Android Basic #2 segini dulu yaa… Wait for the next part okay?
See you next time!
