1

We can have Navigation Drawer in JetpackCompose by using Scaffold as below

Scaffold(
    drawerContent = { Text(text ="Drawer") }
) {}

I want to make the width of the drawer larger. How can I do so? like the green arrow.

fun customShape() =  object : Shape {
        override fun createOutline(
            size: Size,
            layoutDirection: LayoutDirection,
            density: Density
        ): Outline {
            return Outline.Rectangle(Rect(0f, 0f, size.width+150, size.height))
        }
    }

Scaffold(
  scaffoldState = state,
  drawerShape = customShape(),
  drawerContent = {Box(modifier = Modifier
    .fillMaxWidth()
    .fillMaxHeight()
    .background(color = Color.Red)){
        Text("draer")
     }
   },
   content = {}
  )
Kawan MC
  • 33
  • 4
  • You have a few good answers for that here https://stackoverflow.com/questions/65305734/how-to-set-the-scaffold-drawer-width-in-jetpackcompose – Roman May 01 '23 at 13:27
  • This work if you want the drawer to be smaller. but if you want it to be larger (ex: full screen width). The drawer looks like it is larger but the content is still limited. All is truncaded. Any one have any idea on how to solves that ? – Kawan MC May 01 '23 at 14:20

0 Answers0