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?
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/
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
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.