Buscar categorias, pacotes e repositórios

Detalhes do pacotev0.0.2

scrollable_reorderable_navbar

Uma barra de navegação inferior que pode ser rolada quando há mais de 5 itens de navegação para exibir. Também permite que o usuário deslize os itens para reordenar e que os itens sejam excluídos da barra de navegação.

AndroidiOSWebmacOSWindowsLinux
Downloads em 30 dias
15
Curtidas
30
Pontos Pub
140

Instalar pacote

flutter pub add scrollable_reorderable_navbar

Visão geral do pacote

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

Uma barra de navegação inferior rolável e reordenável para o Flutter que se ajusta dinamicamente quando há mais de cinco itens. Os usuários podem deslizar para reorganizar itens e excluí-los diretamente da barra. Projetada para navegação intuitiva em aplicativos com muitos tabs, melhora a usabilidade em plataformas móveis e desktop. O pacote suporta todas as principais plataformas, incluindo Android, iOS, Web, macOS, Windows e Linux. Combina rolagem suave com reordenação e exclusão baseadas em gestos, oferecendo uma interface flexível para gerenciar itens de navegação.

Casos de uso

  • Aplicativos com mais de 5 itens de navegação
  • Layouts de navegação inferior personalizáveis
  • Reordenamento de guias orientado pelo usuário
  • Gerenciamento de itens de navegação dinâmicos
  • Aplicativos multiplataforma para desktop e móvel

Principais recursos

  • Rolável quando exceder 5 itens
  • Funcionalidade de reordenar com deslize
  • Exclusão de itens de navegação
  • Suporte multiplataforma (Android, iOS, Web, macOS, Windows, Linux)
  • Interações suaves baseadas em gestos

Indicado para

  • Desenvolvedores que precisam de barras de navegação inferiores flexíveis
  • Aplicativos que exigem personalização dinâmica de navegação
  • Projetos direcionados para múltiplas plataformas
  • UIs with frequent user interaction on navigation
  • Designers procurando componentes de navegação interativa

Considerações

  • Pode exigir gerenciamento adicional de estado
  • Não ideal para configurações de navegação estática
  • Impacto no desempenho com listas de itens muito grandes
  • Limitado ao layout de navegação inferior
  • Requer manipulação cuidadosa da UX de exclusão de item

README original

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

ScrollableReordableNavbar for Flutter

A flutter plugin for create bottom nav bar that can be scrolled when there are than 5 nav items to display. It also let user swipe items position and item can be deleted from the navbar.

Installing:

In your pubspec.yaml

dependencies:
  scrollable_reorderable_navbar: ^0.0.1
import 'package:scrollable_reorderable_navbar/scrollable_reorderable_navbar.dart';


Basic Usage:

    ScrollableReorderableNavBar(
      onItemTap: (arg) {
        setState(() {
          _selectedIndex = arg;
        });
      },
      onReorder: (oldIndex, newIndex) {
        final currItem = _items[_selectedIndex];
        if (oldIndex < newIndex) newIndex -= 1;
          final newItems = [..._items], item = newItems.removeAt(oldIndex);
          newItems.insert(newIndex, item);
        setState(() {
          _items = newItems;
          _selectedIndex = _items.indexOf(currItem);
        });
      },
    items: _items,
    selectedIndex: _selectedIndex,
    onDelete: (index) => setState(() => _items.removeAt(index)),
    deleteIndicationWidget: Container(
      padding: const EdgeInsets.only(bottom: 100),
      child: Align(
        alignment: Alignment.bottomCenter,
        child: Wrap(
          alignment: WrapAlignment.center,
          crossAxisAlignment: WrapCrossAlignment.center,
          direction: Axis.vertical,
          children: [
            Text("Tap on nav item to delete it.",
              style: Theme.of(context).textTheme.bodyText1,
              textAlign: TextAlign.center),
            TextButton(onPressed: () {}, child: const Text("DONE"))
          ],
        ),
      ),
    ),
  )


Custom usage

There are options that let you custom the navbar:\

Properties Description
List<NavBarItem> items Items composing the navbar, every items should have different names
int selectedIndex The index of the selected NavBarItem
ValueChanged<int> onItemTap Which behaviour should have after the user tap on a NavBarItem
ReorderCallback onReorder Which behaviour should have after user swap 2 NavBarItem
Widget deleteIndicationWidget The Widget displayed on top of the delete overlay to show user that he can tap on NavBarItem to delete them
ValueChanged<int> onDelete Which behaviour should have after user delete a NavBarItem
ReorderItemProxyDecorator? proxyDecorator How the widget should look like on a reorder operation
Color backgroundColor Background color of the navbar
Duration duration Duration of the animations
BoxDecoration? decoration Decoration of the entire navbar. You should use either backgroundColor or this one

Additional information

Don't hesitate to suggest any features or fix that will improve the package!

Categorias

Repositório-fonte

Projetos que usam este pacote

Ainda não há dados.