Utilizando Dialogs no Jetpack Compose para exibir mensagens ao usuário

Utilizando Dialogs no Jetpack Compose para exibir mensagens ao usuário | Alura Cursos Online

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        …
        setContent {
            PanucciTheme {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    PanucciApp()
                }
            }
        }
    }
}

@Composable
fun AlertDialog(
    onDismissRequest: () -> Unit,
    confirmButton: @Composable () -> Unit,
    modifier: Modifier = Modifier,
    dismissButton: (@Composable () -> Unit)? = null,
    icon: (@Composable () -> Unit)? = null,
    title: (@Composable () -> Unit)? = null,
    text: (@Composable () -> Unit)? = null,
): Unit

@Composable
fun ComposableExcluirDadosNavegacao(
    onConfirmButton: () -> Unit = {},
    onDismissButton: () -> Unit = {},
    setShowDialog: (Boolean) -> Unit = {}
) {
    AlertDialog(
        …
    )
}

@Composable
fun ComposableExcluirDadosNavegacao(
	...
) {
    AlertDialog(
	AlertDialog(
        onDismissRequest = { setShowDialog(false) },
        confirmButton = {
            TextButton(onClick = {
                onConfirmButton()
                setShowDialog(false)
            }) {
                Text("Apagar")
            }
        },
        dismissButton = {
            TextButton(onClick = {
                onDismissButton()
                setShowDialog(false)
            }) {
                Text("Cancelar")
            }
        },
        icon = { Icon(Icons.Filled.Delete, null) },
        title = { Text(text = "Apagar dados de navegação?", fontSize = 20.sp) },
        text = { Text(text = "Isso vai fazer com que seu histórico de navegação seja completamente apagado.") },
        modifier = Modifier.fillMaxWidth()
    )
    )
}

@Composable
fun PanucciApp() {
    Column(
        modifier = Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        val showDialog = remember { mutableStateOf(false) }
        if (showDialog.value)
            ComposableExcluirDadosNavegacao(setShowDialog = {
                showDialog.value = it
            })
        Button(onClick = {
            showDialog.value = true
        }) {
            Text("Abrir o Dialog")
        }
    }
}

Outras empresas do Grupo Alun

Outras empresas do Grupo Alun

Outras empresas do Grupo Alun

Outras empresas do Grupo Alun

Utilizando Dialogs no Jetpack Compose para exibir mensagens ao usuário

Matheus Perez

Explore por tópico

O que são Dialogs?

Estrutura dos Dialogs

Como criar Dialogs

Boas práticas

Conclusão

Matheus Perez

Inscreva-se em nossa Newsletter

Explore por tópico

O que são Dialogs?

Estrutura dos Dialogs

Como criar Dialogs

Boas práticas

Conclusão

Leia também