Tugas 3: Happy Birthday App

Happy Birthday App

Nama : Rycahaya Sri Hutomo
NRP : 5025201046
Kelas : Pemrograman Perangkat Bergerak B
Tahun : 2024

A. Menyiapkan aplikasi Happy Birthday

1. Pada halaman Welcome to Android Studio, pilih New Project.
2. Pada halaman New Project, pilih Empty Activity, lalu klik Next.
3. Masukkan "Happy Birthday" pada kolom Name, lalu pilih level API minimum 24 (Nougat) di kolom Minimum SDK dan klik Finish.

Pada halaman New Project, pilih Empty Activity, lalu klik Next.

Masukkan "Happy Birthday" pada kolom Name, lalu pilih level API minimum 24 (Nougat) di kolom Minimum SDK dan klik Finish.

4. Tunggu hingga Android Studio selesai membuat dan membangun project tersebut.
5. Klik Run App.

B. Membuat aplikasi Happy Birthday

1. Di fungsi BirthdayCardPreview(), ubah argumen "Android" di fungsi Greeting() menjadi nama Anda.


Menambahkan elemen teks baru

1. Hapus definis fungsi Greeting() dalam file MainActivity.kt. Ubah menjadi fungsi GreetingText().


2. Tambahkan parameter Modifier ke fungsi GreetingText().


3. Tambahkan parameter message jenis String ke fungsi composable GreetingText().
4. Di fungsi GreetingText(), tambahkan composable Text yang meneruskan pesan teks sebagai argumen yang telah diberi nama.


5. Panggil fungsi GreetingText() di dalam fungsi BirthdayCardPreview().
6. Teruskan argumen String ke fungsi GreetingText() yang merupakan ucapan ulang tahun kepada teman Anda. Anda dapat menambahkan nama jika menginginkannya, seperti "Happy Birthday Ryca!".


7. Lihat pratinjau perubahan di panel Design yang secara otomatis diperbarui.


Mengubah ukuran font

1. Di file MainActivity.kt, scroll ke composable Text() di fungsi GreetingText().
2. Teruskan argumen fontSize ke fungsi Text() sebagai argumen kedua yang telah diberi nama dan tetapkan ke nilai 100.sp.


3. Klik .sp yang ditandai oleh Android Studio.
4. Klik Import di pop-up untuk mengimpor androidx.compose.ui.unit.sp agar dapat menggunakan properti ekstensi .sp.
5. Scroll ke bagian atas file dan perhatikan pernyataan import yang seharusnya terdapat pernyataan import androidx.compose.ui.unit.sp. Hal ini berarti Android Studio menambahkan paket ke file Anda.


6. Perhatikan pratinjau. Anda harus menentukan tinggi baris agar pesan tidak tumpang tindih.


7. Perbarui composable Text untuk menyertakan tinggi baris.



Menambahkan elemen teks lainnya

1. Di dalam file MainActivity.kt, scroll ke fungsi GreetingText().
2. Teruskan parameter from jenis String ke fungsi untuk nama pengirim.


3. Setelah composable pesan ulang tahun Text, tambahkan composable Text lain yang menerima argumen text yang ditetapkan ke nilai from.


4. Tambahkan argumen fontSize dengan nilai 36.sp.


5. Scroll ke fungsi BirthdayCardPreview().
6. Tambahkan argumen String lain untuk menandatangani kartu, seperti "From Cahaya".


Mengatur elemen teks dalam baris dan kolom

1. Di dalam file MainActivity.kt, scroll ke fungsi GreetingText().
2. Tambahkan composable Row di sekitar elemen teks agar baris dengan dua elemen teks dapat ditampilkan. Pilih dua composable Text, klik bohlam. Pilih Surround with widget > Surround with Row.


Android Studio otomatis mengimpor fungsi Row dan import androidx.compose.foundation.layout.Row seharusnya telah ditambahkan.

Maka, saat ini cuplikan kode akan terlihat seperti berikut.


3. Ubah ukuran font message menjadi 30.sp untuk sementara.


4. Ubah composable Row menjadi Column.
5. Tambahkan fungsi impor Column import androidx.compose.foundation.layout.Column


Menambahkan ucapan ke aplikasi

1. Di dalam file MainActivity.kt, scroll ke fungsi onCreate().
2. Panggil fungsi GreetingText() dari blok Surface.
3. Teruskan fungsi GreetingText(), ucapan ulang tahun, dan nama pengirim.


