A modern programming language that makes developers happier.

kotlinlang

Screen Shot 2021-08-26 at 9.52.59 AM.png

Trying to recreate this. Having 2 issues:
1. I don't know how to get the permanent bottomSheet to have a set weight/percentage based height.
2. My rounded corners on the bottom sheet end up white.
Code and current screenshot in thread.

Screen Shot 2021-08-26 at 9.52.21 AM.png

Code

```@Composable
@OptIn(ExperimentalMaterialApi::class)
fun BottomSheetScaffoldSample() {
    val scope = rememberCoroutineScope()
    val scaffoldState = rememberBottomSheetScaffoldState()
    BottomSheetScaffold(
        modifier = Modifier.fillMaxSize(),
        sheetContent = {
            Surface(
                color = Color.Blue,
                shape = RoundedCornerShape(topStart = 48.dp, topEnd = 48.dp),
                modifier = Modifier
                    .fillMaxWidth()
                    .height(400.dp)
            ) {
                Text("Swipe up to expand sheet")
            }
        },
        scaffoldState = scaffoldState,
        sheetPeekHeight = 128.dp, //Any way to set this to be percentage based?
    ) { innerPadding -&gt;
        Column {
            Box(
                modifier = Modifier
                    .background(Color(0xffFFF2CC))
                    .weight(.7f)
                    .fillMaxWidth()
            )
            Box(
                modifier = Modifier
                    .background(Color.Magenta)
                    .weight(.3f)
                    .fillMaxWidth()
            )
        }
    }
}```


Hey, i have a question: does the bottom.sheet work when collapse? Does it pass the clicks further down?
In my experience with it, since beta04, when ypu first click on it it expands and only after you can interact with the items inside it.

I don't have any interactions in the bottom sheet at the moment, so I can't comment on that (yet).

Did you tried to use box with image aligned to top and bottom sheet aligned to the bottom?

Currently it is aligned to top and to bottom. My problem is that I don't know how to size the bottom sheet to be percentage based.

Huh, i just missed your code snippet, sorry

Height of the screen or height of parent component?

Whatever sheetPeekHeight uses.

`sheetPeekHeight = 128.dp, //Any way to set this to be percentage?`

Could you calculate container height and just multiply by 0.35?

Have u tried wrapping BottomSheetScaffold with BoxWithConstraints?

It should give you maxHeight which you can use to calculate a peekHeight for your bottomSheet

Considered but read on here that it's slightly more expensive so curious if I'm just missing some other apis available to me.