Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to go back and refresh the previous page in Flutter?

I have a home page which when clicked takes me to another page through navigates, do some operations in then press the back button which takes me back to the home page. but the problem is the home page doesn't get refreshed.

Is there a way to reload the page when i press the back button and refreshes the home page?

like image 975
David Avatar asked Apr 14 '18 10:04

David


People also ask

How do you go back and refresh the previous page in Flutter using GETX?

To move to the next page we push route to the navigator. To move back page to previous page, we pop route from the navigator.


2 Answers

You can trigger the API call when you navigate back to the first page like this pseudo-code

class PageOne extends StatefulWidget {   @override   _PageOneState createState() => new _PageOneState(); }  class _PageOneState extends State<PageOne> {   _getRequests()async{    }   @override   Widget build(BuildContext context) {     return new Scaffold(       body: new Center(         child: new RaisedButton(onPressed: ()=>         Navigator.of(context).push(new MaterialPageRoute(builder: (_)=>new PageTwo()),)         .then((val)=>val?_getRequests():null),       ),     ));   } }  class PageTwo extends StatelessWidget {   @override   Widget build(BuildContext context) {     //somewhere     Navigator.pop(context,true);   } } 

Or you can just use a stream if the API is frequently updated, the new data will be automatically updated inside your ListView

For example with firebase we can do this

stream: FirebaseDatabase.instance.reference().child(       "profiles").onValue 

And anytime you change something in the database (from edit profile page for example), it will reflect on your profile page. In this case, this is only possible because I am using onValue which will keep listening for any changes and do the update on your behalf.

like image 54
Shady Aziza Avatar answered Sep 22 '22 20:09

Shady Aziza


(In your 1st page): Use this code to navigate to the 2nd page.

Navigator.pushNamed(context, '/page2').then((_) {   // This block runs when you have returned back to the 1st Page from 2nd.   setState(() {     // Call setState to refresh the page.   }); }); 

(In your 2nd page): Use this code to return back to the 1st page.

Navigator.pop(context); 
like image 39
CopsOnRoad Avatar answered Sep 21 '22 20:09

CopsOnRoad