Buscar pacotes, repositórios e categorias de apps

Capa de simple_sidebar
Detalhes do pacotev0.0.8

simple_sidebar

Um sidebar muito simples com ícones, textos, cabeçalho e suavização. Fácil de implementar e fácil de usar

AndroidiOSWebmacOSWindowsLinux
Downloads em 30 dias
20
Curtidas
5
Pontos Pub
150

Instalar pacote

flutter pub add simple_sidebar

Visão geral do pacote

Orientação gerada a partir de informações públicas. Apenas para referência.

Um componente de barra lateral leve e fácil de usar para aplicativos Flutter, com ícones, rótulos de texto, cabeçalhos e animações suaves. Projetado para integração rápida em apps que exigem navegação com configuração mínima. Ideal para painéis de controle, painéis administrativos ou qualquer interface que precise de uma barra lateral limpa e responsiva. O pacote oferece suporte a todas as principais plataformas, incluindo móvel, web e desktop, garantindo comportamento consistente entre dispositivos.

Casos de uso

  • Navegação do painel
  • Interfaces do painel de administração
  • Navegação de aplicativo móvel e desktop
  • Layouts de interface responsivos
  • Implementação rápida de barra lateral

Principais recursos

  • Animações suaves
  • Suporte de ícone e texto
  • Seção de cabeçalho
  • Configuração mínima
  • Compatibilidade multiplataforma

Indicado para

  • Desenvolvedores iniciantes do Flutter
  • Necessidades de navegação simples
  • Prototipagem rápida
  • Design de interface limpo
  • Aplicativos multiplataforma

Considerações

  • Opções limitadas de personalização
  • Sem modo escuro embutido
  • Não adequado para estruturas de navegação complexas
  • Requer estilização manual para designs avançados
  • Depende de repositório externo para atualizações

README original

Snapshot do README original do repositório-fonte vinculado. Consulte o repositório para o conteúdo mais recente.

Simple and quick to set up sidebar. Soft animations

Image from the Package

Features

Getting started

Just add the package to pubspec.yaml and start using it.

Usage

Create Theme & Controller and List of the Item you want to have in the Sidebar

final SimpleSidebarTheme theme = SimpleSidebarTheme()
    ..expandedShape = const BorderRadius.all(Radius.circular(8))
    ..collapsedShape = const BorderRadius.all(Radius.circular(8));
  final List<SimpleSidebarItem> sidebarItems = [
    SimpleSidebarItem(onTap: () {}, title: "Home", leading: Icons.home_outlined),
    SimpleSidebarItem(onTap: () {}, title: "Gallery", leading: Icons.image_outlined),
    SimpleSidebarItem(onTap: () {}, title: "Users", leading: Icons.group_outlined),
    SimpleSidebarItem(onTap: () {}, title: "Extra long name for a menu item", leading: Icons.list),
  ];
  final List<SimpleSidebarItem> footerItems = [
    SimpleSidebarItem(onTap: () {}, title: "Settings", leading: Icons.settings),
    SimpleSidebarItem(onTap: () {}, title: "Logout", leading: Icons.close),
  ];

After this create the Scaffold with the lists

Scaffold(
  backgroundColor: kcBackground,
  body: Row(
    children: [
      SimpleSidebar(
        theme: widget.theme,
        initialExpanded: true,
        initialIndex: 1,
        childrens: widget.sidebarItems,
        footerItems: widget.footerItems,
        onTap: (value) {
          setState(() {
            selected = value;
          });
          log("selected value $value");
        },
      ),
      Expanded(
        child: AnimatedOpacity(
          opacity: isVisible ? 1 : 0,
          duration: const Duration(milliseconds: 300),
          child: Container(
              margin: const EdgeInsets.all(8),
              child: const <Widget>[
                Text("hallo"),
                Text("hallo2"),
                Text("hallo3"),
                Text("hallo4"),
                Text("hallo5"),
                Text("hallo6"),
              ][selected]),
        ),
      ),
    ],
  ),
);

Additional information

Should there be any questions, wishes mail me: [Contact](mailto:support@glocknerstudios.at)

create an issue on GitHub for bugs. And now have fun with the sidebar

Categorias

Dependências

Lista de dependências 1 itens

Repositório-fonte

Projetos que usam este pacote

Ainda não há dados.