Custom Compose Arrangement to add extra spacing at beginning and end of a LazyRow/LazyColumn

Question

How can I create a custom Arrangement for LazyRow to add additional spacing at beginning and end, but have even spacing in between?

Start|< more space> Item 1 Item 2 Last Item |End

object CustomArrangement : Arrangement.Horizontal {
  override fun Density.arrange(
    totalSize: Int,
    sizes: IntArray,
    layoutDirection: LayoutDirection,
    outPositions: IntArray
  ) {

  }
}

https://developer.android.com/jetpack/compose/lists#custom-arrangements

Alice

Answer 1

It is not the answer to your question, but you can achieve the same adding a header and footer items, or using a horizontal PaddingValues.

A simple LazyRow:

LazyRow(
    horizontalArrangement =   Arrangement.spacedBy(8.dp),
    contentPadding = PaddingValues(horizontal = 50.dp),
    modifier= Modifier.fillMaxSize(),
) {

    items(itemsList) {
        Text("Item is $it")
    }
}

or something like:

LazyRow(
    horizontalArrangement =   Arrangement.spacedBy(8.dp),
    modifier= Modifier.fillMaxSize()
) {
    //Header
    item(){
        Spacer(modifier = Modifier.width(40.dp))
    }
    items(itemsList) {
        Text("Item is $it")
    }
    //Footer
    item(){
        Spacer(modifier = Modifier.width(40.dp))
    }
}

Niacin

Answer 2

Maybe you can get the effect you're looking for with one of the paramenters for LazyRow: contentPadding = PaddingValues(horizontal = "your_value")

Wicketkeeper

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Included