CODEWITHSUNDEEP
androidkotlinandroid-mapviewandroid-jetpackandroid-jetpack-compose
qr_3
qr_3

Reputation: 141

Jetpack Compose: Scaffold drawer opens when dragging MapView

When using the drawer in a Jetpack Compose scaffold, gestures can be used to open and close it. If the scaffold content contains a MapView, the map cannot be dragged around horizontally. Instead, the drawer is opened.

When scrollable rows are dragged (scrolled) through horizontally this does not happen, the drawer is not opened then.

How can I prevent the drawer from opening when the map is dragged by the user? When the rest of the scaffold content is dragged, the gesture should still work.

Unfortunately, wrapping the AndroidView with a Row does not solve the problem, as well as using the ModalDrawer instead of the scaffold.

Code to reproduce with Compose rc02 and kotlin 1.5.10 (EDIT: verified with Compose 1.0.3 and Kotlin 1.5.30):

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MaterialTheme {
                Scaffold(
                    drawerContent = {
                        Text("Drawer Content")
                    },
                    content = {
                        Column {
                            Text("Dragging here should open the drawer")

                            val mapView = rememberMapViewWithLifecycle()
                            AndroidView({ mapView }, Modifier.fillMaxSize())
                        }
                    }
                )
            }
        }
    }
}

The function rememberMapViewWithLifecycle() is taken from the Crane sample app.

Upvotes: 14

Views: 3908

Answers (2)

qr_3
qr_3

Reputation: 141

The Compose developers fixed the issue according to this ticket: https://issuetracker.google.com/issues/202569585

Apparently the fix is not included in today's release 1.1.0-beta03, I guess we have to wait for the next one.

Upvotes: 0

Orlando Novas Rodriguez
Orlando Novas Rodriguez

Reputation: 416

Something similar happened to me when trying to integrate MapBox into an app with NavigationDrawer using Jetpack Compose. What I did was add the property drawerGesturesEnabled = false, of the Scaffold, in this way the NavigationDrawer continues to work when I click on the menu Icon

If you use drawerGesturesEnabled = scaffoldState.drawerState.isOpen you can close it normally

Upvotes: 18

Related Questions