Jetpack Compose ClipToPadding

Question

I understand that i can add padding to a widget like so

LazyColumn(
   modifier = Modifier.padding(0.dp, 0.dp, 0.dp, 10.dp),
   content = {
        items(items.size) { index ->
            EmergencyContactComposeItem(emergencyContact = items[index])
        }
    }
)

But how do i produce the same result as "clipToPadding=false"

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:clipToPadding="false"
    android:paddingBottom="25dp">

Where the view / widget will not clip the padding, but still enforce the bounds?

Answer 1

Try content padding like below:

LazyColumn(
    contentPadding = PaddingValues(bottom=10.dp),
){

    items(items.size) { index ->
        EmergencyContactComposeItem(emergencyContact = items[index])
    }
}

Answer 2

LazyColumn takes contentPadding to implement clipToPadding. You can use it in three ways.

First One: If you want to add same content padding in all directions then use:

LazyColumn(
   contentPadding = PaddingValues(all = 16.dp)
) {
    items(items.size) { index ->
        EmergencyContactComposeItem(emergencyContact = items[index])
    }
}

Second One: If you want to add same content padding in horizontal(start and end) or in vertical(top and bottom) then use:

LazyColumn(
   contentPadding = PaddingValues(horizontal = 16.dp, vertical = 10.dp)
) {
    items(items.size) { index ->
        EmergencyContactComposeItem(emergencyContact = items[index])
    }
}

Third One: If you want to add different content padding in all directions or if you want to add in some directions then use:

LazyColumn(
   contentPadding = PaddingValues(start = 5.dp, top = 10.dp, end = 8.dp, bottom = 6.dp)
) {
    items(items.size) { index ->
        EmergencyContactComposeItem(emergencyContact = items[index])
    }
}