Tugas 3 - Aplikasi Selamat Ulang Tahun

Nama: Dewa Putu Ananda Taurean Mahesa

NRP: 5025231158

Kelas: Pemrograman Perangkat Bergerak C


Membuat aplikasi sederhana yang menampilkan ucapan selamat ulang tahun. Projek ini memanfaatkan Composables, Layout Composers, dan Styling dengan Jetpack Compose.

1. MainActivity

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            HappyBirthdayTheme {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    BirthdayText(message = "Happy Birthday Sam!", from = "From Emma")
                }
            }
        }
    }
}

MainActivity adalah titik masuk aplikasi melalui onCreate. Terdapat fungsi setContent untuk mendefinisikan tampilan UI aplikasi dengan Compose. Tema diatur dalam HappyBirthdayTheme, dengan Surface sebagai wadah yang mengisi seluruh layar. Lalu ditampilkan BirthdayText.

2. BirthdayText

@Composable
fun BirthdayText(message: String, from: String, modifier: Modifier = Modifier) {
    Column (verticalArrangement = Arrangement.Center) {
        Text(
            text = message,
            fontSize = 100.sp,
            lineHeight = 116.sp,
            textAlign = TextAlign.Center,
        )
        Spacer(modifier = Modifier.height(12.dp))
        Text(
            text = from,
            fontSize = 36.sp,
            textAlign = TextAlign.End,
            modifier = Modifier.fillMaxWidth().padding(end = 20.dp),
        )
    }
}

BirthdayText adalah UI component yang menampilkan pesan ulang tahun. Terdapat 2 pesan yaitu message yang merupakan ucapan ulang tahun, dan from yang merupakan pengirim ucapan. Kedua pesan ini menggunakan Column sebagai layout secara vertikal dengan Center verticalArrangement agar pesan berada di tengah layar. message dan from memiliki styling mereka masing-masing untuk mengubah tampilan dan posisi alignment mereka. Kedua pesan juga dipisahkan dengan Spacer untuk memberi spacing tambahan.

3. BirthdayPreview

@Preview(showBackground = true)
@Composable
fun BirthdayPreview() {
    HappyBirthdayTheme {
        BirthdayText("Happy Birthday Sam!", "From Emma")
    }
}

BirthdayPreview berfungsi untuk menampilkan UI langsung di Android Studio tanpa harus menjalankan app di perangkat asli. Hal ini untuk membantu melihat hasil saat proses pengembangan.

4. Hasil Akhir



Comments

Popular posts from this blog

Tugas 1 - Eksplorasi Perkembangan Teknologi

Tugas 1: Meningkatkan Skill Typewriter

Tugas 2 - Membuat Aplikasi Hello Android