Home > other >  Android compose snackbar showing again on config changes
Android compose snackbar showing again on config changes

Time:10-16

I want to display a snackbar once, on android compose, but as soon as I change the screen rotation, the snackbar shows again, i took this example from official android documentation and it is doing the same thing:

@Composable
fun LoginScreen(
    state: Boolean = true,
    scaffoldState: ScaffoldState = rememberScaffoldState()
) {
    // If the UI state contains an error, show snackbar
    if (state) {

        // `LaunchedEffect` will cancel and re-launch if
        // `scaffoldState.snackbarHostState` changes
        LaunchedEffect(scaffoldState.snackbarHostState) {
            // Show snackbar using a coroutine, when the coroutine is cancelled the
            // snackbar will automatically dismiss. This coroutine will cancel whenever
            // `state.hasError` is false, and only start when `state.hasError` is true
            // (due to the above if-check), or if `scaffoldState.snackbarHostState` changes.
            scaffoldState.snackbarHostState.showSnackbar(
                message = "Error message",
                actionLabel = "Retry message"
            )
        }
    }

    Scaffold(scaffoldState = scaffoldState) {
    }
}

My question is: How do you display a snackbar once with a side effect even if the rotation changes?

CodePudding user response:

For example, you can save the state to a local variable using rememberSaveable and set it to false when the snackbar disappears.

var localState by rememberSaveable(state) { mutableStateOf(state) }
// If the UI state contains an error, show snackbar
if (localState) {

    // `LaunchedEffect` will cancel and re-launch if
    // `scaffoldState.snackbarHostState` changes
    LaunchedEffect(scaffoldState.snackbarHostState) {
        // Show snackbar using a coroutine, when the coroutine is cancelled the
        // snackbar will automatically dismiss. This coroutine will cancel whenever
        // `state.hasError` is false, and only start when `state.hasError` is true
        // (due to the above if-check), or if `scaffoldState.snackbarHostState` changes.
        scaffoldState.snackbarHostState.showSnackbar(
            message = "Error message",
            actionLabel = "Retry message"
        )
        localState = false
    }
}
  • Related