brandonmcansh

    brandonmcansh

    2 years ago
    running into weird UI issue with bottomdrawerlayout - i'm seeing this weird surface color persisting behind my content for the drawerContent that I can't mask or get rid of. As you can see from the top left and right next to my rounded corners is the background surface of the root composable
    DrawerContent is a
    Stack
    Stack {
            Surface(
                shape = RoundedCornerShape(topLeft = 32.dp, topRight = 32.dp),
                modifier = Modifier.fillMaxSize(),
                color = MaterialTheme.colors.secondary
            ) {
                Box(shape = RoundedCornerShape(topLeft = 32.dp, topRight = 32.dp)) {
                    Text(
                        modifier = Modifier.padding(16.dp) + Modifier.padding(start = 8.dp),
                        style = MaterialTheme.typography.body2,
                        text = "hi"
                    )
                }
            }
            Surface(
                modifier = Modifier.fillMaxSize() + Modifier.padding(top = 48.dp, start = 4.dp, end = 4.dp),
                color = MaterialTheme.colors.surface,
                shape = RoundedCornerShape(topLeft = 32.dp, topRight = 32.dp)
            ) {
                ConstraintLayout(modifier = Modifier.padding(16.dp)) {
                    val (label, url, submit) = createRefs()
    
                    ExtendedFloatingActionButton(
                        modifier = Modifier.constrainAs(submit) {
                            start.linkTo(parent.start)
                            end.linkTo(parent.end)
                            top.linkTo(url.bottom, margin = 2.dp)
                        } + Modifier.padding(16.dp),
                        text = { Text("Save") },
                        icon = { Icon(Icons.Filled.Save) },
                        backgroundColor = MaterialTheme.colors.onSurface,
                        contentColor = MaterialTheme.colors.surface,
                        onClick = {
    
                        })
                }
            }
        }
    BottomDrawerLayout(
                drawerState = sheetState,
                drawerContent = {
                    ProfileContent(navigateTo, signInState)
                },
                bodyContent = {
                    BodyContent(
                        navigateTo = navigateTo,
                        sheetState = sheetState,
                        signInState = signInState,
                        pantry = pantry
                    )
                }
            )
    is the drawer layout
    ah missed the drawerShape modifier
    nvm