Pemrograman Perangkat Beregerak - Tugas Pertemuan 12 - Timothy Hosia

Dessert Clicker

Nama: Timothy Hosia Budianto

NRP: 5025211098

Kelas: PPB - A

Dessert Clicker


Pada pertemuan kali ini ditugaskan untuk aplikasi Dessert Clicker



MainActivity.kt

package com.example.dessertclicker

import android.content.ActivityNotFoundException
import android.content.Context
import android.content.Intent
import android.os.Bundle
import android.util.Log
import android.widget.Toast
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.annotation.DrawableRes
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.WindowInsets
import androidx.compose.foundation.layout.asPaddingValues
import androidx.compose.foundation.layout.calculateEndPadding
import androidx.compose.foundation.layout.calculateStartPadding
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.safeDrawing
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.foundation.layout.width
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Share
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalLayoutDirection
import androidx.compose.ui.res.dimensionResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.core.content.ContextCompat
import com.example.dessertclicker.data.Datasource
import com.example.dessertclicker.model.Dessert
import com.example.dessertclicker.ui.theme.DessertClickerTheme

// Tag for logging
private const val TAG = "MainActivity"

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        enableEdgeToEdge()
        super.onCreate(savedInstanceState)
        Log.d(TAG, "onCreate Called")
        setContent {
            DessertClickerTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier
                        .fillMaxSize()
                        .statusBarsPadding(),
                ) {
                    DessertClickerApp(desserts = Datasource.dessertList)
                }
            }
        }
    }

    override fun onStart() {
        super.onStart()
        Log.d(TAG, "onStart Called")
    }

    override fun onResume() {
        super.onResume()
        Log.d(TAG, "onResume Called")
    }

    override fun onRestart() {
        super.onRestart()
        Log.d(TAG, "onRestart Called")
    }

    override fun onPause() {
        super.onPause()
        Log.d(TAG, "onPause Called")
    }

    override fun onStop() {
        super.onStop()
        Log.d(TAG, "onStop Called")
    }

    override fun onDestroy() {
        super.onDestroy()
        Log.d(TAG, "onDestroy Called")
    }
}

/**
 * Determine which dessert to show.
 */
fun determineDessertToShow(
    desserts: List<Dessert>,
    dessertsSold: Int
): Dessert {
    var dessertToShow = desserts.first()
    for (dessert in desserts) {
        if (dessertsSold >= dessert.startProductionAmount) {
            dessertToShow = dessert
        } else {
            // The list of desserts is sorted by startProductionAmount. As you sell more desserts,
            // you'll start producing more expensive desserts as determined by startProductionAmount
            // We know to break as soon as we see a dessert who's "startProductionAmount" is greater
            // than the amount sold.
            break
        }
    }

    return dessertToShow
}

/**
 * Share desserts sold information using ACTION_SEND intent
 */
private fun shareSoldDessertsInformation(intentContext: Context, dessertsSold: Int, revenue: Int) {
    val sendIntent = Intent().apply {
        action = Intent.ACTION_SEND
        putExtra(
            Intent.EXTRA_TEXT,
            intentContext.getString(R.string.share_text, dessertsSold, revenue)
        )
        type = "text/plain"
    }

    val shareIntent = Intent.createChooser(sendIntent, null)

    try {
        ContextCompat.startActivity(intentContext, shareIntent, null)
    } catch (e: ActivityNotFoundException) {
        Toast.makeText(
            intentContext,
            intentContext.getString(R.string.sharing_not_available),
            Toast.LENGTH_LONG
        ).show()
    }
}

