KasyKasy

Text Field OTP

Viewer ao vivo e documentação do componente Text Field OTP.

Sobre

Campo de código de verificação (OTP), com células visuais separadas por dígito. Usa um único TextField invisível por trás das células pra evitar flicker de teclado ao avançar entre dígitos.

  • length: quantidade de dígitos (padrão 6)
  • separatorAfterIndex: insere um separador (traço) após esse índice, ex. 2 agrupa como [0][1][2] — [3][4][5]
  • separatorStrokeVisible: true (padrão) mostra o traço; false mantém só o espaçamento
  • onChanged / onCompleted: chamado a cada mudança / quando todos os dígitos são preenchidos
  • hasError: pinta borda de erro nas células
  • enabled: false desabilita e esmaece as células
  • placeholder: texto fantasma mostrado em células vazias
  • neutralFlatCells: fundo neutro suave sem sombra (uso em placeholder/sheet)
  • suppressCellShadow / suppressFocusBorder: removem sombra da célula / anel de foco, mantendo o resto
  • cellFillColor: sobrescreve a cor de preenchimento (ignorado se neutralFlatCells)
  • keyboardType / inputFormatters / textCapitalization: customização do teclado (padrão: só dígitos)
  • semanticLabel: nome acessível do campo escondido

Preview

Carregando o componente…

Atualizado em 03/11/2026

Nesta página