搜索插件、代码仓与 APP 分类

插件详情v0.3.0

custom_navigator

一个 Flutter 包,可轻松在小部件树中的任何位置创建自己的导航器。

近 30 天下载
107
喜欢数
51
Pub 分数
40

安装插件

flutter pub add custom_navigator

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

一个 Flutter 包,可简化在 widget 树的任何部分创建自定义导航器的过程。它允许开发者独立于应用程序主导航器定义和管理导航逻辑,从而实现模块化和可重用的导航组件。适用于具有嵌套或动态导航流程的复杂 UI,有助于实现关注点分离并提高可测试性。该包轻量且设计灵活,无需深入集成到应用的核心结构中。

适合场景

  • 在大型应用中构建模块化导航
  • 在小部件中创建嵌套导航
  • 实现动态路由管理
  • 启用可重用的导航组件
  • 测试导航逻辑的独立性

主要特点

  • 轻松集成到小部件树中的任何位置
  • 支持自定义路由定义
  • 促进可重用的导航逻辑
  • 最小化样板
  • 独立于主导航器工作

适合对象

  • 开发复杂导航模式的开发者
  • 需要模块化UI架构的团队
  • 具有动态或嵌套导航的应用程序
  • 测试驱动开发工作流程
  • 需要内部导航的自定义 UI 组件

使用建议

  • 不打算作为 MaterialApp.router 的替代品
  • 在多个上下文中使用时需要仔细管理状态
  • 如果在简单应用中过度使用,可能会增加复杂性
  • 与内置导航器相比,平台特定功能有限

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

Custom navigator

A flutter package that makes it easy to create your own navigator anywhere in the widget tree.

A common use for such widget is when you need to implement an "Always presenting bottom navigation bar"

Getting Started

First you need to add the package to your pubspec.yaml file.

Custom scaffold

CustomScaffold is a stateful widget that uses the CustomNavigator to to handle item transition of [BottomNavigationBar] with nested navigation while keeping the [BottomNavigationBar] visible!

Usage
// Here's the custom scaffold widget
// It takes a normal scaffold with mandatory bottom navigation bar
// and children who are your pages
CustomScaffold(
      scaffold: Scaffold(
        bottomNavigationBar: BottomNavigationBar(
          items: _items,
        ),
      ),

      // Children are the pages that will be shown by every click
      // They should placed in order such as
      // `page 0` will be presented when `item 0` in the [BottomNavigationBar] clicked.
      children: <Widget>[
        Page('0'),
        Page('1'),
        Page('2'),
      ],

      // Called when one of the [items] is tapped.
      onItemTap: (index) {},
    );

See the custom_scaffold_example for more details


Custom navigator

The CustomNavigator is fairly easy to use

Usage

CustomNavigator(
        home: YourChildWidget(),
        //Specify your page route [PageRoutes.materialPageRoute] or [PageRoutes.cupertinoPageRoute]
        pageRoute: PageRoutes.materialPageRoute,
      );

Then you can call it using the same old Navigator.of(context)

Options
  • you can specify Named routes exactly like in MaterialApp.

if you want to use the default [Navigator] you need to specify a [GlobalKey] to your [MaterialApp] and use it navigatorKey.currentState

See the example for more details.

所属分类

源码仓库

使用此插件的项目