@Composable
private fun DessertClickerApp(
    desserts: List<Dessert>
) {

    var revenue by rememberSaveable { mutableStateOf(0) }
    var dessertsSold by rememberSaveable { mutableStateOf(0) }

    val currentDessertIndex by rememberSaveable { mutableStateOf(0) }

    var currentDessertPrice by rememberSaveable {
        mutableStateOf(desserts[currentDessertIndex].price)
    }
    var currentDessertImageId by rememberSaveable {
        mutableStateOf(desserts[currentDessertIndex].imageId)
    }

    Scaffold(
        topBar = {
            val intentContext = LocalContext.current
            val layoutDirection = LocalLayoutDirection.current
            DessertClickerAppBar(
                onShareButtonClicked = {
                    shareSoldDessertsInformation(
                        intentContext = intentContext,
                        dessertsSold = dessertsSold,
                        revenue = revenue
                    )
                },
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(
                        start = WindowInsets.safeDrawing.asPaddingValues()
                            .calculateStartPadding(layoutDirection),
                        end = WindowInsets.safeDrawing.asPaddingValues()
                            .calculateEndPadding(layoutDirection),
                    )
                    .background(MaterialTheme.colorScheme.primary)
            )
        }
    ) { contentPadding ->
        DessertClickerScreen(
            revenue = revenue,
            dessertsSold = dessertsSold,
            dessertImageId = currentDessertImageId,
            onDessertClicked = {

                // Update the revenue
                revenue += currentDessertPrice
                dessertsSold++

                // Show the next dessert
                val dessertToShow = determineDessertToShow(desserts, dessertsSold)
                currentDessertImageId = dessertToShow.imageId
                currentDessertPrice = dessertToShow.price
            },
            modifier = Modifier.padding(contentPadding)
        )
    }
}

@Composable
private fun DessertClickerAppBar(
    onShareButtonClicked: () -> Unit,
    modifier: Modifier = Modifier
) {
    Row(
        modifier = modifier,
        horizontalArrangement = Arrangement.SpaceBetween,
        verticalAlignment = Alignment.CenterVertically,
    ) {
        Text(
            text = stringResource(R.string.app_name),
            modifier = Modifier.padding(start = dimensionResource(R.dimen.padding_medium)),
            color = MaterialTheme.colorScheme.onPrimary,
            style = MaterialTheme.typography.titleLarge,
        )
        IconButton(
            onClick = onShareButtonClicked,
            modifier = Modifier.padding(end = dimensionResource(R.dimen.padding_medium)),
        ) {
            Icon(
                imageVector = Icons.Filled.Share,
                contentDescription = stringResource(R.string.share),
                tint = MaterialTheme.colorScheme.onPrimary
            )
        }
    }
}

@Composable
fun DessertClickerScreen(
    revenue: Int,
    dessertsSold: Int,
    @DrawableRes dessertImageId: Int,
    onDessertClicked: () -> Unit,
    modifier: Modifier = Modifier
) {
    Box(modifier = modifier) {
        Image(
            painter = painterResource(R.drawable.bakery_back),
            contentDescription = null,
            contentScale = ContentScale.Crop
        )
        Column {
            Box(
                modifier = Modifier
                    .weight(1f)
                    .fillMaxWidth(),
            ) {
                Image(
                    painter = painterResource(dessertImageId),
                    contentDescription = null,
                    modifier = Modifier
                        .width(dimensionResource(R.dimen.image_size))
                        .height(dimensionResource(R.dimen.image_size))
                        .align(Alignment.Center)
                        .clickable { onDessertClicked() },
                    contentScale = ContentScale.Crop,
                )
            }
            TransactionInfo(
                revenue = revenue,
                dessertsSold = dessertsSold,
                modifier = Modifier.background(MaterialTheme.colorScheme.secondaryContainer)
            )
        }
    }
}

@Composable
private fun TransactionInfo(
    revenue: Int,
    dessertsSold: Int,
    modifier: Modifier = Modifier
) {
    Column(modifier = modifier) {
        DessertsSoldInfo(
            dessertsSold = dessertsSold,
            modifier = Modifier
                .fillMaxWidth()
                .padding(dimensionResource(R.dimen.padding_medium))
        )
        RevenueInfo(
            revenue = revenue,
            modifier = Modifier
                .fillMaxWidth()
                .padding(dimensionResource(R.dimen.padding_medium))
        )
    }
}

@Composable
private fun RevenueInfo(revenue: Int, modifier: Modifier = Modifier) {
    Row(
        modifier = modifier,
        horizontalArrangement = Arrangement.SpaceBetween,
    ) {
        Text(
            text = stringResource(R.string.total_revenue),
            style = MaterialTheme.typography.headlineMedium,
            color = MaterialTheme.colorScheme.onSecondaryContainer
        )
        Text(
            text = "$${revenue}",
            textAlign = TextAlign.Right,
            style = MaterialTheme.typography.headlineMedium,
            color = MaterialTheme.colorScheme.onSecondaryContainer
        )
    }
}

