Home > Net >  Mutablestateof - State hoisting
Mutablestateof - State hoisting

Time:11-15

What to do to manage one state in two functions? (openDialog) How to transfer openDialog state from ProductDialog() to AppBar()? I know I can make a separate class per state but I don't want to.

@Composable
fun ProductDialog() {
    val openDialog = rememberSaveable() { mutableStateOf(true) }
    val productNameState = remember { mutableStateOf("") }

    AlertDialog(
        onDismissRequest = { openDialog.value = false },
        title = { Text(
            modifier = Modifier.padding(bottom = 8.dp),
            text = "Add new product",
            fontSize = 20.sp,
            fontWeight = FontWeight.Bold
        ) },
        confirmButton = { Button(onClick = { openDialog.value = false }) {
            Text(text = "Add") }
        },
        dismissButton = { Button(onClick = { openDialog.value = false }) {
            Text(text = "Cancel")
            }
        },
        text = {
            Column() {
                TextField(value = productNameState.value, onValueChange = {
                })
                TextField(value = productNameState.value, onValueChange = {})
            }
        }
    )
}

@Composable
fun AppBar() {
    val openDialog = rememberSaveable() { mutableStateOf(false) }

    if (openDialog.value) ProductDialog()

    Scaffold(
        topBar = {
                TopAppBar(
                    actions = { Icon(imageVector = Icons.Default.Menu, contentDescription = null) },
                    title = { Text(text = "Shopping List Compose") })
                },
        floatingActionButton = {
            FloatingActionButton(modifier = Modifier.padding(10.dp), onClick = { openDialog.value = true }) {
            Icon(Icons.Default.Add, contentDescription = null)
        }}
    ) {
        ListItems()
    }
}

What to do to manage one state in two functions? (openDialog)

CodePudding user response:

From the example you shared, it seems that the only use of openDialog in ProductDialog is to close the dialog. You can instead paas a lambda to ProductDialog to close the dialog.

@Composable
fun ProductDialog(closeDialog: () -> Unit) {
    AlertDialog(
        onDismissRequest = closeDialog,
        title = { ... },
        confirmButton = { 
            Button(onClick = closeDialog) {
                Text(text = "Add")
            }
        },
        dismissButton = { 
            Button(onClick = closeDialog) {
                Text(text = "Cancel")
            }
        },
        text = { ... }
    )
}

@Composable
fun AppBar() {
    val openDialog by rememberSaveable() { mutableStateOf(false) }

    if (openDialog) ProductDialog { openDialog = false}

   ...
}
  • Related