BottomNavigationBar 保存偏移位置并导航到细节颤动答案

【问题标题】：BottomNavigationBar saving offset position and navigating to details flutterBottomNavigationBar 保存偏移位置并导航到细节颤动
【发布时间】：2019-07-24 19:29:06
【问题描述】：

我是 Flutter 的新手。我在项目中使用范围模型（和自动身份验证），并且在 MaterialApp 类中使用路由

@override
    void initState() {

      _model.autoAuthenticate();
      _model.userSubject.listen((bool isAuthenticated){
        setState(() {
          _isAuthenticated = isAuthenticated;
        });
      });
      print('is auth $_isAuthenticated');
      super.initState();
    }

    @override
    Widget build(BuildContext context) {
      return ScopedModel<MainModel>(
        model: _model,
        child: MaterialApp(
          debugShowCheckedModeBanner: false,
          theme: getAdaptiveThemeData(context),
          routes: {
            '/': (BuildContext context) => !_isAuthenticated ? WelcomePage() : MainPage(_model),
            '/info': (BuildContext context) => InfoPage(),
            // another code

在我的“/”路线中，我使用 MainPage() 和 4 个 bottomNavigationBarItems 和 4 个带有代码的不同页面：

    int _currentTab = 0;
  final List<Widget> _children = [
    ScopedModelDescendant<MainModel>(
        builder: (BuildContext context, Widget child, MainModel model){
          return ProfilePage(model);
        },
    ),
    OnStockPage(),
    SendPage(),
    PppPage()
  ];

在构建小部件中：

@override
  Widget build(BuildContext context) {

    if(widget.model.isUserChanged){
      widget.model.getUserProfile().then((model){

      }).catchError((error){
        print('error is $error');
      });
    }

    print('build first');
    return StreamBuilder<UserModel>(
          stream: _bloc.user,
          builder: (BuildContext context, AsyncSnapshot<UserModel> snapshot){

              return Scaffold(
                appBar: AppBar(
                  title: ScopedModelDescendant<MainModel>(
                    builder: (BuildContext context, Widget child, MainModel model){
                      return ListTile(
                        title: model.isLoading ? Text('name surname', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)) : Text('${model.profile.firstName} ${model.profile.lastName}', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),),
                        subtitle: Text('Баланс \$0', style: TextStyle(color: Colors.white),),
                      );
                    },
                  ),
                  elevation: 0,
                ),
                drawer: DrawerSettings(),
                body:_children[_currentTab],

                bottomNavigationBar: BottomNavigationBar(
                  currentIndex: _currentTab,
                  items: [
                    BottomNavigationBarItem(
                        icon: Icon(Icons.person, color: Colors.black,),
                        title: Text('Профиль', style: TextStyle(color: Colors.black),)
                    ),
                    BottomNavigationBarItem(
                        icon: Icon(Icons.check_box_outline_blank, color: Colors.black),
                        title: Text('На складе', style: TextStyle(color: Colors.black),)
                    ),
                    BottomNavigationBarItem(
                        icon: Icon(Icons.drive_eta, color: Colors.black),
                        title: Text('Отправленные', style: TextStyle(color: Colors.black),)
                    ),
                    BottomNavigationBarItem(
                        icon: Icon(Icons.shopping_cart, color: Colors.black),
                        title: Text('ПпП', style: TextStyle(color: Colors.black))
                    ),
                  ],
                  onTap: _onTabTapped,
                ),
              );
           },
    );
  }

但是当我在第一个底部项目中时，我加载了所有数据并且一切都很好，但是当我进入第二个底部项目并返回时，所有数据都再次加载，没有保存等。我发现了一些代码Navigator 类和 Offstage 类与 bottomNavigationBar 但他们没有使用 MaterialApp -> 路线，但我使用，因此存在冲突.. 这是链接：https://medium.com/coding-with-flutter/flutter-case-study-multiple-navigators-with-bottomnavigationbar-90eb6caa6dbf 我希望应用程序已经知道这些页面，而不是经常调用它。请帮帮我

【问题讨论】：

总而言之，您想加载一次数据，无论当前选项卡是数据，都必须保持不变对吗？另外我不明白你在if(widget.model.isUserChanged) 中检查什么，你什么也没做，因为如果
in isUserChanged 我正在检查用户是否在配置文件设置中更改了他的数据，如果是，我正在重新加载数据..顺便说一句我找到了这个问题的解决方案..这将是在问题下

标签： routes flutter key bottomnavigationview navigator

【解决方案1】：

我在 Scaffold 类的主体中找到了我的问题的解决方案 ->

body:_body(),

和

Widget _body(){

    return Stack(
      children: List<Widget>.generate(_pageCount, (int index){
        return IgnorePointer(
          ignoring: index != _currentTab,
          child: Opacity(
            opacity: _currentTab == index ? 1 : 0,
            child: Navigator(
              onGenerateRoute: (RouteSettings settings){
                print('settings ${settings.name}');
                if(settings.name == '/'){
                  return MaterialPageRoute(
                      builder: (_) => _page(index),
                      settings: settings
                  );
                }
              },
            ),
          ),
        );
      })
    );
  }

  Widget _page(int index){

    switch (index){
      case 0:
        return ScopedModelDescendant<MainModel>(
          builder: (BuildContext context, Widget child, MainModel model){
            return /*(model.isLoading) ? Center(
            child: CircularProgressIndicator(),
          ) : */ProfilePage(model);
          },
        );
      case 1:
        return OnStockPage();
      case 2:
        return SendPage();
      case 3:
        return PppPage();
    }
    throw "Invalid index $index";
  }

【讨论】：