代码之家  ›  专栏  ›  技术社区  ›  Rutger Huijsmans

在颤振中无法在PageController上跳转

  •  1
  • Rutger Huijsmans  · 技术社区  · 4 年前

    我已经建立了一个脚手架屏幕,在身体和底部导航栏的页面视图。

    我还为这个页面构建了一个Cubit+状态管理器。

    当屏幕第一次打开时,我希望触发一个API调用。我还希望选项卡1被选中(在页面视图和底部导航栏上)。

    这对bottomNavigationBar很有效,但我在更新页面视图时遇到了问题。这是我的密码:

    class HomeScreen extends StatefulWidget {
      @override
      _HomeScreenState createState() => _HomeScreenState();
    }
    
    class _HomeScreenState extends State<HomeScreen> {
      int _page = 1;
      PageController _c;
      double iconSize = 32;
      bool forceCourseEnrolment = true;
    
      @override
      void initState() {
        _c = new PageController(
          initialPage: 1,
          keepPage: false,
        );
        super.initState();
      }
    
      @override
      Widget build(BuildContext context) {
        return BlocConsumer<HomeScreenCubit, HomeScreenState>(
            listener: (context, state) {
          debugPrint("listener received something");
          if (state is DataRetrieved) {
            state.enrolledCourses.length > 0
                ? forceCourseEnrolment = false
                : forceCourseEnrolment = true;
            state.enrolledCourses.length > 0 ? _page = 0 : _page = 1;
            var hasClients = this._c.hasClients;
            debugPrint("this._c.hasClients $hasClients");
            // This prints: this._c.hasClients false
            // Enabling this line:
            // this._c.jumpToPage(_page);
            // leads to:
            // [ERROR:flutter/lib/ui/ui_dart_state.cc(177)] Unhandled Exception: 'package:flutter/src/widgets/scroll_controller.dart': Failed assertion: line 112 pos 12: '_positions.isNotEmpty': ScrollController not attached to any scroll views.
          } 
        }, builder: (context, state) {
          if (state is HomeScreenInitial) {
            context.bloc<HomeScreenCubit>().retrieveData();
            return Scaffold(
                body: SpinKitChasingDots(
              color: COLOR_main_purple,
              size: 50.0,
            ));
          }
          return Scaffold(
              body: PageView(
                controller: _c,
                onPageChanged: (newPage) {
                  setState(() {
                    this._page = newPage;
                  });
                },
                physics: NeverScrollableScrollPhysics(),
                children: [
                  PurchasedCoursesTab(),
                  ElearningTab(),
                  MyPracticeTab(),
                  ProfileTab(),
                ],
              ),
              bottomNavigationBar: SizedBox(
                height: 80,
                child: Container(
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.only(
                          topRight: Radius.circular(30),
                          topLeft: Radius.circular(30)),
                      boxShadow: [
                        BoxShadow(
                            color: Colors.black38.withOpacity(0.1),
                            spreadRadius: 0,
                            blurRadius: 25),
                      ],
                    ),
                    child: ClipRRect(
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(30.0),
                        topRight: Radius.circular(30.0),
                      ),
                      child: BottomNavigationBar(
                        currentIndex: _page,
                        onTap: (index) {
                          if (forceCourseEnrolment == false) {
                            this._c.animateToPage(index,
                                duration: const Duration(milliseconds: 250),
                                curve: Curves.easeInOut);
                          }
                        },
                        type: BottomNavigationBarType.fixed,
                        backgroundColor: Colors.white,
                        items: <BottomNavigationBarItem>[
                          BottomNavigationBarItem(
                              // title: Text(""),
                              title: showIndicator(_page == 0),
                              icon: Container(
                                width: iconSize,
                                height: iconSize,
                                child: SvgPicture.asset('assets/images/ic_run.svg',
                                    color: _page == 0
                                        ? COLOR_main_purple
                                        : forceCourseEnrolment == false
                                            ? Colors.black
                                            : COLOR_main_text_grey_with_opacity),
                              )),
                          BottomNavigationBarItem(
                              title: showIndicator(_page == 1),
                              icon: Container(
                                width: iconSize,
                                height: iconSize,
                                child: SvgPicture.asset(
                                    'assets/images/ic_e_learning.svg',
                                    color: _page == 1
                                        ? COLOR_main_purple
                                        : Colors.black),
                              )),
                          BottomNavigationBarItem(
                              title: showIndicator(_page == 2),
                              icon: Container(
                                width: iconSize,
                                height: iconSize,
                                child: SvgPicture.asset(
                                    'assets/images/ic_journal.svg',
                                    color: _page == 2
                                        ? COLOR_main_purple
                                        : forceCourseEnrolment == false
                                            ? Colors.black
                                            : COLOR_main_text_grey_with_opacity),
                              )),
                          BottomNavigationBarItem(
                              title: showIndicator(_page == 3),
                              // title: Text(_page == 3 ? "•" : "", style: TextStyle(
                              //     color: COLOR_main_purple, fontSize: 24.0)),
                              icon: Container(
                                width: iconSize,
                                height: iconSize,
                                child: SvgPicture.asset(
                                    'assets/images/ic_gamification.svg',
                                    color: _page == 3
                                        ? COLOR_main_purple
                                        : forceCourseEnrolment == false
                                            ? Colors.black
                                            : COLOR_main_text_grey_with_opacity),
                              )),
                        ],
                      ),
                    )),
              ));
        });
      }
    }
    

    [错误:flatter/lib/ui/ui\u dart\u state.cc(177)]未处理的异常: '软件包:flatter/src/widgets/scroll\u controller.dart':失败 不附加到任何滚动视图。

    0 回复  |  直到 4 年前
        1
  •  0
  •   Rutger Huijsmans    4 年前

    我发现我可以通过在侦听器中添加以下内容来实现它:

      if (state is DataRetrieved) {
        state.enrolledCourses.length > 0
            ? forceCourseEnrolment = false
            : forceCourseEnrolment = true;
        state.enrolledCourses.length > 0 ? _page = 0 : _page = 1;
        Future.delayed(Duration(milliseconds: 50), () {
          if (this._c.hasClients) {
            this._c.jumpToPage(_page);
          }
        });
      } 
    

    我发现这是一个丑陋的解决方案,所以我不会把它作为答案。如果你知道更好的方法,请告诉我。

    推荐文章