CODEWITHSUNDEEP
flutter
RT16
RT16

Reputation: 55

Refresh the back page when the device back button is clicked in flutter

I have a page called appointments When i click on appointments(i pass the reports to the next page) the reports are displayed on the reports page,When i add a new report to the page and when i clicked the device back button and again go the reports page the updated files are not seen .I again have to load the entire page then i'm able to view the reports. I'm loading the appointments in the initState() of the page into FutureBuilder. Can Anyone suggest me how to refresh the data when i click my back button from the device

Upvotes: 0

Views: 8258

Answers (3)

Mykhailo Krentsin
Mykhailo Krentsin

Reputation: 47

To open new page you should use next

void _openButtonHandler() {
    Navigator.of(context).pushNamed("route123").then((result) {
      if (result != null) {
        refreshCall();
      }
    }).catchError((error) {});
  }

The back button method should be like this:

Navigator.pop(context, {"param1": "value1"});

Upvotes: 2

John Joe
John Joe

Reputation: 12803

You can do like this:

In your report page, when button is clicked, open Add Report Page. When the back button is pressed, it will call the _refreshData method.

 Navigator.pushNamed(context, AddReportPage.ROUTE).then((onValue) {
   _refreshData()
 });

The _refreshData is used to load the entire page, which you use in initState.

Upvotes: 3

Haroon Ashraf Awan
Haroon Ashraf Awan

Reputation: 1219

You need to use RefreshIndicator for this scenario.Your refresh indicator widget will be the parent of AppointmentsPage.We will assign a key so that we can call it from anywhere and when reports page is closed we will refresh page using this key.I have created a small example along with comments to demonstrate you how it will be done.

class AppointmentsPage extends StatefulWidget {

  @override
  _AppointmentsPageState createState() => _AppointmentsPageState();
}


class _AppointmentsPageState extends State<AppointmentsPage> {
  Future appointments;
  var refreshKey = GlobalKey<RefreshIndicatorState>();

  @override
  void initState() {
    super.initState();
    //Your method to fetch appointments.
    getAppointments();

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: RefreshIndicator(
          key: refreshKey,
          color: Colors.black,
          onRefresh: () async {
            //Call appointments future and fetch appointments.When they are fetched
            //call setState to refresh page
            getAppointments();
            await appointments;
            setState(() {});
          },
          child: Column(
            children: <Widget>[
              FutureBuilder(),
              RaisedButton(
                child: Text("Go To Report"),
                onPressed: () async {
                  //Use await and then navigate to report page
                  await Navigator.of(context).push(
                      MaterialPageRoute(builder: (context) => ReportPage(report: report));
                  );
                  //After popped back from report page call refresh indicator to refresh page
                  refreshKey.currentState.show();
                },
              )
            ],
          ),

      ),
    );


  }


}

Upvotes: 1

Related Questions