标签: flutter-navigation

我正在构建一个简单的 Flutter 应用程序。它的启动屏幕确定用户是否登录，然后根据它重定向到登录或主/主屏幕。

我的启动屏幕是一个StatefulWidget，其状态如下所示。它使用了一个扩展的 ViewModel 类ChangeNotifier（它的代码无关紧要，所以我没有包含它）。

class _LaunchPageState extends State<LaunchPage> {
          LaunchViewModel _viewModel = LaunchViewModel();

          @override
          void initState() {
            super.initState();
            _viewModel.checkSessionStatus();
          }

          @override
          Widget build(BuildContext context) {
            return ChangeNotifierProvider<LaunchViewModel>(
              builder: (_) => _viewModel,
              child: Scaffold(
                body: Consumer<LaunchViewModel>(
                  builder: (context, viewModel, _) {
                    if (viewModel.state is LaunchInitial) {
                      return CircularProgressIndicator();
                    }
                    if (viewModel.state is LaunchLoginPage) {
                      Navigator.pushNamed(context, "login");
                    }
                    if (viewModel.state is LaunchMainPage) {
                      Navigator.pushNamed(context, "main");
                    }
                    return Container();
                  },
                ),
              ),
            );
          }
        }

ViewModel 发出 …

假设以下场景：第 1 页Navigator.push到第 2 页。page2 上的用户单击后退按钮，因此 page2 弹出并且 page1 重新获得视图。如何在 page1 上捕获此事件？

是否可以使用 Flutter 复制 iOS App Store 的过渡效果？

我尝试通过在两个小部件的根布局中放置两个标签来使用 Hero Animation，但动画看起来很笨拙或不是我所期望的。但好处是我可以在使用 MaterialPageRoute 时向后滑动 iOS。

来源

Hero(
   tag: 'heroTag_destinationScreen',
   transitionOnUserGestures: true,
   flightShuttleBuilder: (BuildContext flightContext,
     Animation<double> animation,
     HeroFlightDirection flightDirection,
     BuildContext fromHeroContext,
     BuildContext toHeroContext,) {
        final Hero toHero = toHeroContext.widget;
            return ScaleTransition(
              scale: animation,
              child: toHero,
            );
          },
          child: GestureDetector(
            onTap: () {
              Navigator.of(context).push(
                MaterialPageRoute<void>(
                  builder: (BuildContext context) {
                    return DestinationScreen()
                  },
                ),
              );
            },
            child: Card(
                ...someCardContent
            ),
      ),
)

目的地画面

@override
Widget build(BuildContext context) {
    return Hero(
       tag: 'heroTag_destinationScreen',
       child: Scaffold(
           appBar: …

我正在使用全局键来处理我的导航。main.dart、routes 和 NavigationService 如下。使用全局键的主要目的是使导航独立于上下文，以便网络模块可以在刷新令牌过期时通过 dio 拦截器自动注销用户。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
          return MaterialApp(
          title: 'AZY APP',
          navigatorKey: locator<NavigationService>().navigatorKey,
          onGenerateRoute: router.generateRoute,
          home: HomePageScreen())
          
}}

导航服务.dart

class NavigationService {
  final GlobalKey<NavigatorState> navigatorKey =
      new GlobalKey<NavigatorState>();

  Future<dynamic> navigateTo(String routeName, {dynamic arguments}) {
    return navigatorKey.currentState.pushNamed(routeName, arguments: arguments);
  }

  pop(value) {
    print("pop");
    return navigatorKey.currentState.pop(value);
  }

  goBack() {
    print("goback");
    return navigatorKey.currentState.pop();
  }

  popUntil(String desiredRoute) {
    return navigatorKey.currentState.popUntil((route) {
      print("${route.settings.name}");
      return route.settings.name == desiredRoute;
    });
  }

  pushReplacementNamed(String route) {
    print("pushReplacementNamed");
    return navigatorKey.currentState.pushReplacementNamed(route); …

问题：

当按下登录按钮时，会显示一个进度指示器。但是，完成后，键盘会自动弹出，即使它没有提前显示。

我的想法：

我认为，因为最后一个焦点是在 上TextField，所以当前的焦点会在该过程之后切换回它。

我的代码在做什么：

按下登录按钮时，它会触发showDialog方法。之后，它等待 ( await) 进程完成。之后，Navigator.pop(context)被调用所以Dialog可以被销毁。

这就是键盘再次出现的时候。

视觉：

在我的flutter应用程序中，当我尝试热重载或热重启时，过程完成后，重新加载的屏幕显示一秒钟，然后变成全白

仅显示右上角的调试横幅

控制台中没有错误。它只是说重新启动应用程序...

我需要停止并重新运行应用程序！

为什么 ？

我正在使用自动路线和 River pod、fast_i18n 进行本地化

我什至不知道问题出在哪里以及如何解释？

分享要点中的一些代码

https://gist.github.com/RageshAntony/2288a47a8fdc24af1e570a0c7cb9ed08

其他项目运行没有问题

我在 flutter 上使用 go_router，并且有一个根路由和一个 shell 路由，其中​​所有子路由上都包含一个底部导航栏。我想推送一个位于 shell 路由之外的页面，并且我希望将其推送到根导航器上，因为它必须位于底部导航栏上方。

我已经检查了无数的 go_router 文档，但没有选项可以做到这一点。

我已经实现了一种方法来删除所有路由并在根导航器上推送页面，但是当弹出该页面时，它会转到一个空页面。但我希望它转到 shell 路由上的页面时所在的位置。

我对 flutter blocs 非常陌生，并且在 bloc 实现方面遇到了一些问题，我正在尝试在启动屏幕小部件中的状态更改后进行导航。

状态更新到InitSuccess后，它应该导航到LoginScreen，但此导航会发生很多次。

我无法理解状态更改为InitSuccess后要做什么，此后块保持活动状态并调用许多次LoginScreen。

启动画面

class SplashScreen extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {
  SplashBloc _splashBloc;
  final _scaffoldKey = GlobalKey<ScaffoldState>();

  @override
  void initState() {
    _init();
    super.initState();
  }

  @override
  void dispose() {
    _splashBloc.dispose();
    super.dispose();
  }

  void _init() {
    Future.delayed(Duration.zero, () {
      checkDeviceConnection(context);
      BlocSupervisor().delegate = SplashBlocDelegate();
      final bool isIOS = Theme.of(context).platform == TargetPlatform.iOS;
      _splashBloc = SplashBloc(
        firebaseService: FirebaseService(context),
        authService: AuthService(context),
        devicesService: DevicesService(context),
      ); …

我尝试将Hero小部件与ChangeNotifierProvider新的导航 2.0 系统一起使用。但我在那里面临着问题。相同的代码在不使用时有效。changeNotifier

我面临的问题是，弹出第二页 W2 后，第一页中的文本（即英雄的孩子）消失了。

下面是完整的代码。runApp(HeroTestApp2())正常工作。但我很想让第一种方法发挥作用。请帮忙。

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

main(List<String> args) {
  runApp(HeroTestApp());
}

class MyModel extends ChangeNotifier {
  bool _go = false;
  bool get go => _go;
  set go(bool go) {
    _go = go;
    notifyListeners();
  }
}

class HeroTestApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<MyModel>(
      create: (context) => MyModel(),
      builder: (context, _) {
        final state = context.watch<MyModel>();
        return MaterialApp(
          home: Navigator(
            pages: [
              MaterialPage(child: W1(onTapped: …