PPB Pertemuan 5 - Aplikasi Dice Roller

Membuat Aplikasi Android "Dice Roller" dengan Jetpack Compose

Blog ini akan menjelaskan cara membuat aplikasi sederhana berupa Dice Roller, yaitu aplikasi untuk mensimulasikan lemparan dadu secara acak dan menampilkan hasilnya dalam bentuk gambar hanya dengan menekan tombol "roll".

---

1. Struktur Dasar Program

Program terdiri dari beberapa bagian utama:

• MainActivity
• Composable function
• State
• Preview

---

2. MainActivity

Activity utama menggunakan setContent untuk menampilkan UI Compose dan memanggil fungsi DiceRollerApp.

class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { DiceRollerTheme { Surface( modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background ) { DiceRollerApp() } } } } }

• setContent menampilkan UI Compose
• Surface sebagai container utama layar
• DiceRollerApp() menjalankan UI aplikasi

---

3. Composable Utama

Fungsi ini digunakan untuk menempatkan komponen di tengah layar.

@Preview(showBackground = true) @Composable fun DiceRollerApp() { DiceWithButtonAndImage( modifier = Modifier .fillMaxSize() .wrapContentSize(Alignment.Center) ) }

• fillMaxSize() membuat layout memenuhi layar
• wrapContentSize() memusatkan konten

---

4. Composable Dice (Logic & UI)

Fungsi ini adalah inti aplikasi yang mengatur state, gambar dadu, dan interaksi tombol.

@Composable fun DiceWithButtonAndImage(modifier: Modifier = Modifier) { var result by remember { mutableIntStateOf(1) } val imageResource = when (result) { 1 -> R.drawable.dice_1 2 -> R.drawable.dice_2 3 -> R.drawable.dice_3 4 -> R.drawable.dice_4 5 -> R.drawable.dice_5 else -> R.drawable.dice_6 } Column( modifier = modifier, horizontalAlignment = Alignment.CenterHorizontally ) { Image( painter = painterResource(imageResource), contentDescription = result.toString() ) Spacer(modifier = Modifier.height(16.dp)) Button(onClick = { result = (1..6).random() }) { Text(text = stringResource(R.string.roll)) } } }

• remember menyimpan state
• mutableIntStateOf untuk state integer
• when menentukan gambar berdasarkan hasil
• Image menampilkan dadu
• Button untuk interaksi user
• random() menghasilkan angka 1–6

---

5. Cara Menjalankan Aplikasi

1. Buka Android Studio
2. Buat project baru dengan template Empty Activity (Compose)
3. Masukkan kode ke file MainActivity.kt
4. Tambahkan gambar dadu di folder drawable
5. Jalankan emulator atau device
6. Klik tombol Run

---

Hasil Tampilan Aplikasi

PPB Pertemuan 1 - Perkembangan Mobile Programming

Perkembangan Mobile Programming: OS, Hardware, dan Aplikasi

Mobile programming mengalami perkembangan yang sangat pesat dalam dua dekade terakhir. Perubahan ini dipengaruhi oleh kemajuan sistem operasi, peningkatan kemampuan hardware, serta evolusi aplikasi mobile yang semakin kompleks. Berikut adalah ringkasan perkembangan mobile programming secara berurutan.

---

1. Era Awal Mobile (1990–2005)

Pada tahap awal, perangkat mobile seperti feature phone memiliki kemampuan yang sangat terbatas. Hardware masih sederhana dengan prosesor kecil, memori terbatas, dan layar beresolusi rendah. Sistem operasi yang digunakan antara lain Symbian, Palm OS, dan Windows Mobile.

Pengembangan aplikasi pada masa ini relatif sulit karena keterbatasan platform dan tools. Aplikasi yang tersedia umumnya hanya berupa utilitas sederhana seperti kalender, SMS, email, dan game ringan berbasis Java ME.

---

2. Era Smartphone Modern (2007–2013)

Perkembangan besar terjadi ketika smartphone modern mulai populer dengan munculnya iOS pada tahun 2007 dan Android pada tahun 2008. Pada periode ini hardware mengalami peningkatan signifikan seperti prosesor yang lebih cepat, layar sentuh kapasitif, GPU yang lebih baik, serta konektivitas internet yang lebih stabil.

Ekosistem aplikasi juga berkembang pesat dengan hadirnya App Store dan Google Play Store. Developer mulai membangun aplikasi mobile yang lebih kompleks seperti media sosial, navigasi, dan layanan online.

---

3. Era Mobile Ecosystem dan Cross-Platform (2014–2019)

Pada periode ini, hardware smartphone semakin kuat dengan prosesor multi-core, RAM yang lebih besar, serta sensor tambahan seperti fingerprint dan kamera berkualitas tinggi. Sistem operasi mobile juga semakin stabil dan mendukung fitur keamanan serta performa yang lebih baik.

Di sisi pengembangan aplikasi, muncul berbagai framework cross-platform seperti React Native, Flutter, dan Xamarin. Framework ini memungkinkan developer membuat satu basis kode untuk beberapa platform sekaligus, sehingga proses pengembangan menjadi lebih efisien.

---

