Android Academy · Aula

Opções e ações do teclado

Tipos de teclado, ações do IME e foco.

Aula 4 de 413 etapas

Opções e ações do teclado é uma aula grátis de Android Academy no CoddyKit. Esta é a aula 4 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Android Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Android Academy inclui 4 aulas no total.

O teclado certo para cada tarefa

Um formulário bem elaborado exibe o teclado na tela correto: dígitos para um telefone, uma tecla @ para e-mail e um botão "Próximo" para avançar entre os campos. O Compose controla tudo isso com KeyboardOptions e KeyboardActions.

Nesta lição, você definirá tipos de teclado, ações do IME e gerenciará o foco entre os campos.

Escolhendo o tipo de teclado

Passe KeyboardOptions para um campo de texto e defina keyboardType. O sistema então exibirá um teclado adequado aos dados.

Valores comuns: Text, Number, Email, Phone, Password.

var email by remember { mutableStateOf("") }

OutlinedTextField(
    value = email,
    onValueChange = { email = it },
    label = { Text("Email") },
    keyboardOptions = KeyboardOptions(
        keyboardType = KeyboardType.Email
    )
)

Um teclado numérico

Para uma quantidade ou um PIN, use KeyboardType.Number. Combine-o com a filtragem da entrada para aceitar somente dígitos, como você aprendeu na lição sobre validação.

var pin by remember { mutableStateOf("") }

OutlinedTextField(
    value = pin,
    onValueChange = { pin = it.filter { c -> c.isDigit() } },
    label = { Text("PIN") },
    keyboardOptions = KeyboardOptions(
        keyboardType = KeyboardType.Number
    )
)

Ocultando uma senha

As senhas devem ser mascaradas. Use visualTransformation = PasswordVisualTransformation() junto com o tipo de teclado para senha.

O estado ainda mantém os caracteres reais; somente a exibição é mascarada.

var password by remember { mutableStateOf("") }

OutlinedTextField(
    value = password,
    onValueChange = { password = it },
    label = { Text("Password") },
    visualTransformation = PasswordVisualTransformation(),
    keyboardOptions = KeyboardOptions(
        keyboardType = KeyboardType.Password
    )
)

O botão de ação do IME

A tecla no canto inferior direito do teclado é a ação do IME. Defina-a com imeAction. Use Next para avançar ao próximo campo e Done no campo final.

OutlinedTextField(
    value = name,
    onValueChange = { name = it },
    label = { Text("Name") },
    keyboardOptions = KeyboardOptions(
        imeAction = ImeAction.Next
    )
)

Respondendo às ações do IME

Para reagir quando o usuário tocar nesse botão, passe KeyboardActions. Cada ação (onNext, onDone, onSearch) é uma lambda que você implementa.

Aqui, pressionar Done oculta o teclado.

val keyboard = LocalSoftwareKeyboardController.current

OutlinedTextField(
    value = text,
    onValueChange = { text = it },
    keyboardOptions = KeyboardOptions(imeAction = ImeAction.Done),
    keyboardActions = KeyboardActions(
        onDone = { keyboard?.hide() }
    )
)

Movendo o foco para o próximo campo

Em um formulário com vários campos, o botão Próximo deve ir diretamente para o campo seguinte. Use LocalFocusManager e chame moveFocus.

val focusManager = LocalFocusManager.current

OutlinedTextField(
    value = email,
    onValueChange = { email = it },
    keyboardOptions = KeyboardOptions(imeAction = ImeAction.Next),
    keyboardActions = KeyboardActions(
        onNext = { focusManager.moveFocus(FocusDirection.Down) }
    )
)

Limpando o foco ao concluir

No último campo, limpar o foco fecha o teclado e desmarca o campo. Chame focusManager.clearFocus() dentro de onDone.

OutlinedTextField(
    value = password,
    onValueChange = { password = it },
    keyboardOptions = KeyboardOptions(imeAction = ImeAction.Done),
    keyboardActions = KeyboardActions(
        onDone = { focusManager.clearFocus() }
    )
)

Solicitando foco programaticamente

Às vezes, você deseja que um campo receba foco assim que a tela aparecer, como uma caixa de pesquisa. Anexe um FocusRequester e solicite o foco em um LaunchedEffect.

val focusRequester = remember { FocusRequester() }

LaunchedEffect(Unit) { focusRequester.requestFocus() }

OutlinedTextField(
    value = query,
    onValueChange = { query = it },
    modifier = Modifier.focusRequester(focusRequester),
    label = { Text("Search") }
)

Uso de maiúsculas e correção automática

KeyboardOptions também controla capitalization e autoCorrectEnabled. Coloque cada palavra em maiúscula para um nome ou desative a correção automática para um nome de usuário, para que ele não seja alterado indevidamente.

OutlinedTextField(
    value = fullName,
    onValueChange = { fullName = it },
    label = { Text("Full name") },
    keyboardOptions = KeyboardOptions(
        capitalization = KeyboardCapitalization.Words,
        autoCorrectEnabled = false
    )
)

Kotlin puro: escolhendo uma ação do IME

A lógica de usar "Next em todos os campos, exceto no último, e Done no último" é Kotlin puro. Aqui, mapeamos as posições dos campos para o rótulo de ação que eles devem exibir.

fun imeActionFor(index: Int, lastIndex: Int): String =
    if (index == lastIndex) "Done" else "Next"

fun main() {
    val fields = listOf("name", "email", "password")
    fields.forEachIndexed { i, field ->
        println("$field -> ${imeActionFor(i, fields.lastIndex)}")
    }
}

Verificação rápida

Você quer que o botão no canto inferior direito do teclado mostre "Próximo" e, quando tocado, mova o foco para o campo abaixo. De quais duas partes você precisa?

Recapitulação

Agora você pode criar formulários que aproveitam os recursos do teclado:

  • KeyboardOptions define keyboardType, imeAction, o uso de maiúsculas e a correção automática.
  • Masque senhas com PasswordVisualTransformation.
  • KeyboardActions responde a Next, Done e Search.
  • LocalFocusManager move ou limpa o foco; FocusRequester coloca o foco em um campo quando necessário.

Isso conclui o conjunto de ferramentas para criar formulários: entrada, estado, validação e teclado. Você está pronto para criar formulários do Compose bem elaborados e agradáveis de usar.

Grátis para começar

Aprenda Kotlin com um tutor de IA — grátis

Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.

Cursos
36
Aulas
152

Perguntas Frequentes

A aula “Opções e ações do teclado” é grátis?

Sim — o texto completo de “Opções e ações do teclado” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Android Academy, atualize para CoddyKit PRO. O curso de Android Academy inclui 4 aulas no total.

O que vou aprender em “Opções e ações do teclado”?

Tipos de teclado, ações do IME e foco. Você pratica Android Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar Android Academy?

Nenhuma experiência prévia é necessária. Android Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 4 de 4.

Quanto tempo leva a aula “Opções e ações do teclado”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de Android Academy?

Sim. Cada aula de Android Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. TextField e entrada do usuário
  2. Gerenciando o estado de formulários
  3. Validando a entrada
  4. Opções e ações do teclado
← Voltar para Android Academy