how to move pages using page controller ?

menu here

      @override
      Widget build(BuildContext context) {
        final PageController pageController = PageController(
          initialPage: 0,
          keepPage: true,
        );
        // final PageController pageController = PageController();
        return Scaffold(
          body: SafeArea(
            child: PageView(
              controller: pageController,
              children: [


                const Center(
                  child: Text("Shop"),
                ),
                const Center(
                  child: Text("Shop1"),
                ),
                const Center(
                  child: Text("Shop2"),
                ),
                const Center(
                  child: Text("Shop3"),
                ),
                const Center(
                  child: Text("Shop4"),
                ),
              ],
            ),
          ),
          bottomNavigationBar: const _Menu(),
        );
      }
    }

class _Menu extends StatelessWidget {
  const _Menu({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final PageController pageController = PageController(
      initialPage: 0,
      keepPage: true,
    );

    return BlocListener<MenuBloc, MenuState>(
      listener: (context, state) {
        if (state is MenuSelected) {
          pageController.jumpToPage(state.index);
        }
      },
      child: BlocBuilder<MenuBloc, MenuState>(
        builder: (context, state) {
          return Column(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              Container(
                decoration: BoxDecoration(
                  boxShadow: [
                    BoxShadow(
                      color: const Color(0XFFBFC4C7).withOpacity(0.5),
                      offset: const Offset(5, 8),
                      blurRadius: 15,
                      spreadRadius: 5,
                    ),
                  ],
                  color: Colors.white,
                ),
                padding: const EdgeInsets.only(
                  top: 20,
                  bottom: 40,
                  right: 10,
                  left: 10,
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                  children: [
                    MenuItems(
                      onTap: () {
                        context.read<MenuBloc>().add(MenuSwitch(0));
                      },
                      label: "Shop",
                      icon: Icon(
                        Icons.explore,
                        size: 24,
                        color: state.index == 0
                            ? const Color(0XFF851252)
                            : const Color(0XFFD4D6DD),
                      ),
                    ),
                    MenuItems(
                      onTap: () {
                        context.read<MenuBloc>().add(MenuSwitch(1));
                      },
                      label: "Shop1",
                      icon: Icon(
                        Icons.apps,
                        size: 24,
                        color: state.index == 1
                            ? const Color(0XFF851252)
                            : const Color(0XFFD4D6DD),
                      ),
                    ),
                    MenuItems(
                      onTap: () {
                        context.read<MenuBloc>().add(MenuSwitch(2));
                      },
                      label: "Shop2",
                      icon: Icon(
                        Icons.signal_cellular_alt,
                        size: 24,
                        color: state.index == 2
                            ? const Color(0XFF851252)
                            : const Color(0XFFD4D6DD),
                      ),
                    ),
                    MenuItems(
                      onTap: () {
                        context.read<MenuBloc>().add(MenuSwitch(3));
                      },
                      label: "Shop3",
                      icon: Icon(
                        Icons.store,
                        size: 24,
                        color: state.index == 3
                            ? const Color(0XFF851252)
                            : const Color(0XFFD4D6DD),
                      ),
                    ),
                    MenuItems(
                      onTap: () {
                        context.read<MenuBloc>().add(MenuSwitch(4));
                      },
                      label: "Shop4",
                      icon: Icon(
                        Icons.account_balance_wallet,
                        size: 24,
                        color: state.index == 4
                            ? const Color(0XFF851252)
                            : const Color(0XFFD4D6DD),
                      ),
                    ),
                  ],
                ),
              )
            ],
          );
        },
      ),
    );
  }
}

how can i switch pages using page controller and bloc-bloc i have?

CodePudding user response：

I think you have to define state each state for each of the page and emit same in the block only then the block listener will listen to change of the state.

CodePudding user response：

Yes I will have to look into the code .. you can share your GitHub then will solve and let you know . Thank you