4. Era Modern: AI, Cloud, dan High-Performance Mobile (2020–Sekarang)

Saat ini mobile programming telah memasuki tahap yang lebih maju dengan integrasi teknologi seperti cloud computing, machine learning, dan konektivitas 5G. Hardware smartphone kini mendekati performa komputer dengan CPU dan GPU yang sangat kuat.

Sistem operasi modern seperti Android dan iOS juga menyediakan toolkit baru untuk pengembangan UI yang lebih efisien, misalnya Jetpack Compose di Android dan SwiftUI di iOS. Aplikasi mobile kini mencakup berbagai bidang seperti fintech, kesehatan digital, e-commerce, hingga augmented reality.

---

Kesimpulan

Perkembangan mobile programming dipengaruhi oleh tiga faktor utama: kemajuan hardware, evolusi sistem operasi, serta kebutuhan aplikasi yang semakin kompleks. Dari perangkat sederhana dengan aplikasi terbatas, mobile kini telah berkembang menjadi platform komputasi utama yang digunakan dalam berbagai aspek kehidupan sehari-hari.

PPB Pertemuan 3 - Aplikasi Ucapan Selamat Ulang Tahun

Membuat Aplikasi Android "Happy Birthday" dengan Jetpack Compose

Jetpack Compose adalah toolkit modern Android untuk membuat UI langsung menggunakan Kotlin tanpa XML. UI dibuat menggunakan fungsi yang disebut Composable. Blog ini akan menjelaskan bagaimana membuat contoh aplikasi sederhana yang menampilkan ucapan ulang tahun di tengah layar.

---

1. Struktur Dasar Program

Program terdiri dari tiga bagian utama:

• MainActivity sebagai entry point aplikasi
• Composable function untuk membuat UI
• Preview untuk melihat tampilan di Android Studio

---

2. MainActivity

Activity utama memanggil setContent untuk menampilkan UI Compose dan menjalankan fungsi GreetingText.

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

• setContent menampilkan UI Compose
• Surface menjadi container utama layar
• Modifier.fillMaxSize() membuat layout memenuhi layar
• GreetingText() menampilkan teks ucapan

---

3. Composable Function

Fungsi ini membuat tampilan teks menggunakan layout Column.

@Composable fun GreetingText( message: String, from: String, modifier: Modifier = Modifier ) { Column( verticalArrangement = Arrangement.Center, modifier = modifier ) { Text( text = message, fontSize = 100.sp, lineHeight = 116.sp, textAlign = TextAlign.Center ) Text( text = from, fontSize = 36.sp, modifier = Modifier .padding(16.dp) .align(Alignment.End) ) } }

• @Composable menandakan fungsi UI Compose
• Column menyusun komponen secara vertikal
• Text menampilkan tulisan
• Arrangement.Center memposisikan teks di tengah layar

---

4. Preview UI

Preview memungkinkan UI dilihat langsung di Android Studio tanpa menjalankan aplikasi.

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

---

5. Cara Menjalankan Aplikasi

1. Buka Android Studio
2. Buat project baru dengan template Empty Activity (Compose)
3. Masukkan kode ke file MainActivity.kt
4. Jalankan emulator atau hubungkan perangkat Android
5. Klik tombol Run

---

Hasil Tampilan Aplikasi

Berikut contoh tampilan aplikasi ketika dijalankan.

PPB Tugas 1 - Perkembangan Teknologi Mobile

Perkembangan Teknologi OS di Berbagai Device

Device	OS	Dibuat oleh	Negara Asal	Tahun	Fungsi Utama	Programming	Gambar
Smart TV	webOS	LG	Korea	2014	Magic Remote, app carousel	webOS TV SDK	Lihat Gambar
Smart TV	Google TV	Google	AS	2020	Recommendations, apps luas	Android Studio	Lihat Gambar
Smart TV	Roku OS	Roku	AS	2008	Streaming sederhana	Roku SDK	Lihat Gambar
Smart TV	Fire TV OS	Amazon	AS	2014	Prime Video, Alexa	Fire TV SDK	Lihat Gambar
Smartphone	Android	Google	AS	2008	Ecosystem luas	Android Studio (Kotlin)	Lihat Gambar
Smartphone	iOS	Apple	AS	2007	Security tinggi, App Store	Xcode (Swift)	Lihat Gambar
Smartphone	HarmonyOS	Huawei	China	2019	Multi-device	DevEco Studio	Lihat Gambar
Smartphone Low-end	KaiOS	KaiOS Tech	AS	2017	Feature phone smart	KaiOS SDK (HTML5)	Lihat Gambar
Smartwatch	watchOS	Apple	AS	2015	Health, ecosystem Apple	Xcode (Swift)	Lihat Gambar
Smartwatch	Wear OS	Google	AS	2014	Google apps, fitness	Android Studio	Lihat Gambar
Car Infotainment	Android Automotive OS	Google	AS	2017	Built-in car OS, apps native	Android Studio (Automotive)	Lihat Gambar
Car Infotainment	Apple CarPlay	Apple	AS	2014	Projection iPhone ke mobil	Xcode (CarPlay SDK)	Lihat Gambar