I want to show a box appeared from bottom after onclick. Tried using `BottomDrawerLayout` and `Dropd...

# compose

[amar_1995]

I want to show a box appeared from bottom after onclick.
Tried using BottomDrawerLayout and DropdownPopup.
Is there something else to which I can try to achieve this ?

[emmax]

Like a snackbar? https://material.io/develop/android/components/snackbar/

[Bruno_]

I've asked the same question there https://kotlinlang.slack.com/archives/CJLTWPH7S/p1573481833494900
and I'm trying to implement it right now

[Bruno_]

in the end I did this

AlertDialog(onCloseRequest = {},
            text = {
                Text("Applied successfully to $progress out of $selectedAdsSize ads")
            },
            confirmButton = {
                Button(text = "Go back to ads list", onClick = { navigateTo(Screen.AdsList) })
            }
        )

not really a snackbar but gets the job done

[amar_1995]

I don't really want to implement snackbar. I want to implement something like BottomSheetDialog. So, Is there anything in compsoe ui.

[matvei]

Hey 🙂 Thanks for this question. Any reason why BottomDrawerLayout didn't work for you? It's essentially a simpler version of BottomSheet, which to be implemented later.

[amar_1995]

First is I am getting this error Drawer shouldn't have infinite height . It is solved after binding inside container.
Second I cannot able to decide what to put inside bodyContent as I need to show bottom drawer after onClick method.

[amar_1995]

I required multiple drawer in single activity. So cannot able to decide what the body content will be

[matvei]

By multiply drawers you mean Left and Bottom? Or you need several Bottom Drawers for some reason?

[matvei]

Glad that you solved issue with infinite height. as Body content you can put whatever you want. If your content is lazy, you can created a state and compose different UIs in BottomDrawer based on that state, e.g.

enum class DrawerTypes { None, Settings, UserProfile}
@Composable fun Test() {
   val bottomDrawerState = +state { None }
   BottomDrawerLayout{
        ...,
        drawerContent = {
            when (bottomDrawerState) {
                Settings -> Settings()
                None -> @Composable {}
                ...
            }
        },
        bodyContent = YourAppContent({ newDrawerState:DrawerTypes ->  bottomDrawerState.value = newDrawerState })
   }
}

[amar_1995]

Several bottom drawer which will open when a click will trigger.

setContent {
		MaterialTheme(
			colors = lightThemeColors,
			typography = themeTypography
		) {
			 EditScreen()
		}
}

@Composable
fun EditScreen() {
	VerticalScroller() {
		Padding(padding = 4.dp) {
			Column {
				EditView1()
				EditView2()
			}
		}
	}|
}

In Above code editView1 and editview2 will trigger onClick which will open bottomDrawer

[matvei]

So you can define different types of Drawer UIs and pass lambda to control it to your app to choose what to do on Click (you also need to open it right now)

[matvei]

Got it. In general IMO it makes sense to have one bottom drawer (or one BottomSheet) and provide different content for it. It definitely should be easier than it is right now, but for now approach I've described above should work

[amar_1995]

Okay, Will give a try.
Thanks.

[amar_1995]

@matvei BottomDrawer internally implements StateDraggable and BottomDrawer can open while dragging and also with onClick event. So i am not able to provide two drawerContent

[matvei]

Hm, not sure I follow. Do you want to open it only on click? Then we have gestureEnabled: Boolean param in BotomDrawerLayout, maybe that can help.

[amar_1995]

Ohh making gestureEnabled false worked for me.

[matvei]

Glad it helped! Anyway it's still a Drawer and not a proper BottomSheet, but might work right now for you 🙂

[amar_1995]

Yeah thanks man 🙂