@Composable
private fun DessertsSoldInfo(dessertsSold: Int, modifier: Modifier = Modifier) {
    Row(
        modifier = modifier,
        horizontalArrangement = Arrangement.SpaceBetween,
    ) {
        Text(
            text = stringResource(R.string.dessert_sold),
            style = MaterialTheme.typography.titleLarge,
            color = MaterialTheme.colorScheme.onSecondaryContainer
        )
        Text(
            text = dessertsSold.toString(),
            style = MaterialTheme.typography.titleLarge,
            color = MaterialTheme.colorScheme.onSecondaryContainer
        )
    }
}

@Preview
@Composable
fun MyDessertClickerAppPreview() {
    DessertClickerTheme {
        DessertClickerApp(listOf(Dessert(R.drawable.cupcake, 5, 0)))
    }
}

Struktur Kode Dessert Clicker App (Variant)

1. MainActivity

  • Activity utama menggunakan Jetpack Compose dengan ComponentActivity dan enableEdgeToEdge()
  • Menggunakan konstanta logging: private const val TAG = "MainActivity"
  • Set theme dengan DessertClickerTheme dan surface container dengan statusBarsPadding()
  • Lifecycle Logging: Override semua lifecycle methods (onCreate, onStart, onResume, onRestart, onPause, onStop, onDestroy) dengan logging
  • Dipecah menjadi fungsi modular: DessertClickerApp(), DessertClickerScreen(), DessertClickerAppBar(), TransactionInfo()

2. DessertClickerApp Composable (Root Component)

  • State Management: 5 state variables - revenue, dessertsSold, currentDessertIndex, currentDessertPrice, currentDessertImageId
  • State Persistence: Menggunakan rememberSaveable untuk semua state agar survive configuration changes
  • UI Layout: Scaffold dengan topBar dan content area menggunakan contentPadding
  • Business Logic: determineDessertToShow() untuk upgrade dessert berdasarkan jumlah terjual

3. DessertClickerScreen Composable (Main Content)

  • Parameter: 5 parameter termasuk revenue, dessertsSold, dessertImageId, dan callback onDessertClicked
  • Layout Structure: Box dengan background image, Column dengan weight layout, dan centered dessert image
  • Background System: Image dengan painterResource(R.drawable.bakery_back) dan ContentScale.Crop
  • Click Interaction: Dessert image clickable dengan modifier clickable { onDessertClicked() }
  • Component Integration: TransactionInfo dengan background MaterialTheme.colorScheme.secondaryContainer

4. DessertClickerAppBar Composable (Top Navigation)

  • Layout: Row dengan Arrangement.SpaceBetween untuk spacing app title dan share button
  • Title Display: App name menggunakan stringResource(R.string.app_name) dengan MaterialTheme.typography.titleLarge
  • Share Integration: IconButton dengan Icons.Filled.Share dan callback onShareButtonClicked
  • Color Theming: MaterialTheme.colorScheme.onPrimary untuk text dan icon color
  • Responsive Padding: WindowInsets.safeDrawing untuk edge-to-edge support

5. Business Logic Functions

  • Dessert Progression: determineDessertToShow() mengiterasi list dessert berdasarkan startProductionAmount
  • Share Functionality: shareSoldDessertsInformation() menggunakan Intent.ACTION_SEND dengan text sharing
  • Error Handling: Try-catch untuk ActivityNotFoundException dengan Toast fallback message
  • Context Integration: ContextCompat.startActivity() untuk safe intent launching

6. TransactionInfo & Display Components

  • Modular Structure: TransactionInfo() container untuk DessertsSoldInfo() dan RevenueInfo()
  • Layout Pattern: Semua info menggunakan Row dengan Arrangement.SpaceBetween untuk label-value pairs
  • Typography System: headlineMedium untuk revenue, titleLarge untuk desserts sold
  • Color Consistency: MaterialTheme.colorScheme.onSecondaryContainer untuk semua text
  • Responsive Padding: dimensionResource(R.dimen.padding_medium) untuk consistent spacing

7. Data Layer Architecture

  • Model Class: Dessert data class dengan 3 properties - imageId, price, startProductionAmount
  • Data Source: Datasource object dengan dessertList berisi 13 dessert items
  • Resource Integration: Menggunakan R.drawable references untuk semua dessert images
  • Progressive Pricing: Harga dessert naik dari 5 hingga 6000, start production dari 0 hingga 20000

8. State Management & Click Logic

  • Revenue Calculation: revenue += currentDessertPrice setiap klik dessert
  • Counter Increment: dessertsSold++ untuk tracking total desserts sold
  • Dynamic Updates: currentDessertImageId dan currentDessertPrice update berdasarkan progress
  • Automatic Progression: Dessert upgrade otomatis ketika mencapai startProductionAmount threshold

