Instruções Gerais:

  • Resolva as atividades em ordem progressiva de maturidade.
  • Cada nível adiciona requisitos técnicos, tratamento de erros e casos de borda reais.
  • Consulte o gabarito comentado ao final de cada questão para autoavaliação.

🎯 Nível 1: Fundamentos

Problema 8.1 — Campo de Senha com PasswordVisualTransformation e Toggle de Visibilidade

Contexto: Campo de Senha com PasswordVisualTransformation e Toggle de Visibilidade no contexto de Interações, Gestos, Teclado Virtual e Validação de Inputs.

Requisitos de Execução:

  1. Criar campo de senha com ícone de alternância para exibir/ocultar caracteres.

Resultado Esperado

Entrada de senha segura com controle de visibilidade.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_8_1_SeuNome
  2. Envie na tarefa: Atividade Cap 8 - Interações, Gestos, Teclado Virtual e Validação de Inputs
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.ui

import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.text.input.VisualTransformation

@Composable
fun CampoSenha(senha: String, onSenhaChange: (String) -> Unit) {
    var visivel by remember { mutableStateOf(false) }

    OutlinedTextField(
        value = senha,
        onValueChange = onSenhaChange,
        label = { Text("Senha Corporativa") },
        visualTransformation = if (visivel) VisualTransformation.None else PasswordVisualTransformation(),
        trailingIcon = {
            IconButton(onClick = { visivel = !visivel }) {
                Text(if (visivel) "🙈" else "👁️")
            }
        }
    )
}

🔍 Nível 2: Prática

Problema 8.2 — Opções de Teclado Virtual com KeyboardOptions (Email, Número)

Contexto: Opções de Teclado Virtual com KeyboardOptions (Email, Número) no contexto de Interações, Gestos, Teclado Virtual e Validação de Inputs.

Requisitos de Execução:

  1. Configurar teclado numérico para digitação de CPF com ação ImeAction.Next.

Resultado Esperado

Teclado virtual customizado e integrado com ações de foco.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_8_2_SeuNome
  2. Envie na tarefa: Atividade Cap 8 - Interações, Gestos, Teclado Virtual e Validação de Inputs
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.ui

import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.KeyboardType

@Composable
fun CampoDocumentoCpf(cpf: String, onCpfChange: (String) -> Unit, onAvancar: () -> Unit) {
    OutlinedTextField(
        value = cpf,
        onValueChange = onCpfChange,
        label = { Text("CPF (somente numeros)") },
        keyboardOptions = KeyboardOptions(
            keyboardType = KeyboardType.Number,
            imeAction = ImeAction.Next
        ),
        keyboardActions = KeyboardActions(onNext = { onAvancar() })
    )
}

⚡ Nível 3: Integração

Problema 8.3 — Validação em Tempo Real com Mensagens de Erro (supportingText)

Contexto: Validação em Tempo Real com Mensagens de Erro (supportingText) no contexto de Interações, Gestos, Teclado Virtual e Validação de Inputs.

Requisitos de Execução:

  1. Validar e-mail exibindo borda vermelha e texto de suporte quando o formato for inválido.

Resultado Esperado

Feedback imediato de validação de formulário.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_8_3_SeuNome
  2. Envie na tarefa: Atividade Cap 8 - Interações, Gestos, Teclado Virtual e Validação de Inputs
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.ui

import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable

@Composable
fun CampoEmailValidado(email: String, onEmailChange: (String) -> Unit) {
    val ehValido = email.contains("@") && email.contains(".")
    val exibirErro = email.isNotEmpty() && !ehValido

    OutlinedTextField(
        value = email,
        onValueChange = onEmailChange,
        label = { Text("E-mail") },
        isError = exibirErro,
        supportingText = {
            if (exibirErro) Text("Formato de e-mail corporativo invalido")
        }
    )
}

🏆 Nível 4: Desafio Corporativo

Problema 8.4 — Formulário de Cadastro com Validação de Múltiplos Campos e Habilitação de Botão

Contexto: Formulário de Cadastro com Validação de Múltiplos Campos e Habilitação de Botão no contexto de Interações, Gestos, Teclado Virtual e Validação de Inputs.

Requisitos de Execução:

  1. Criar tela de cadastro que mantenha o botão ‘Cadastrar’ desabilitado até que todos os campos estejam válidos.

Resultado Esperado

Formulário corporativo blindado com regras de negócio integradas.

📤 Instruções de Entrega (Microsoft Teams)

  1. Salve o arquivo como: Atividade_8_4_SeuNome
  2. Envie na tarefa: Atividade Cap 8 - Interações, Gestos, Teclado Virtual e Validação de Inputs
🔑 Gabarito de Código & Solução Comentada 
package com.empresa.mobile.ui

import androidx.compose.foundation.layout.Column
import androidx.compose.material3.Button
import androidx.compose.material3.Text
import androidx.compose.runtime.*

@Composable
fun FormularioCompleto(onSubmit: () -> Unit) {
    var nome by remember { mutableStateOf("") }
    var email by remember { mutableStateOf("") }
    val formularioValido = nome.isNotBlank() && email.contains("@")

    Column {
        CampoTextoCustomizado(valor = nome, onValorChange = { nome = it }, label = "Nome Completo")
        CampoEmailValidado(email = email, onEmailChange = { email = it })
        Button(onClick = onSubmit, enabled = formularioValido) {
            Text("Concluir Cadastro")
        }
    }
}