🔡Custom Tab Items

Visão Geral

O CustomTabItens é um widget personalizado que serve para fornecer uma interface de usuário tabulada (barra de abas) com customizações adicionais. Ele é feito de maneira a dar mais liberdade ao desenvolvedor ao estilizar as abas e seu conteúdo.

---

Como Usar

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

CustomTabItens(
    items: ['Tab 1', 'Tab 2', 'Tab 3'],
    onIndexChanged: (index) {
        print("Tab selecionada: $index");
    },
)

CustomTabItens(
                selectedTextColor: Colors.green,
                unselectedTextColor: Colors.amber,
                backgroundDecoration: BoxDecoration(
                  color: Colors.grey.withOpacity(0.2),
                  border: Border(
                    bottom: BorderSide(
                      width: 1,
                      color: Colors.black.withOpacity(0.1),
                    ),
                    top: const BorderSide(
                      width: 1,
                      color: Colors.white,
                    ),
                  ),
                ),
                items: const [
                  "Diário",
                  "Semanal",
                  "Mensal",
                  "Anual",
                  "Outro",
                ],
                onIndexChanged: (int idx) {
                  log('INDEX CHANGED $idx');
                },
              ),

Parâmetros

• items (obrigatório): Uma lista de strings que define os títulos das abas. Cada string representa uma aba individual.

• backgroundDecoration (opcional): Permite definir uma decoração para o plano de fundo do container principal das abas.

• selectedTextColor (opcional): A cor do texto da aba quando ela está selecionada.

• unselectedTextColor (opcional): A cor do texto da aba quando ela não está selecionada.

• textSize (opcional): Define o tamanho da fonte do texto da aba.

• indicatorWeight (opcional): Define a espessura da linha indicadora da aba selecionada.

• padding (opcional): Espaçamento interno ao redor da barra de abas.

• onIndexChanged (obrigatório): Uma função callback que é chamada quando o índice da aba selecionada muda. Ela retorna o índice da aba selecionada.

---

Detalhes Internos

Quando o CustomTabItens é inicializado, ele cria internamente um TabController que controla a seleção das abas.

A lista de abas é gerada usando o ListView.builder, e o widget TextTabItemComponent é usado para renderizar cada aba individual.

O TextTabItemComponent é outro widget personalizado que é usado para exibir o texto da aba e estilizá-lo com base se ele está selecionado ou não. Você pode personalizar a aparência do texto passando parâmetros como selectedTextColor, unselectedTextColor e textSize.

---

Considerações Adicionais

Ao usar o CustomTabItens, tenha em mente que ele foi projetado para ser flexível e personalizável. No entanto, certifique-se de fornecer todos os parâmetros obrigatórios para garantir que ele funcione corretamente.

Se você encontrar qualquer comportamento inesperado ou desejar recursos adicionais, pode ser necessário ajustar o código interno do widget ou considerar a adição de mais propriedades personalizadas.