Mengenal Constraint Layout pada android development

mengenal constraint layout pada android development

Setelah kita mengenal linear layout dan relative layout pada android development maka kesempatan kali ini kita akan kembali belajar tentang view group yang lebih kompleks dan powerfull yaitu constraint layout.

Constraint layout merupakan layout yang sangat disarankan oleh IDE Android Studio, jika kalian membuat project pertama kali atau membuat empty activity biasanya kalian langsung dibuatin base layoutnya dengan parent constraint layout. Bahkan ketika kalian membuka dokumentasi dari linear maupun relative layout maka kalian akan melihat tulisan seperti ini :

mengenal constraint layout pada android development

Yang artinya "untuk performa lebih baik dan tools pendukung, kamu harus membuat layout dengan menggunakan Constraint Layout". Jangan tanya kenapa, sebagai hamba google yang baik kita tinggal nurut-nurut aja. Berarti apakah kita harus meninggalkan relative dan linear layout? jawabanya iya wkwkwk.

Kalau menurut saya pribadi ya, kenapa google maupun IDE menyarankan menggunakan constraint layout karena constraint benar-benar menghilangkan yang namanya nested view group. Relative layout juga menghilangkan nested view group, terus apa bedanya? YA, Constraint dan relative layout merupakan dua hal yang mirip, saya bisa katakan bahwa constraint merupakan upgrade atau pengembangan dari relative layout, kenapa? karena pengguaan constraint sangat mirip dengan relative, namun juga secara tools, attribute dari constraint jauh lebih powerfull banyak tools-tools yang membantu kita dalam proses development seperti chain, barier, guideline dll, selain itu constraint juga support animation, wah menarik ya.

Jadi Constraint layout itu apa?

Mari kita kembali merujuk ke dokumentasi dari android developers, berikut penjelasan mereka :

A ConstraintLayout is a ViewGroup which allows you to position and size widgets in a flexible way.

Note: ConstraintLayout is available as a support library that you can use on Android systems starting with API level 9 (Gingerbread). As such, we are planning on enriching its API and capabilities over time. This documentation will reflect those changes.

There are currently various types of constraints that you can use:
Relative positioning
Margins
Centering positioning
Circular positioning
Visibility behavior
Dimension constraints
Chains
Virtual Helpers objects
Optimizer

Seperti yang sudah dijelaskan diatas bahwa constraint layout merupakan sebuah view group yang membolehkan kita untuk mengatur posisi dan ukuran widgets dengan suka-suka kita (fleksibel). Constraint layout ini hanya bisa support pada API level 9 (Gingerbread) keatas, jadi jika aplikasi kalian menyasar ke smartphone froyo ke bawah maka tidak disarankan menggunkan constraint layout yah. :)

Diatas juga sudah dijelaskan tentang tools yang bisa digunakan dalam constraint layout, ada relative positioning, margins, chains, helper dll, inilah yang saya katakan sebelumnya bahwa constraint lebih powerfull jika dibandingkan relative layout.

Kali ini saya tidak akan menjelaskan semua tools dari constraint tersebut, kalian bisa explore sendiri ya. Ciri khas dari constraint layout adalah setiap view dia memiliki 4 titik constraint (yang mana dapat ditarik-tarik) ini berfungsi untuk menghubungkan dengan view lainnya atau dengan parent nya dan kalian wajib paling tidak menghubungkan satu titik secara horizontal dan satu lagi secara vertical, jika tidak maka akan terjadi error pada layout kamu dan bisa jadi nanti berantakan kesana kemari view nya.

Relative Positioning

Secara konsep relative positioning ini mirip dengan konsep relative position dari si relative layout, misalkan kita ingin mengatur view A di sebelah kanannya, kirinya, atasnya atau bawah dari view B. Bedanya adalah pada constraint itu kita bisa lebih mudah ngatur-ngaturnya karena adanya titik constraint di setiap sisi viewnya, dengan mode design kita akan lebih cepat dalam membuat layout.

Attribute yang biasanya digunakan sebagai berikut :

layout_constraintTop_toTopOf
layout_constraintTop_toBottomOf
layout_constraintBottom_toTopOf
layout_constraintBottom_toBottomOf
layout_constraintStart_toEndOf
layout_constraintStart_toStartOf
layout_constraintEnd_toStartOf
layout_constraintEnd_toEndOf

Chains

Chains provide group-like behavior in a single axis (horizontally or vertically). The other axis can be constrained independently.

Kalau menurut saya chains ini digunakan untuk membuat beberapa view saling berkaitan secara horizontal maupun vertical, misalnya kita ingin menengahkan 2 atau lebih view secara vertical / horizontal, maka kita bisa menggunakan chains ini (tp tidak hanya menengahkan ya karena banyak jenis chains disini).

Terdapat beberapa style chains, perhatikan gambar berikut :

chains style

Kalian dapat menggunakan chains ini sesuai dengan kebutuan kalian, kalian bisa memilih jenis chains nya sesuai dengan jenis layoutnya, intinya chains ini digunakan untuk mengaitkan antar view.

pada referensi lain ada juga yang mengatakan chains ini mirip dengan weight nya linear layout, konsepnya sama membagi space yang kosong di antara view-view tersebut, tapi saya pikir lebih dari sekedar membagi space kosong sih apalagi terdapat beberapa style chains seperti diatas.

Helpers

Terdapat beberapa helpers pada constraint layout, ada barriers, guideline, group dan layer. Jujur sih kalau yang ini saya jarang sekali pake dan masih belum terlalu membutuhkan helpers ini, tapi yang jelas kita patut tahu dan apa sih kegunaan helpers ini.

Anda dapat mempelajari secara detail disini : https://constraintlayout.com/basics/ karena saya sendiri masih kesulitan menjelaskan ke dalam bahasa yang mudah dimengerti, saya juga masih belajar tentang constraint layout ini hehe

Contoh dan Latihan

Untuk latihan dan contohnya anda bisa mengikuti training dari android developer di website berikut https://developer.android.com/training/constraint-layout/ disana dijelaskan secara detail sekali dan sangat recomended sekali untuk mencoba dan sangat mudah di pelajari.

Kesimpulan

Constraint Layout sangat powerfull kalau dibandingkan dengan layout yang lain, saya pikir ini adalah upgrade dari linear dan relative layout sangat banyak tools yang memudahkan kita untuk proses layouting.

Constraint layout cocok digunakan untuk UI yang kompleks, dia juga telah menghilangkan nested view group sehingga mempercepat proses rendering layout.

Ciri khasnya adalah titik constraint disetiap sisi view, harus setidaknya menghubungkan titik tersebut minimal satu secara vertical dan satu secara horizontal. Mempunyai tools yang menarik seperti chains, centering, barriers, guidelines, group, layer dan masih banyak lagi.

Constraint layout juga support keyframe animation (ini kita belum bahas ya)

sumber :

Mungkin itu sedikit tentang constraint layout semoga mudah dipahami, silahkan explore secara mendalam tentang constraint layout karena inilah layout masa depan android kemungkinan linear dan relative akan dihapus deh wkwwk.

Jangan lupa like fans page kita di https://facebook.com/myquotes10 untuk mendapatkan update terbaru tentang blog ini dan postingan menarik lainnya. thank you jangan lupa koding hari ini

Mengenal Constraint Layout pada android development