Hi guys, how to reduce padding imepadding in compo...

# compose

[abdl]

Hi guys, how to reduce padding imepadding in compose multiplatform?

[Alex Styl]

you can't. what are u trying to do?

[abdl]

I have a footer button which has 16.dp padding, but when the keyboard appears the padding bottom seems to be double like 32.dp, what should I do? I want to decrease the padding bottom size from keyboard

[Alex Styl]

it shouldnt do that. can u share the related code?

[abdl]

This is my code

Column(
                    modifier = Modifier.imePadding()
                ) {
                    HorizontalDivider(modifier = Modifier.fillMaxWidth().width(1.dp))
                    Column(
                        modifier = Modifier.fillMaxWidth().padding(16.dp)
                    ) {
                        SummaryRow(
                            label = "Total Harga:",
                            value = currencyFormat(uiState.totalHarga.toDouble()),
                        )
                        SummaryRow(
                            label = "Diskon:",
                            value = currencyFormat(uiState.diskon.toDouble())
                        )
                        HorizontalDivider(
                            modifier = Modifier.fillMaxWidth().width(1.dp)
                                .padding(vertical = 10.dp)
                        )
                        SummaryRow(
                            label = "Totlal Tagihan",
                            value = currencyFormat(uiState.subtotal.toDouble()),
                            isBold = true
                        )
                        Spacer(modifier = Modifier.height(16.dp))
                        FooterButton(
                            onCancelClick = navigateBack,
                            onConfirmClick = {
                                if (uiState.uangDiterima.isEmpty() || uiState.uangDiterima.toInt() < uiState.subtotal) {
                                    state.addError(Exception("Hei, uang diterima tidak bisa kurang dari total harga!"))
                                    return@FooterButton
                                }
                                val method =
                                    if (selectedOption == "Tunai") "Cash" else "Kredit"
                                onEvent(PaymentUiEvent.ConfirmButtonClicked(method))
                            },
                            cancelText = "Kembali",
                            confirmText = "Bayar",
                            borderCancelColor = icon,
                            contentCancelColor = icon
                        )
                    }

[Alex Styl]

what does the footer button's code look like?

[abdl]

Like this:

@Composable
fun FooterButton(
    onCancelClick: () -> Unit,
    onConfirmClick: () -> Unit,
    cancelText: String,
    confirmText: String,
    borderCancelColor: Color = red,
    contentCancelColor: Color = red,
) {
    Row(
        modifier = Modifier.fillMaxWidth(),
        verticalAlignment = Alignment.CenterVertically,
    ) {
        OutlinedButton(
            onClick = onCancelClick,
            colors = ButtonDefaults.outlinedButtonColors(contentColor = contentCancelColor),
            border = BorderStroke(
                width = 1.dp,
                color = borderCancelColor
            ),
            shape = RoundedCornerShape(10.dp),
            modifier = Modifier.weight(1f)
        ) {
            Text(
                cancelText,
                style = MaterialTheme.typography.titleMedium.copy(fontWeight = FontWeight.Bold),
                modifier = Modifier.padding(4.dp)
            )
        }
        Spacer(modifier = Modifier.width(16.dp))
        Button(
            onClick = onConfirmClick,
            colors = ButtonDefaults.buttonColors(
                containerColor = primary,
                contentColor = Color.White
            ),
            shape = RoundedCornerShape(10.dp),
            modifier = Modifier.weight(1f)
        ) {
            Text(
                confirmText,
                style = MaterialTheme.typography.titleMedium.copy(fontWeight = FontWeight.Bold),
                modifier = Modifier.padding(4.dp)
            )
        }
    }
}

[abdl]

Here the padding between keyboard and button is too large and I want to decrease