I have a horizontally scrolling row with three items. I want each ones width to be the full width of...

# compose

[Colton Idle]

I have a horizontally scrolling row with three items. I want each ones width to be the full width of the screen. essentially creating my own little horizontal viewpager. Is that possible? Current code in thread.

[Colton Idle]

Row(modifier = Modifier.horizontalScroll(rememberScrollState())) {
    Button(
        onClick = { /*TODO*/ },
        modifier = Modifier.fillMaxWidth().border(1.dp, Color.Green)
    ) { Text(text = "One") }
    Button(
        onClick = { /*TODO*/ },
        modifier = Modifier.fillMaxWidth().border(1.dp, Color.Green)
    ) { Text(text = "Two\nTwo\nTwo") }
    Button(
        onClick = { /*TODO*/ },
        modifier = Modifier.fillMaxWidth().border(1.dp, Color.Green)
    ) { Text(text = "Three") }
}

[dimsuz]

this reminds me of example which involved Intrinsics in Layouts compose codelab. Did you see it?

[Colton Idle]

I did all of the codelabs and pathway back in alpha/beta, but don't recall intrinsics being mentioned. I'll take another look later today

[Zach Klippenstein (he/him) [MOD]]

This doesn’t sound like an intrinsics to me. fillMaxWidth won’t work because making a row horizontally scrollable increases its max width constraint to infinity, which for most components mean they’ll just be their min width. You need to grab the width constraints that the row is seeing and manually pass those to your items (e.g. via a custom layout or BoxWithConstraints).

[Colton Idle]

Why do designers make my life so difficult. 🤣

[raenardev]

Yep. I’m using essentially the same method as onMeasureConstrants that Adam showed here:
https://kotlinlang.slack.com/archives/CJLTWPH7S/p1625934686417600
@Colton Idle take a look.

[raenardev]

I currently use it to measure and remember height of my toolbar, to do some collapsing effects by observing state of the scroll and showing it if offset is right.

[Colton Idle]

What I really want in this case is a horizontal pager, but I found a case where horizontal pager crashes my app so I was trying to work around it with this simple setup.

I guess I will just file the bug with horizontal view pager.

[Zach Klippenstein (he/him) [MOD]]

Definitely please do that at least 😅

[Colton Idle]

Can't wait for chris banes snapper library. Viewpager is so close to what I want, but not being able to show multiple items at once draws it out of the question for certain scenarios that my design team wants.

Somehow with all of the layout fundamentals, and accompanist pager, creating an airbnb esque carousel with pager indicators still isn't do-able "out of the box". 😭

[raenardev]

Yep, also have that use case. It is the reason i didn’t update accompanist yet

[Colton Idle]

I suppose someone could just grab the version of viewpager before it was made lazy, and make a library for that. 😁