Menyejajarkan ucapan ke tengah

1. Untuk menyejajarkan ucapan di tengah layar, tambahkan parameter yang disebut verticalArrangement, tetapkan ke Arrangement.Center.


2. impor fungsi Alignment


3. Sejajarkan teks ucapan ke tengah dengan textAlign.


4. Tambahkan padding ke tanda tangan dan sejajarkan di sebelah kanan.


5. Perbarui parameter modifier di GreetingText() sebagai berikut.

onCreate

Hasil Akhir


Source Code

Referensi

Komentar

Posting Komentar

Postingan populer dari blog ini

Tugas Pertemuan 7 - Membuat Aplikasi Woof

Gambar
 Tugas Pertemuan 7 Membuat Aplikasi Woof Nama : Rycahaya Sri Hutomo NRP : 5025201046 Kelas : Pemrograman Perangkat Bergerak B Tahun : 2024 Deskripsi Singkat Aplikasi Aplikasi bernama Woof ini merupakan aplikasi yang menampilkan daftar anjing. Aplikasi ini menggunakan Desain Material untuk membuat pengalaman aplikasi yang menarik. Download Kode Awal Kode awal dapat diunduh melalui link berikut. Download Zip Kode Awal Mempelajari Kode Awal 1. Buka kode awal di Android Studio. 2. File com.example.woof > data > Dog.kt berisi Dog data class yang mewakili foto, nama, usia, dan hobi anjing, serta berisi daftar anjing dan informasi yang digunakan sebagai data di aplikasi. 3. Forder res > drawable berisi semua aset gambar termasuk ikon aplikasi, gambar anjing, dan ikon. 4. File res > values > strings.xml berisi string yang digunakan dalam aplikasi, termasuk nama aplikasi, nama anjing, deskripsinya, dan lainnya. 5. File MainActivity.kt berisi kode untuk membuat daftar sede...
Baca selengkapnya

Tugas Pertemuan 13 - Framework Flutter Namer App

Tugas Pertemuan 13 Framework Flutter Namer App Nama : Rycahaya Sri Hutomo NRP : 5025201046 Kelas : Pemrograman Perangkat Bergerak B Tahun : 2024 Preview Aplikasi Aplikasi ini menghasilkan nama yang terkesan keren, seperti "newstay", "lightstream", "mainbrake", atau "graypine". Pengguna dapat meminta nama berikutnya, memfavoritkan nama saat ini, dan meninjau daftar nama yang difavoritkan di halaman terpisah. Aplikasi ini responsif terhadap berbagai ukuran layar. pubspec.yaml name: namer_app description: A new Flutter project. publish_to: 'none' # Remove this line if you wish to publish to pub.dev version: 0.0 . 1 + 1 environment: sdk: '>=2.19.4 <4.0.0' dependencies: flutter: sdk: flutter english_words: ^ 4.0 . 0 provider: ^ 6.0 . 0 dev_dependencies: flutter_test: sdk: flutter flutter_lints: ^ 2.0 . 0 flutter: uses - material - design: true analysis_option.yaml inc...
Baca selengkapnya

Evaluasi Akhir Semester PPB B

Gambar
 Evaluasi Tengah Semester Studi Kasus Mitra i.saku Nama: Rycahaya Sri Hutomo NRP: 5025201046 Kelas: Pemrograman Perangkat Bergerak B Tahun: 2024 Deskripsi Singkat mitra i.saku mitra i.saku adalah aplikasi uang elektronik yang memfasilitasi transaksi antara merchant (pemilik bisnis) dengan customer (pelanggan). Google Docs Soal dan Jawaban   Link Google Docs 1. Use Case dan User Flow dari Aplikasi Use case Semua aktor yang terlibat dalam aplikasi mitra i.saku harus memiliki akun yang terdaftar. Aktor-aktor tersebut, antara lain: Merchant : pemilik bisnis Customer : pelanggan yang melakukan transaksi Admin : pengelola sistem mitra i.saku User flow Merchant Fokus utama pada studi kasus ini, yaitu pada aktor Merchant. Pengguna akan melihat halaman Masuk Akun. Jika pengguna belum memiliki akun, pengguna harus melakukan pendaftaran akun, lalu mengisi kode verifikasi. Kemudian, pengguna dapat masuk menggunakan akun terdaftar. Jika pengguna merupakan pengguna baru dan belum a...
Baca selengkapnya