Tugas 8 - PPB G - 5025221005


Tugas 8 - Membuat Image Scroll



NAMA        : Nabilah Atika Rahma

NRP            : 5025221005

KELAS         : Pemrograman Perangkat Bergerak - PPB G

TAHUN       : 2025


📱 Image Scroller dengan Jetpack Compose

📌 Github

🔗 github.com/ranabel/Image-Scroll-5025221005 

✨ About Project






Dokumentasi ini menjelaskan bagaimana membangun tampilan daftar afirmasi yang dapat digulir secara vertikal menggunakan Jetpack Compose. Proyek ini bertujuan untuk menampilkan daftar afirmasi yang masing-masing terdiri dari teks dan gambar ilustrasi dalam sebuah kartu.

🎯 Tujuan

Tujuan dari proyek ini adalah membuat antarmuka pengguna sederhana yang menampilkan daftar afirmasi positif dalam bentuk scrollable list menggunakan pendekatan deklaratif dari Jetpack Compose.

📁 Struktur Proyek


🧩 Penjelasan Komponen

  • MainActivity.kt

  • Affirmation.kt

  • DataSource.kt

  • Komponen UI

    • AffirmationCard: Komponen ulang untuk item afirmasi individual
    • AffirmationList: Menangani daftar scroll menggunakan LazyColumn
    • Theme: Konfigurasi tema material kustom

🖥️ Pratinjau UI

Setiap afirmasi ditampilkan dalam Kartu Material yang berisi:
  • 🖼️ Gambar inspiratif (diskalakan dan dipotong dengan baik)
  • 💬 Teks afirmasi positif
  • ♻️ Item daftar yang dapat digunakan ulang untuk performa

Fitur daftar secara keseluruhan:
  • Scroll vertikal yang mulus
  • Padding dan spasi yang konsisten
  • Tata letak responsif untuk berbagai ukuran layar

🚀 Getting Started

Prerequisites:

  1. Android Studio (versi stabil terbaru)
  2. Android SDK (API level 21+)
  3. Basic Kotlin knowledge

Installation

  1. Clone repositori
  2. Buka proyek di Android Studio
  3. Sinkronkan dependensi Gradle
  4. Jalankan di emulator atau perangkat fisik

Build Instructions

  1. Bersihkan proyek: Build > Clean Project
  2. Bangun ulang proyek: Build > Rebuild Project
  3. Jalankan aplikasi: Klik tombol Run ▶️

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