Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.3k views
in Technique[技术] by (71.8m points)

dart - Why Flutter Navigator 2.0 API not work with flutter_block?

I am trying to make navigation by serving pages via BLoC (flutter_bloc 6.1.1).

main.dart:

class MyApp extends StatelessWidget {

  List<MaterialPage> _pages = [
    MaterialPage( key: ValueKey('Page1'), child: Page1() ),
  ];

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),

      home: BlocProvider(
        create: (BuildContext context) => NavCubit(),

        // WHY PAGES NOT UPDATES HERE FROM BLoC?????
        child: BlocListener<NavCubit, NavState>(
          listener: (context, state) {
            _pages = state.pages;
          },
          child: Navigator(
            pages: _pages,
            onPopPage: (route, result) {
              if ( !route.didPop(result) ) {
                return false;
              }
              return true;
            },
          )
        )

      ),

    );
  }
}

The first page (Page 1) has a button, clicking on which should navigate to the second page (Page2)

class Page1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => NavCubit(),
      child: Scaffold(
        appBar: AppBar( title: Text('Page 1') ),

        body: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text("page 11111111111"),
                RaisedButton(
                  child: Text('Go to: Page 2', style: TextStyle(fontSize: 20)),
                  onPressed: () {
                    print("goto page2 btn");
                    context.read<NavCubit>().navigateTo();
                  },
                ),
              ],
            )
        ),

      ),
    );

  }
}

class NavCubit extends Cubit<NavState> {
  ...

  void navigateTo() {
    final navState = NavState([MaterialPage( key: ValueKey('Page2'), child: Page2() )]);
    debugPrint(navState.toString());

    emit(navState);
  }

}

But it doesn't happen!

As far as I can see, the BLoC State are updated good. But no screen changes...

SEE PLS:

Here my full test project: https://github.com/morfair/flutter_test_app/tree/master/lib


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

In Page1 you are creating another NavCubit in the BlocProvider. Therefore you have 2 NavCubits in total. So when you then call context.read<NavCubit>.navigateTo(), you are calling this method on the wrong NavCubit. Try to remove the creation of a second cubit in the BlocProvider in the Page1 build method.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...