9. Resource Management

  • String Resources: share_text, sharing_not_available, total_revenue, dessert_sold, app_name, share
  • Dimension Resources: padding_medium, image_size untuk consistent sizing
  • Drawable Resources: 14 drawable files (13 desserts + 1 background) dalam format PNG/vector
  • Content Descriptions: Proper accessibility dengan contentDescription untuk images

10. UI/UX Design Patterns

  • Material Design 3: Full integration dengan MaterialTheme color scheme dan typography
  • Edge-to-Edge Support: WindowInsets.safeDrawing dan statusBarsPadding() untuk modern Android UI
  • Image Scaling: ContentScale.Crop untuk consistent image presentation
  • Responsive Layout: Weight modifiers dan fill width patterns untuk adaptive layout
  • Visual Hierarchy: Proper spacing, typography scale, dan color contrast untuk usability

Kode ini menggunakan Jetpack Compose dan Material Design 3 untuk membuat aplikasi clicker game yang interaktif dengan progression system. Arsitektur modular memisahkan UI components, business logic, dan data layer untuk maintainability yang optimal dan scalability future features.

https://github.com/thossb/dessertclicker.git 

Comments

Post a Comment

Popular posts from this blog

Pemrograman Perangkat Beregerak - ETS - - Timothy Hosia

Image
Money Management - Money Wise Nama: Timothy Hosia Budianto NRP: 5025211098 Kelas: PPB - A Money Management - Money Wise Aplikasi manajemen keuangan kami hadir untuk mempermudah Anda dalam melacak pemasukan dan pengeluaran sehari-hari. Dengan tampilan yang simpel dan user-friendly, aplikasi ini membantu Anda mengontrol keuangan dengan lebih baik. Fitur Utama: Ringkasan Keuangan: Lihat saldo terkini, total pemasukan dan pengeluaran, serta daftar transaksi terbaru langsung di halaman utama. Pencatatan Transaksi: Input transaksi pemasukan dan pengeluaran dengan mudah, pilih kategori, dan tambahkan deskripsi untuk detail lebih lengkap. Visualisasi Data: Nikmati grafik perbandingan pemasukan dan pengeluaran, serta diagram pie yang menunjukkan distribusi pemasukan dan pengeluaran berdasarkan kategori. Dapatkan kontrol penuh atas keuangan Anda dengan aplikasi ini! Mudah, cepat, dan efisien. Github :  Money Wise Youtube :  Youtube PPT :  Canva PPT Download :  App Download
Read more

Pemrograman Perangkat Beregerak - Tugas Pertemuan 4 - Timothy Hosia

Image
Aplikasi Dice Roller Nama: Timothy Hosia Budianto NRP: 5025211098 Kelas: PPB - A Aplikasi Dice Roller  Pada pertemuan kali ini kami mebuat aplikasi dice roller sederhana dari  android developer . Berikut hasilnya Berikut adalah kode sumbernya : package com.example.diceroller import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.Image import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.material3.Button import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime. Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.c...
Read more

ETS PPL A

Image
Nama : Timothy Hosia Budianto NRP : 5025211098 Kelas : PPL A Ujian : ETS STUDI KASUS  Aplikasi Sistem Parkir Aplikasi sistem parkir adalah perangkat lunak yang dirancang untuk mengelola tempat parkir dan pergerakan kendaraan di area tertentu. Sistem ini dapat digunakan di berbagai tempat, seperti: Mal Gedung perkantoran Rumah sakit Bandara Tempat wisata Universitas Aplikasi sistem parkir menawarkan berbagai fitur dan manfaat, antara lain: Memudahkan pengendara untuk menemukan tempat parkir yang tersedia Mempercepat proses pembayaran parkir Meningkatkan keamanan kendaraan Menganalisis data penggunaan parkir Meningkatkan pendapatan dari parkir Spesifikasi Kebutuhan Perangkat Lunak Sistem Parkir Kebutuhan Fungsional Manajemen tempat parkir: Menambahkan, menghapus, dan memodifikasi informasi tempat parkir Menentukan jenis tempat parkir (misalnya, mobil, motor, VIP) Menentukan tarif parkir untuk setiap jenis tempat parkir Melacak ketersediaan tempat parkir secara real-time Manaj...
Read more