我们的应用程序是建立在Scaffold之上的,到目前为止,我们已经能够通过NavigatorState(pushNamed()pushReplacementNamed()等)内提供的呼叫满足我们的大部分路由和导航要求.不过,我们不希望在用户从抽屉(nav)菜单中 Select 一个项目时出现任何类型的"推送"动画.我们希望导航菜单中的目的地屏幕能够有效地成为堆栈的新初始路径.目前,我们正在使用pushreplacementname()来确保应用程序栏中没有返回箭头.但是,从右侧动画滑入意味着堆栈正在生成.

我们在没有动画的情况下改变初始路由的最佳 Select 是什么?我们能不能在将抽屉关闭的同时进行动画制作?或者我们现在看到的情况是,当用户想要更改屏幕时,我们需要从Navigator转移到只使用单个Scaffold并直接更新"Body"?

我们注意到NavigatorState有一个replace()呼叫,我们认为这可能是开始寻找的正确地点,但不清楚如何访问最初在new MaterialApp()设置的各种路由.replaceNamed()之类的东西可能是合适的;-)

推荐答案

你所做的听起来有点像BottomNavigationBar,所以你可能想考虑其中之一,而不是Drawer.

然而,拥有单个Scaffold并在用户轻敲抽屉物品时更新body是完全合理的方法.你可以考虑用FadeTransition从一个车身换到另一个车身.

或者,如果您喜欢使用Navigator,但不想要默认的幻灯片动画,可以通过扩展MaterialPageRoute来自定义(或禁用)动画.下面是一个例子:

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyCustomRoute<T> extends MaterialPageRoute<T> {
  MyCustomRoute({ WidgetBuilder builder, RouteSettings settings })
      : super(builder: builder, settings: settings);

  @override
  Widget buildTransitions(BuildContext context,
      Animation<double> animation,
      Animation<double> secondaryAnimation,
      Widget child) {
    if (settings.isInitialRoute)
      return child;
    // Fades between routes. (If you don't want any animation, 
    // just return child.)
    return new FadeTransition(opacity: animation, child: child);
  }
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Navigation example',
      onGenerateRoute: (RouteSettings settings) {
        switch (settings.name) {
          case '/': return new MyCustomRoute(
            builder: (_) => new MyHomePage(),
            settings: settings,
          );
          case '/somewhere': return new MyCustomRoute(
            builder: (_) => new Somewhere(),
            settings: settings,
          );
        }
        assert(false);
      }
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Navigation example'),
      ),
      drawer: new Drawer(
        child: new ListView(
          children: <Widget> [
            new DrawerHeader(
              child: new Container(
                  child: const Text('This is a header'),
              ),
            ),
            new ListTile(
              leading: const Icon(Icons.navigate_next),
              title: const Text('Navigate somewhere'),
              onTap: () {
                Navigator.pushNamed(context, '/somewhere');
              },
            ),
          ],
        ),
      ),
      body: new Center(
        child: new Text(
          'This is a home page.',
        ),
      ),
    );
  }
}

class Somewhere extends StatelessWidget {
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new Center(
        child: new Text(
          'Congrats, you did it.',
        ),
      ),
      appBar: new AppBar(
        title: new Text('Somewhere'),
      ),
      drawer: new Drawer(
        child: new ListView(
          children: <Widget>[
            new DrawerHeader(
              child: new Container(
                child: const Text('This is a header'),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Flutter相关问答推荐

我遇到了一个问题,从showDialogue()调用Navigator.pop()两次导致屏幕空白

来自另一个屏幕的数据

使用Flutter 提供程序包加载状态应用程序时,在自定义按钮中显示CircularProgressIndicator

来自FutureProvider的数据只打印两个不同的变量,它们对一个实例只有一次相同的值,为什么?

我的flutter代码显示一个小部件被认为是死代码,为什么?

有没有什么方法可以加快在Flutter 中加载Quill HTML编辑器的速度?

为什么PUT方法没有发出任何响应?

如何使文本表格域在抖动中变圆?

轻松本地化包翻译在底部导航栏项目标签Flutter 翼dart 中不起作用

如何在flutter中将所有单词的第一个字母大写

Dart/Flutter 泛型:类型 '(SearchFilterItemModel) => String' 不是类型 '(SearchFilterItemModel) => String' 的子类型

Flutter如何在容器外创建环形进度条

FutureProvider 不返回数据给 UI

更改 flutter listview 中的布局

如何删除或隐藏覆盖

通过一个具体的例子理解Flutter约束的本质

如何从底部导航栏打开 bottomModal 表?

当项目较少时收缩列表视图

为什么 Flutter riverpod 直接分配不起作用但方法可以

Flutter:如何判断嵌套列表是否包含值