Flutter using PageController to change PageView from another class

Question

Help I'm a flutter newbie and I've built a file that has OnTap TapGestureRecognizer functions, which I'm trying to manage the pageView within a second page. I've tried a few different options and but I can't work out how to get pageController to change the page view on the second page.

Root Class

class RootApp extends StatefulWidget {
  @override
  RootAppState createState() => RootAppState();
}

class RootAppState extends State<RootApp> {
  bool isFavorite = false;
  int pageIndex = 0;

  PageController _pgController = PageController();

  void pgCont(pg){
     _pgController.animateToPage(pg, duration: Duration(milliseconds: 250), curve: Curves.bounceInOut);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageView(controller: _pgController,
        children: <Widget>[
        getBody1() ,
        getBody2(),
      ]),
      bottomNavigationBar: getFooter(),
    );
  }

Header Home Class

class HeaderHomePage extends StatelessWidget {
   HeaderHomePage({
    Key ?key
  }) : super(key: key);

   RootAppState rooting = RootAppState();
 }

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        Text.rich(
          TextSpan(
            text: "Body1",
          recognizer: TapGestureRecognizer()
        ..onTap = (){
              print('He Clicked Body1');
              rooting.pgCont(1);
        },
   SizedBox(
      width: 8,
    ),
    Text.rich(
      TextSpan(
      text: "Body2",
      recognizer: TapGestureRecognizer()
          ..onTap = (){
        print('She clicked Body2');
        rooting.pgCont(2);
          },),
      style: TextStyle(
          color: white, fontSize: 17, fontWeight: FontWeight.w500),
    )
  ],
);

Please help I'm stuck on something that seems so simple what I'm I missing or doing wrong here?

Answer 1

In RootAppState class

  void pgCont(pg){
    if(_pgController.hasClients) {
     _pgController.animateToPage(pg, duration: Duration(milliseconds: 250), curve: Curves.bounceInOut);
    }
  }

---

In HeaderHome class

onTap = (){
        print('She clicked Body2');
        rooting.pgCont(0); // index starts from 0
    },

---

It's not wise to call State of another Widget from another widget. You should use callback to deal with code from other State class.

https://www.geeksforgeeks.org/flutter-working-with-callback-functions/

Answer 2

You can use a Provider:

 import 'package:flutter/material.dart';

class PageProvider extends ChangeNotifier{
//HomeScreen Navigation Bar
PageController _pageSelection=PageController(initialPage: 0);

PageController get pageSelection{
  return this._pageSelection;
}

set pageSelection(PageController i){
  this._pageSelection=i;
  notifyListeners();
}
}

In the Main you declare de providers

MultiProvider(
providers: [
ChangeNotifierProvider(create: (_)=> UIProvider()),
ChangeNotifierProvider(create: (_)=> PageProvider())
],


child: MaterialApp()
)

And finally the class where you have the button you call the provider

class Button extends StatelessWidget {

const Button({
Key? key,
}) : super(key: key);


@override
Widget build(BuildContext context) {
//Calling the Provider to control
final pageProvider = Provider.of<PageProvider>(context);

return SingleChildScrollView(
  child: Center(
    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Material(
          color: Colors.amber,
          borderRadius: BorderRadius.circular(10),
          child: TextButton(
//This is where you control the Pageview to change to the next page
            
onPressed()=>pageProvider.pageSelection.nextPage(duration: 
            Duration(milliseconds: 1000), curve: Curves.easeIn),
            child: Container(
  
        alignment: Alignment.center,
              width: 200,
              height: 50,
              child: const Text('Continuar',style: 
TextStyle(fontSize: 30, 
  fontWeight: FontWeight.bold,color: Colors.white),),
            )
          ),
        )  
     ]
    ),
  ),
 );
 }
 }

Remember to always import the packages