Jetpack Compose - Modifier

Penting

Pembahasan ini merupakan rentetan dari topik pembahasan tentang Dasar Dasar Jetpack Compose, terdapat hampir 100 pembahasan, untuk melihat daftarnya silahkan klik DAFTAR PEMBAHASAN COMPOSE

Pengertian

Modifier adalah atribut penting dalam Jetpack Compose yang digunakan untuk mengubah tampilan dan perilaku dari komponen-komponen UI. Dengan Modifier, kalian dapat menyesuaikan berbagai aspek dari sebuah komponen, seperti padding, warna latar belakang, ukuran, rotasi, dan banyak lagi.

Ini memungkinkan kalian untuk menambahkan efek visual, mengatur interaksi pengguna, atau mengatur posisi dan tata letak dari komponen-komponen dalam tampilan kalian.

Dengan menggunakan Modifier, kalian bisa membuat antarmuka pengguna yang lebih fleksibel dan dinamis, karena kalian dapat mengubah properti komponen dengan mudah dalam kode kalian. Modifier memungkinkan kalian untuk menyesuaikan setiap aspek dari tampilan komponen sesuai dengan kebutuhan aplikasi kalian.

Method-method/fungsi yang dapat digunakan

padding: Menambahkan ruang kosong di sekeliling komponen.

background: Menentukan warna atau gambar latar belakang komponen.

size: Menentukan ukuran komponen.

width: Menentukan lebar komponen.

height: Menentukan tinggi komponen.

border: Menambahkan garis tepi pad**a komponen.

clickable: Membuat komponen menjadi dapat diklik.

scrollable: Mengatur komponen agar dapat digulirkan jika kontennya terlalu besar untuk muat dalam area yang tersedia.

clip: Memotong atau membatasi area tampilan komponen.

align: Menentukan tata letak atau penempatan komponen dalam kontainer.

rotation: Memutar komponen.

scale: Mengubah ukuran komponen secara proporsional.

alpha: Mengatur tingkat transparansi komponen.

offset: Menggeser posisi komponen.

constrainAs: Menentukan batasan tata letak dalam ConstraintLayout.

paddingFrom: Menentukan ruang kosong relatif terhadap komponen lain dalam ConstraintLayout.

widthIn: Mengatur lebar komponen relatif terhadap komponen lain dalam ConstraintLayout.

heightIn: Mengatur tinggi komponen relatif terhadap komponen lain dalam ConstraintLayout.

fillMaxSize: Mengisi komponen dengan ukuran maksimum yang tersedia dalam kontainer.

fillMaxWidth: Mengisi komponen dengan lebar maksimum yang tersedia dalam kontainer.

fillMaxHeight: Mengisi komponen dengan tinggi maksimum yang tersedia dalam kontainer.

paddingFromBaseline: Menambahkan padding dari baseline teks.

alignBy: Menentukan posisi komponen berdasarkan referensi komponen lain.

offsetBy: Menggeser posisi komponen berdasarkan referensi komponen lain.

backgroundLayer: Menambahkan lapisan latar belakang ke komponen.

Cara Penggunaan

Pada sample penggunaan diatas, Modifier kita gunakan untuk mengatur warna background dan mengatur rounded dari backgroud yang sudah diberi warna, agar proporsional, saya tambahkan padding diakhir method background. Perlu di ingat bahwasanya peletakan method dapat mempengaruhi cara kerja modifier itu sendiri

Video