chanjungskim
03/07/2023, 2:47 AMChris Sinco [G]
03/07/2023, 5:52 AMchanjungskim
03/07/2023, 5:54 AM@Composable
fun NumberPadButton(
text: String,
onClick: () -> Unit = {},
modifier: Modifier
) {
Button(
onClick = onClick,
shape = RoundedCornerShape(10.dp),
colors = ButtonDefaults.buttonColors(
containerColor = Color.White,
contentColor = Color.Gray002
),
contentPadding = PaddingValues(start = 0.dp, end = 0.dp, top = 5.dp, bottom = 0.dp),
modifier = modifier
) {
Text(
text = text,
fontSize = 23.sp,
color = Color.Gray002,
textAlign = TextAlign.Center,
modifier = Modifier
.fillMaxSize()
.align(Alignment.CenterVertically)
)
}
}
I removed the button's padding with PaddingValues. after that I wanted Text to be the center of it. But couldn't find better way.Chris Sinco [G]
03/07/2023, 6:07 AM@Preview
@Composable
fun NumberButtonsPreview() {
MaterialTheme {
Surface {
Column(
Modifier
.fillMaxSize()
.padding(8.dp),
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
Row(
Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
NumberPadButton(text = "1", modifier = Modifier.weight(1f))
NumberPadButton(text = "2", modifier = Modifier.weight(1f))
NumberPadButton(text = "3", modifier = Modifier.weight(1f))
}
Row(
Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
NumberPadButton(text = "4", modifier = Modifier.weight(1f))
NumberPadButton(text = "5", modifier = Modifier.weight(1f))
NumberPadButton(text = "6", modifier = Modifier.weight(1f))
}
Row(
Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
NumberPadButton(text = "7", modifier = Modifier.weight(1f))
NumberPadButton(text = "8", modifier = Modifier.weight(1f))
NumberPadButton(text = "9", modifier = Modifier.weight(1f))
}
Row(
Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) {
NumberPadButton(text = "", modifier = Modifier.weight(1f))
NumberPadButton(text = "0", modifier = Modifier.weight(1f))
NumberPadButton(text = "<", modifier = Modifier.weight(1f))
}
}
}
}
}
@Composable
fun NumberPadButton(
modifier: Modifier = Modifier,
text: String,
onClick: () -> Unit = {}
) {
Button(
onClick = onClick,
shape = RoundedCornerShape(10.dp),
modifier = modifier.aspectRatio(1f)
) {
Text(
text = text,
fontSize = 23.sp,
)
}
}
chanjungskim
03/07/2023, 6:18 AMChris Sinco [G]
03/07/2023, 6:21 AMchanjungskim
03/07/2023, 6:22 AMChris Sinco [G]
03/07/2023, 6:24 AMchanjungskim
03/07/2023, 6:25 AMChris Sinco [G]
03/07/2023, 6:27 AMchanjungskim
03/07/2023, 6:28 AMChris Sinco [G]
03/07/2023, 6:31 AM@Composable
fun NumberPadButton(
modifier: Modifier = Modifier,
text: String,
onClick: () -> Unit = {}
) {
Button(
onClick = onClick,
shape = RoundedCornerShape(10.dp),
modifier = modifier.size(46.dp),
contentPadding = PaddingValues(0.dp)
) {
Text(
text = text,
fontSize = 23.sp,
)
}
}