NumPad

NumPad.kt

@Composable
fun NumPad(
    modifier: Modifier = Modifier,
    onClick: (NumPadButtonType) -> Unit
) {
    val baseNumbers = listOf(
        listOf(NumPadButtonType.NUM_1, NumPadButtonType.NUM_2, NumPadButtonType.NUM_3),
        listOf(NumPadButtonType.NUM_4, NumPadButtonType.NUM_5, NumPadButtonType.NUM_6),
        listOf(NumPadButtonType.NUM_7, NumPadButtonType.NUM_8, NumPadButtonType.NUM_9),
        listOf(NumPadButtonType.EMPTY, NumPadButtonType.NUM_0, NumPadButtonType.BACK)
    )

    Layout(
        modifier = Modifier.then(modifier),
        content = {
            Column {
                baseNumbers.forEach { rowItems ->
                    Row(modifier = Modifier.weight(1f)) {
                        rowItems.forEach {
                            NumPadButton(
                                modifier = Modifier.weight(1f).fillMaxHeight(),
                                enabled = true,
                                hidden = it == NumPadButtonType.EMPTY,
                                buttonType = it,
                                onClick = onClick
                            )
                        }
                    }
                }
            }
        }
    ) { measurables, constraints ->
        val minSize = minOf(constraints.maxHeight, constraints.maxWidth)

        val childConstrains = constraints.copy(maxWidth = minSize, maxHeight = minSize)
        val measured = measurables.map { it.measure(childConstrains) }

        layout(minSize, minSize) {
            measured.forEach { it.placeRelative(0, 0) }
        }
    }
}

@Composable
private fun NumPadButton(
    enabled: Boolean,
    hidden: Boolean,
    modifier: Modifier = Modifier,
    buttonType: NumPadButtonType,
    onClick: (NumPadButtonType) -> Unit = {}
) {
    val boxModifier = if(!hidden) {
        Modifier
            .border(BorderDefaults.borderWidth, MaterialTheme.colors.primary, MaterialTheme.shapes.small)
            .clickable(enabled, role = Role.Button, onClick = { onClick.invoke(buttonType) })
    } else {
        Modifier
    }

    Box(
        modifier = Modifier
            .background(Color.Transparent)
            .padding(4.dp)
            .then(boxModifier)
            .then(modifier)
            .aspectRatio(1f, false),
        contentAlignment = Alignment.Center
    ) {
        if(buttonType.icon != null) {
            val tintAlpha = if (enabled) LocalContentAlpha.current else ContentAlpha.disabled
            Icon(buttonType.icon, buttonType.value, tint = MaterialTheme.colors.onSurface.copy(alpha = tintAlpha))
        } else {
            Text(
                text = buttonType.value,
                style = MaterialTheme.typography.h3
            )
        }
    }
}

enum class NumPadButtonType(
    val value: String,
    val icon: ImageVector? = null
) {
    NUM_1("1"),
    NUM_2("2"),
    NUM_3("3"),
    NUM_4("4"),
    NUM_5("5"),
    NUM_6("6"),
    NUM_7("7"),
    NUM_8("8"),
    NUM_9("9"),
    NUM_0("0"),
    EMPTY(""),
    BACK("Remove last", Icons.Default.ArrowBack)
}