Fix item at a given pivot in Jetpack Compose's TvLazyRow/TvLazyColumn

Question

I am using the TvLazyRow composable from the jetpack compose for tv library and using PivotOffsets to position the focused item at a fixed position in the row.

When I scroll the row to the very end, the fixed position value is not respected and the focusable item goes to the very end.

How do keep the position fixed even when scrolling to the very end or beginning?

Observed behaviour:

Desired behaviour:

Answer 1

pivotOffsets in TvLazyRow or TvLazyColumn is not respected for the items at the beginning or the end of the list. To get your desired behaviour, you can add a dummy non-focusable box at the beginning and end of the list so that it maintains your items at the desired pivots.

TvLazyRow {

    // dummy non-focusable placeholder box to occupy the space 
    // when one of the first few cards are focused
    item { PlaceholderBox(width = 300.dp) }

    items(10) {
        Card()
    }

    // dummy non-focusable placeholder box to occupy the space 
    // when one of the last few cards are focused
    item { PlaceholderBox(width = 400.dp) }

}