Tugas Week 3 - PPB G - 5025221005

  

Tugas 3 - Aplikasi Selamat Ulang Tahun


     

NAMA        : Nabilah Atika Rahma

NRP            : 5025221005

KELAS         : Pemrograman Perangkat Bergerak - PPB G

TAHUN       : 2025


JetPack Compose Guide  - Mengenal Composable




  1. Setup Happy Birthday App with Compose

Untuk memulai, buat proyek baru di Android Studio menggunakan template Empty Activity. Beri nama proyek "Happy Birthday" dan atur minimum SDK ke API 24 (Nougat). Jetpack Compose memungkinkan Anda membangun UI secara deklaratif menggunakan Kotlin, tanpa perlu file XML layout.




  1. What is Jetpack Compose?

Jetpack Compose adalah toolkit modern untuk membangun UI Android. Dengan anotasi @Composable, Anda dapat mendefinisikan UI secara hierarkis dan dinamis. Compose menyederhanakan pengembangan UI dengan kode yang lebih sedikit dan fitur seperti pratinjau langsung di Android Studio.


  1. Design pane in Android Studio

Gunakan Design Pane di Android Studio untuk melihat pratinjau UI tanpa menjalankan aplikasi. Tambahkan anotasi @Preview pada fungsi composable untuk menampilkan pratinjau. Ini memudahkan pengembangan dan penyesuaian tampilan.


  1. Add a new text element

Tambahkan elemen teks menggunakan komponen Text di dalam fungsi composable. Misalnya, buat fungsi GreetingText untuk menampilkan pesan ulang tahun. Atur teks, ukuran font, dan alignment sesuai kebutuhan.




  1. Change font size

Atur ukuran font dengan properti fontSize. Gunakan unit sp (scalable pixels) agar ukuran teks dapat menyesuaikan preferensi pengguna. Contoh: fontSize = 100.sp untuk teks besar.



  1. Add another text element

Tambahkan elemen teks kedua, seperti tanda tangan atau nama pengirim. Gunakan komponen Text lagi dan atur properti seperti fontSize dan modifier untuk penyesuaian tampilan.



  1. Arrange the text elements in a row and column

Atur tata letak teks menggunakan Column untuk susunan vertikal atau Row untuk susunan horizontal. Misalnya, gunakan Column untuk menempatkan pesan ulang tahun di atas dan tanda tangan di bawah. Tambahkan padding dan alignment untuk memperbaiki posisi.



  1. Add greeting to the app

Panggil fungsi composable (seperti GreetingText) di MainActivity untuk menampilkan UI saat aplikasi dijalankan. Gunakan Surface untuk mengatur latar belakang dan warna tema. Pastikan teks dan tata letak sudah sesuai dengan pratinjau.


Dengan langkah-langkah ini, Kita dapat membuat aplikasi Happy Birthday sederhana menggunakan Jetpack Compose, menyesuaikan tampilan, dan mengatur tata letak dengan mudah.



Thank You - 🚀 Happy Coding with Jetpack Compose! 🎉




Comments

Post a Comment

Popular posts from this blog

Tugas Week 2 - PPB G - 5025221005

Image
  Tugas 2 - Membuat aplikasi Hello Android        NAMA           : Nabilah Atika Rahma NRP                : 5025221005 KELAS             :  Pemrograman Perangkat Bergerak - PPB G TAHUN          : 2025 JetPack Compose Guide  GitHub                :  https://github.com/ranabel/Android-1-JetPack-Compose-5025221005.git Starting a new Compose project Project Compose baru dimulai dengan memilih Empty Activity dari template. Getting started with Compose Jetpack Compose adalah framework deklaratif untuk membangun UI di Android menggunakan Kotlin ditandai dengan anotasi @Composable yang berguna untuk menyusun tampilan secara hierarkis.  Dalam aplikasi Android berbasis Compose, Activity tetap menjadi entry point, di mana layout didefinisikan menggunakan setContent...
Read more

Tugas 11 - PPB G - 5025221005

Image
Laporan Tugas 11: Starbucks Mobile App dengan Kotlin Compose ☕ Laporan Tugas 11 Starbucks Mobile App dengan Kotlin Compose Nama: Nabilah Atika Rahma NRP: 5025221005 Mata Kuliah: Pemrograman Perangkat Bergerak G Tahun: 2025 Android Studio Kotlin Jetpack Compose Material Design 3 State Management 📱 View on GitHub 📱 Pendahuluan Dalam tugas akhir ini, saya mengembangkan aplikasi mobile Starbucks yang menampilkan pengalaman berbelanja kopi yang premium dan us...
Read more

Tugas 9 - PPB G - 5025221005

Image
  Tugas 9 - Membuat Aplikasi Woof NAMA           : Nabilah Atika Rahma NRP                : 5025221005 KELAS             :  Pemrograman Perangkat Bergerak - PPB G TAHUN          : 2025 📱   Woof App - Material Theming dengan Jetpack Compose  📌 Github 🔗 github.com/ranabel/Woof-App-5025221005  ✨ About Project Dokumentasi ini mengajarkan untuk mengembangkan aplikasi Woof — daftar anjing yang ditampilkan dengan gaya visual yang elegan menggunakan prinsip Material Design. Membuat aplikasi Android yang konsisten, menarik, dan modern dengan Material Theming menggunakan Jetpack Compose! Codelab ini menunjukkan bagaimana mengatur warna, tipografi, dan bentuk kustom sesuai dengan Material Design 3. Disini kita juga bisa untuk merubah tema sesuai dengan preferensi masing-masing. 📁 Struktur Proyek 🧩 Fitur Utama ✅ Skema war...
Read more