Flutter: How to combine PageRoute Animation with Navigator.of(context).pushNamed
662
As your Question I have solved this demo answer try once it will work .
import 'package:flutter/material.dart';
void main() {
runApp(
MaterialApp(
home: HomePage(),
onGenerateRoute: (RouteSettings settings) {
final SecondHome args = settings.arguments;
switch (settings.name) {
case '/':
return SlideRightRoute(widget:HomePage());
break;
case '/second':
return
SlideRightRoute(widget:SecondHome(args.data1,args.data2,args.boolvalue));
break;
}
},
),
);
}
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Home'),
),
body: new Center(
child: RaisedButton(
onPressed: () {
Navigator.of(context).pushNamed(
'/second',
arguments:SecondHome("data1","data2",true),
);
},
child: Text('Second Home'),
),
),
);
}
}
class SecondHome extends StatelessWidget {
String data1;
String data2;
bool boolvalue;
SecondHome(this.data1,this.data2,this.boolvalue);
@override
Widget build(BuildContext context) {
print("Secoendhomedata${data1}");
return Scaffold(
appBar: AppBar(
title: Text('Second Home'),
),
body: new Center(
child: RaisedButton(
onPressed: () {
Navigator.pop(context);
},
child: Text('Go Back'),
),
),
);
}
}
class SlideRightRoute extends PageRouteBuilder {
final Widget widget;
SlideRightRoute({this.widget})
: super(
pageBuilder: (BuildContext context, Animation<double> animation,
Animation<double> secondaryAnimation) {
return widget;
},
transitionsBuilder: (BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child) {
return new SlideTransition(
position: new Tween<Offset>(
begin: const Offset(1.0, 0.0),
end: Offset.zero,
).animate(animation),
child: child,
);
},
);
}
Author by
Best Friends Inc
Updated on December 24, 2022Comments
-
Best Friends Inc over 1 year
I want to use animated page route on my flutter project. Now all of my routes are Named Route and I don't wanna change them. Is there any way I can use Page Route Animation with named route? Like: If I am going from
PageOne()
toPageTwo()
usingNavigator.of(context).pushNamed(PageTwo.routename)
, I don't wanna see default transition, May be I want to use scale animation or fade animation. Is there any way to do that?onTap: () { Navigator.of(context).pushNamed( ProductsSearch.routeName, arguments: ScreenArguments(null, null, null, null, null, null, true, false), ); },
-
Best Friends Inc over 3 yearsactually can't use
pageTransitionsTheme
cz I am usingNeumorphicThemeData
, and it has no parameter calledpageTransitionsTheme
-
-
Best Friends Inc over 3 yearsI wanted to know how to use with pushNamed, without compromising my arguments
-
Subrata Das over 3 yearsYou need to use onGenerateRoute in your MaterialApp widget.
-
Best Friends Inc over 3 yearsIf I use onGenerateRoute, I can't use arguments. I has to be passed as parameter. I there any way?
-
Subrata Das over 3 yearsI have edited my answer , I hope your problem is resolved ,if it is working then tick mark the answer.