Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Open navigation drawer from right to left with ModalDrawer in Jetpack compose

I have been trying to implement navigation drawer in Jetpack compose. The following code shows a simple way to do it:

@Composable
fun ModalDrawerSample() {
    val drawerState = rememberDrawerState(DrawerValue.Closed)
    val scope = rememberCoroutineScope()

    ModalDrawer(
        drawerState = drawerState,
        drawerContent = {
            Column {
                Text("Text in Drawer")
                Button(onClick = {
                    scope.launch {
                        drawerState.close()
                    }
                }) {
                    Text("Close Drawer")
                }
            }
        },
        content = {
            Column {
                Text("Text in Bodycontext")
                Button(onClick = {

                    scope.launch {
                        drawerState.open()
                    }

                }) {
                    Text("Click to open")
                }
            }
        }
    )
}

But how do I make navigation drawer open from right to left?

like image 701
Sparsh Dutta Avatar asked Nov 21 '25 20:11

Sparsh Dutta


1 Answers

You can use LocalLayoutDirection providing a LayoutDirection.Rtl value.

Something like:

CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Rtl ) {
    ModalDrawer(
        drawerState = drawerState,
        drawerContent = { /* ...*/ },
        content = { /* ..*/ }
    )
}

enter image description here

like image 63
Gabriele Mariotti Avatar answered Nov 24 '25 12:11

Gabriele Mariotti



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!