1
resposta

[Dúvida] Desafio Dialog

Bom dia! Implementei o Dialog, porém, não estou conseguindo adicionar o comportamento de click ao IconButton.

Eu fiz o seguinte:

  1. Na pasta ui, dentro da pasta components, criei um arquivo AlertDialog

Segue o código:

@Composable
fun AlertDialogDeslogar(
    onDismissRequest: () -> Unit,
    onConfirmation: () -> Unit,
    dialogTitle: String,
    dialogText: String,
    icon: ImageVector,
) {
    AlertDialog(
        icon = {
            Icon(
                icon,
                contentDescription = "Ícone de Alerta",
                tint = colorResource(id = R.color.warning_yellow),
                modifier = Modifier.size(40.dp)
            )
       },
        title = {
            Text(
                text = dialogTitle,
                fontSize = 20.sp,
                textAlign = TextAlign.Center,
                fontWeight = FontWeight.Bold
            )
        },
        text = {
            Text(
                text = dialogText,
                fontSize = 16.sp,
                textAlign = TextAlign.Center
            )
       },
        onDismissRequest = { onDismissRequest() },
        confirmButton = {
            TextButton(onClick = { onConfirmation() }) {
                Text(
                    "Confirmar",
                    fontSize = 18.sp,
                    color = colorResource(id = R.color.brasil_green)
                )
            }
        },
        dismissButton = {
            TextButton(onClick = { onDismissRequest() }) {
                Text(
                    "Cancelar",
                    fontSize = 18.sp,
                    color = colorResource(id = R.color.dark_gray)
                )
            }
        }
    )
}

@Composable
fun DialogDeslogar() {
    val openAlertDialog = remember { mutableStateOf(false) }
    val dataStore = LocalContext.current.dataStore
    val coroutineScope = rememberCoroutineScope()

    when {
        openAlertDialog.value -> {
            AlertDialogDeslogar(
                onDismissRequest = { openAlertDialog.value = false },
                onConfirmation = {
                    openAlertDialog.value = false
                    coroutineScope.launch {
                        dataStore.edit { preferences ->
                            preferences[booleanPreferencesKey("logado")] = false
                        }
                    }
                },
                dialogTitle = "Tem certeza que deseja sair?",
                dialogText = "Ao clicar em Confirmar, você será deslogado da conta.",
                icon = Icons.Default.Info
            )
        }
    }
}

@Preview(showBackground = true)
@Composable
fun AlertDialogDeslogarPreview() {
    AlertDialogDeslogar(
        onDismissRequest = {},
        onConfirmation = {},
        dialogTitle = "Tem certeza que deseja sair?",
        dialogText = "Ao clicar em Confirmar, você será deslogado da conta.",
        icon = Icons.Default.Warning
    )
}

O AlertDialog, está assim:

Imagem do alert criado

Mas, não estou conseguindo chamá-lo dentro de ListaContatosTela, pois a função que chama o dialog, é DialogDeslogar() e é uma função @Composable. Podem me ajudar, please?

1 resposta

Oii Denise, tudo bem?

Pra usar a DialogDeslogar em locais que não permitem Composables, você pode criar um estado que vai ser true / false.

Em algum ponto do seu codigo você coloca a chamada de "DialogDeslogar" apenas quando essa estado for true.

Daí ao invés de chamar DialogDeslogar você apenas muda esse estado para true, e a caixa vai aparecer, tem um exemplo aqui.

Esse é um trecho de código sobre como ficaria:

if (mostrarCaixaDialogoDeslogar) {
    DialogDeslogar()
}

Espero que te ajude.

Um abraço e bons estudos.