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,
    );
   },
 );
}
Share:
662
Best Friends Inc
Author by

Best Friends Inc

Updated on December 24, 2022

Comments

  • Best Friends Inc
    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() to PageTwo() using Navigator.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
      Best Friends Inc over 3 years
      actually can't use pageTransitionsTheme cz I am using NeumorphicThemeData, and it has no parameter called pageTransitionsTheme
  • Best Friends Inc
    Best Friends Inc over 3 years
    I wanted to know how to use with pushNamed, without compromising my arguments
  • Subrata Das
    Subrata Das over 3 years
    You need to use onGenerateRoute in your MaterialApp widget.
  • Best Friends Inc
    Best Friends Inc over 3 years
    If I use onGenerateRoute, I can't use arguments. I has to be passed as parameter. I there any way?
  • Subrata Das
    Subrata Das over 3 years
    I have edited my answer , I hope your problem is resolved ,if it is working then tick mark the answer.