📻Custom Radio Selector

Documentação do RadioSelector

Visão Geral

O RadioSelector é um widget personalizado que fornece uma interface de seleção de opções, semelhante a um botão de opção (radio button), mas com funcionalidades estendidas e aparência personalizada. Ele permite aos usuários selecionar uma opção entre várias, com feedback visual claro da seleção atual.

Como Usar

Para usar o RadioSelector, você deve inicializá-lo no seu código e passar os parâmetros necessários. Aqui está um exemplo básico:

dartCopy codeRadioSelector(
  onTap: () {
    // Handle on tap
  },
  text: 'Opção 1',
  selected: true,
)

Parâmetros

  • onTap (obrigatório): A função chamada quando o RadioSelector é tocado.

  • text (obrigatório): O texto principal exibido no RadioSelector.

  • selected (opcional): Um booleano que determina se o RadioSelector está selecionado ou não. O padrão é false.

  • selectedCheckColor (opcional): A cor do ícone de seleção quando o RadioSelector está selecionado.

  • trailingText (opcional): Texto adicional exibido no final do RadioSelector.

  • leading (opcional): Um widget opcional exibido no início do RadioSelector.

  • showShadow (opcional): Um booleano que determina se o RadioSelector deve exibir uma sombra. O padrão é true.

  • radius (opcional): O raio da borda do RadioSelector. O padrão é 24.

  • padding (opcional): O espaçamento interno ao redor do RadioSelector. O padrão é 24.

  • showSelectedGradient (opcional): Um booleano que determina se um gradiente deve ser exibido quando o RadioSelector está selecionado. O padrão é true.

  • height (opcional): A altura do RadioSelector. O padrão é 75.

  • textStyle (opcional): O estilo do texto principal.

  • trailingTextStyle (opcional): O estilo do texto adicional.

  • backgroundColor (opcional): A cor de fundo do RadioSelector.

Funcionamento Interno

Quando o RadioSelector é tocado, ele chama a função fornecida ao parâmetro onTap. O estado de seleção pode ser controlado pelo parâmetro selected, que muda a aparência do RadioSelector para indicar se está selecionado ou não.

O RadioSelector é construído dentro de um Container, que é estilizado com base nos parâmetros fornecidos. O texto principal e o texto adicional são exibidos em uma linha, com um ícone de seleção no final que muda de aparência com base no estado de seleção.

Considerações Adicionais

O RadioSelector é projetado para ser flexível e fácil de usar, permitindo uma ampla gama de personalizações para garantir que os desenvolvedores possam adaptá-lo às suas necessidades específicas. A interface clara e o feedback visual garantem uma boa experiência do usuário, facilitando a seleção de opções em uma interface de usuário.

Last updated