Tugas 3 PPB A Aplikasi Ulang Tahun

Nama : Dafarel Fatih Wirayudha
NRP : 5025211120
Kelas : PPB A

Aplikasi ini menampilkan ucapan ulang tahun dengan ukuran teks yang besar dan pesan dari pengirim. Aplikasi sederhana ini adalah contoh pengaplikasian dasar dari Composable, layout, dan styling teks dalam Jetpack Compose.

Struktur Utama:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            HappyBirthdayTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    GreetingText(
                        message = "Happy Birthday Dafarel!",
                        from = "From Dafarel Fatih",
                        modifier = Modifier.padding(8.dp)
                    )
                }
            }
        }
    }
}

Fungsi onCreate() adalah titik awal ketika aplikasi dijalankan. Dalam fungsi ini, setContent { ... } digunakan untuk mendefinisikan UI dengan Jetpack Compose.

• HappyBirthdayTheme menerapkan tema kustom aplikasi.
• Surface adalah kontainer dengan warna latar belakang dari tema.
• Di dalamnya dipanggil fungsi GreetingText() untuk menampilkan konten utama aplikasi.

Fungsi GreetingText():

@Composable
fun GreetingText(message: String, from: String, modifier: Modifier = Modifier) {
    Column(
        verticalArrangement = Arrangement.Center,
        modifier = modifier
    ) {
        Text(
            text = message,
            fontSize = 50.sp,
            lineHeight = 60.sp,
            textAlign = TextAlign.Center
        )
        Text(
            text = from,
            fontSize = 20.sp,
            modifier = Modifier
                .padding(8.dp)
                .align(alignment = Alignment.End)
        )
    }
}

Fungsi ini menerima dua parameter: message untuk ucapan ulang tahun dan from sebagai pengirim pesan. Layout-nya menggunakan Column, yaitu susunan vertikal dari elemen UI.

• Arrangement.Center membuat konten ditampilkan di tengah layar secara vertikal.
• Text() pertama menampilkan ucapan dengan fontSize = 100.sp, sangat besar agar mencolok.
• Text() kedua menampilkan nama pengirim di sudut kanan bawah dengan align(Alignment.End) dan ukuran teks 36.sp.

Fungsi Preview:

@Preview(showBackground = true)
@Composable
fun BirthdayCardPreview() {
    HappyBirthdayTheme {
        GreetingText(message = "Happy Birthday Dafarel!", from = "From Dafarel Fatih")
    }
}

Fungsi ini memungkinkan kita melihat hasil UI langsung di Android Studio tanpa perlu menjalankan aplikasi di emulator. Preview sangat berguna untuk pengembangan UI yang cepat.

Hasil:

Source: https://developer.android.com/codelabs/basic-android-kotlin-compose-text-composables?hl=id#0