Pengantar Jetpack Compose

Dec 10 2022
Jetpack Compose adalah toolkit UI modern yang baru-baru ini diluncurkan oleh Google yang digunakan untuk membangun UI Android asli. Ini menyederhanakan dan mempercepat pengembangan UI dengan lebih sedikit kode, API Kotlin, dan alat canggih.

Jetpack Compose adalah toolkit UI modern yang baru-baru ini diluncurkan oleh Google yang digunakan untuk membangun UI Android asli. Ini menyederhanakan dan mempercepat pengembangan UI dengan lebih sedikit kode, API Kotlin, dan alat canggih.

Komposisi Jetpack memberi kita kesempatan untuk membuat antarmuka pengguna yang berbeda yang disebut Kerangka Deklaratif dan melakukan transaksi ini secara asli.

Anda dapat melihat bahwa kode yang ditulis dengan Flutter dan React Native, membuat antarmuka pengguna, dan sekarang Anda dapat melakukan semua ini dengan Jetpack Compose.

Catatan : Jetpack Compose dirilis pada Maret 2021. Anda memerlukan Android Studio Artic Fox untuk menggunakan Compose yang berfungsi minimal sdk 21 .

Mengapa kita harus menggunakan Jetpack Compose?

  • Deklaratif: Ini sepenuhnya deklaratif sehingga Anda dapat mendeskripsikan komponen UI Anda dengan memanggil beberapa fungsi yang telah ditentukan sebelumnya.
  • Kompatibel: Ini mudah kompatibel dengan tampilan yang ada di Android.
  • Tingkatkan kecepatan pengembangan: Sebelumnya developer harus mengerjakan file XML dan file Kotlin. Namun dengan bantuan jetpack compose ini menjadi mudah dan developer hanya perlu mengerjakan file Kotlin karena itu akan membantu developer dalam meningkatkan kecepatan pengembangan.
  • Kotlin Ringkas dan Idiomatis: Jetpack Compose membangun UI dengan manfaat yang diberikan Kotlin.
  • Mudah dipelihara: Karena basis kode aplikasi apa pun ada dalam satu file. Menjadi mudah untuk mengelola dan menangani basis kode aplikasi.
  • Ditulis dalam Kotlin: Aplikasi yang ditulis menggunakan jetpack compose menggunakan 100% bahasa pemrograman Kotlin.

Dengan fitur baru yang disertakan dengan Compose, Anda dapat melihat keluaran tanpa emulator.

Buat project dengan memilih Empty Compose Activity baru dan periksa struktur utama Jetpack Compose.

Aktivitas Tulis Kosong Baru

Saat kita memilih Empty Compose Activity, kelas MainActivity akan muncul seperti di bawah ini.

Hal pertama yang Anda perhatikan bahwa Main Activity diwarisi dari ComponentActivity , bukan AppCompatActivity.

Tinjau ke gradle, dengan Jetpack Compose Anda akan melihat bidang telah ditambahkan tepat seperti di bawah ini.

Jika membuka proyek sebagai EmptyActivity, Anda perlu menambahkan dependensi seperti di bawah ini.

Kami mengatakan bahwa Anda dapat melihat desainnya tanpa build in runtime.

Saat kita memilih Split view, kita bisa melihat pratinjau kode Kotlin yang kita tulis.

@Anotasi pratinjau: Anda dapat menambahkan parameter secara manual dalam kode untuk menyesuaikan cara Android Studio merender anotasi pratinjau.

Pada saat yang sama kami ingin melihat semua layar atau item, kami dapat menambahkan item di bawah anotasi.

Fungsi yang dapat dikomposisi adalah elemen dasar dari aplikasi yang dibuat dengan Compose.
Composable dapat diterapkan ke fungsi atau lambda untuk menunjukkan bahwa fungsi/lambda dapat digunakan sebagai bagian dari komposisi untuk mendeskripsikan transformasi dari data aplikasi menjadi pohon atau hierarki.

Kode di bawah menjadikan objek TextView yang ada di xml, sebagai Composable.

Kelas teks adalah kelas yang dapat disusun yang memiliki terlalu banyak parameter.

Jika kita memulai aktivitas normal, kita memberikan satu tata letak ke dalam setContentView tetapi sekarang untuk menulis kita menggunakan setContent .

Di kelas setContent, Anda dapat melihat bahwa ia menginginkan parameter yang dapat disusun dari kami ditulis seperti di bawah ini.

Salam adalah sebuah komposisi. Kami dapat memberikan penulisan itu ke dalam setContent saat aplikasi dibuka.

Fungsi sederhana apa yang telah kita pelajari di artikel ini untuk saat ini?

  • Fungsi yang Dapat Dikomposisi: Fungsi yang Dapat Dikomposisi direpresentasikan dalam kode dengan menggunakan anotasi @Composable pada nama fungsi. Fungsi ini memungkinkan Anda menentukan UI aplikasi secara terprogram dengan menjelaskan bentuk dan dependensi datanya, bukan berfokus pada proses konstruksi UI.
  • Fungsi Pratinjau: Nama fungsi itu sendiri memberi tahu kita bahwa fungsi tersebut digunakan untuk membuat pratinjau fungsi yang dapat disusun. Ini digunakan untuk menampilkan pratinjau fungsi yang dapat disusun dalam IDE kami daripada menginstal APK kami di emulator atau perangkat virtual.

Jika Anda tertarik dengan SwitfUI di iOS, saya sarankan Anda untuk memeriksa artikel Pınar Koçak .

Sumber daya