https://kotlinlang.org logo
Title
t

Tower Guidev2

01/27/2023, 3:56 PM
Hi i am using material3 compose snackbar and wishing to centre it in the middle of my UI...
this is the code i have...
val snackbarHostState = remember { SnackbarHostState() }

LaunchedEffect(connectionState) {
    when (connectionState) {
        is BackgroundState.Connected -> snackbarHostState.currentSnackbarData?.dismiss()
        is BackgroundState.Disconnected -> snackbarHostState.showSnackbar(
            message = "Internet connection lost",
            actionLabel = "Ok"
        )
        else -> doNothing()
    }
}

Scaffold(
    snackbarHost = { SnackbarHost(snackbarHostState) },
    topBar = { Spacer(modifier = Modifier.height(0.dp)) },
    modifier = Modifier.fillMaxSize(),
) { paddingValues ->
    Column(
however i cannot see how to centre the snackbar vertically in my UI is it possible to affect the snackbar position within a scaffold?
k

Kirill Grouchnikov

01/27/2023, 4:12 PM
In Material, the snackbar is at the bottom of the screen
t

Tower Guidev2

01/27/2023, 4:13 PM
oh 🤦‍♂️ is there no way to change that?
k

Kirill Grouchnikov

01/27/2023, 4:14 PM
That is not a face palm. You are using a specific design system. If you want to deviate from what that design system provides, you will need to implement your own solution.
t

Tower Guidev2

01/27/2023, 4:15 PM
m3 places the snackbar above the FAB
k

Kirill Grouchnikov

01/27/2023, 4:16 PM
Correct, and that is a part of the Material design spec
a

Albert Chang

01/27/2023, 4:53 PM
That being said, you don’t have to use
Scaffold
and you can place the
SnackbarHost
wherever you want.