Tugas 5 PPB D
Tugas 5 PPB D
Nama : Charles
NRP : 5025211082
Kelas PPB D
Pada pertemuan ini tugasnya berupa membuat aplikasi kalkulator menggunakan bahasa pemrograman kotlin di android studio. Untuk referensi yang digunakan kali ini adalah di sini https://www.youtube.com/watch?v=HlE8MEtKBr0.
Cukup mengikuti dari referensi saja maka aplikasi kalkulatornya pun bisa dibuat. Berikut merupakan hasil pengerjaannya.
Untuk kode lengkapnya sebagai berikut:
package com.example.calculator
import android.os.Bundle
import android.widget.Toast
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.material3.Text
import androidx.compose.ui.Modifier
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.width
import androidx.compose.material3.Button
import androidx.compose.material3.TextField
import androidx.compose.runtime.*
import androidx.compose.ui.unit.dp
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
var num1 by remember {
mutableStateOf(value = "0")
}
var num2 by remember {
mutableStateOf(value = "0")
}
Column {
TextField(value = num1, onValueChange = {
num1 = it
})
TextField(value = num2, onValueChange = {
num2 = it
})
Spacer(modifier = Modifier.height(32.dp))
Row {
Button(onClick = {
var result = num1.toInt() + num2.toInt()
Toast.makeText(applicationContext, "Result is $result", Toast.LENGTH_SHORT).show()
}) {
Text(text = "Add")
}
Spacer(modifier = Modifier.width(16.dp))
Button(onClick = {
var result = num1.toInt() - num2.toInt()
Toast.makeText(applicationContext, "Result is $result", Toast.LENGTH_SHORT).show()
}) {
Text(text = "Sub")
}
Spacer(modifier = Modifier.width(16.dp))
Button(onClick = {
var result = num1.toInt() * num2.toInt()
Toast.makeText(applicationContext, "Result is $result", Toast.LENGTH_SHORT).show()
}) {
Text(text = "Mul")
}
Spacer(modifier = Modifier.width(16.dp))
Button(onClick = {
var result = num1.toInt() / num2.toInt()
Toast.makeText(applicationContext, "Result is $result", Toast.LENGTH_SHORT).show()
}) {
Text(text = "Div")
}
}
}
}
}
}
Kemudian akan dilakukan modifikasi terhadap aplikasi tersebut dengan memberikan warna yang lebih terang serta menggunakan box langsung untuk menampilkan result daripada menggunakan toast untuk menampilkan resultnya.
Untuk kodenya dapat dilihat sebagai berikut :
package com.example.calculator
import android.os.Bundle
import android.widget.Toast
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Box
import androidx.compose.material3.Text
import androidx.compose.ui.Modifier
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
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.width
import androidx.compose.material3.Button
import androidx.compose.material3.TextField
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.compose.ui.graphics.Color
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.background
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.TextFieldDefaults
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
var num1 by remember {
mutableStateOf(value = "0")
}
var num2 by remember {
mutableStateOf(value = "0")
}
var result by remember { mutableStateOf("") }
val buttonColor = Color(0xFFBBDEFB) // Same as result box
val textFieldColor = Color(0xFFE3F2FD) // Lighter color
Box(
modifier = Modifier
.fillMaxSize()
.padding(16.dp),
contentAlignment = Alignment.Center
) {
Column(
horizontalAlignment = Alignment.CenterHorizontally
) {
TextField(value = num1, onValueChange = {
num1 = it
},
colors = TextFieldDefaults.colors(
focusedContainerColor = textFieldColor,
unfocusedContainerColor = textFieldColor
)
)
TextField(value = num2, onValueChange = {
num2 = it
},
colors = TextFieldDefaults.colors(
focusedContainerColor = textFieldColor,
unfocusedContainerColor = textFieldColor
))
Spacer(modifier = Modifier.height(32.dp))
Row {
Button(
onClick = { result = "Result: ${num1.toInt() + num2.toInt()}" },
colors = ButtonDefaults.buttonColors(containerColor = buttonColor)
) {
Text(text = "Add", color = Color.Black)
}
Spacer(modifier = Modifier.width(16.dp))
Button(
onClick = { result = "Result: ${num1.toInt() - num2.toInt()}" },
colors = ButtonDefaults.buttonColors(containerColor = buttonColor)
) {
Text(text = "Sub", color = Color.Black)
}
Spacer(modifier = Modifier.width(16.dp))
Button(
onClick = { result = "Result: ${num1.toInt() * num2.toInt()}" },
colors = ButtonDefaults.buttonColors(containerColor = buttonColor)
) {
Text(text = "Mul", color = Color.Black)
}
Spacer(modifier = Modifier.width(16.dp))
Button(
onClick = { result = "Result: ${num1.toInt() / num2.toInt()}" },
colors = ButtonDefaults.buttonColors(containerColor = buttonColor)
) {
Text(text = "Div", color = Color.Black)
}
}
Spacer(modifier = Modifier.height(32.dp))
Box(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp)
.background(Color(0xFFBBDEFB), shape = RoundedCornerShape(8.dp))
.padding(16.dp),
contentAlignment = Alignment.Center
) {
Text(
text = result,
fontSize = 20.sp,
color = Color.Black
)
}
}
}
}
}
}
Untuk link presentasinya adalah di link berikut : https://youtu.be/QaOOuv4UKZw
Link Github : https://github.com/lodaogos/Tugas_5_PPB_Charles
Comments
Post a Comment