by @alexstyl
✉️ Leave your feedback

← Back to Foundation Layout

padding

Modifier
in
Foundation Layout
. Since 0.1.0-dev15

Overview

Examples

Community Notes

@Composable
fun PaddingModifier() {
    Box(Modifier.background(color = Color.Gray)) {
        Box(
            Modifier.padding(start = 20.dp, top = 30.dp, end = 20.dp, bottom = 30.dp)
                .size(50.dp)
                .background(Color.Blue)
        )
    }
}

@Composable
fun SymmetricPaddingModifier() {
    Box(Modifier.background(color = Color.Gray)) {
        Box(
            Modifier
                .padding(horizontal = 20.dp, vertical = 30.dp)
                .size(50.dp)
                .background(Color.Blue)
        )
    }
}

@Composable
fun PaddingAllModifier() {
    Box(Modifier.background(color = Color.Gray)) {
        Box(Modifier.padding(all = 20.dp).size(50.dp).background(Color.Blue))
    }
}

@Composable
fun PaddingValuesModifier() {
    val innerPadding = PaddingValues(top = 10.dp, start = 15.dp)
    Box(Modifier.background(color = Color.Gray)) {
        Box(Modifier.padding(innerPadding).size(50.dp).background(Color.Blue))
    }
}
Next ComponentAlignmentLineOffset