Rebuild Page in Flutter

October 10, 2022

I want the same detail page to be regenerated when the user clicks the next or previous content button at the bottom of the blog detail page. My solution:

Visibility(
                            visible: widget.index < _listLength ? true : false,
                            child: TextButton(
                              onPressed: () {
                                Route route = MaterialPageRoute(
                                    builder: (c) => DetailPage(
                                          index: widget.index + 1,
                                          detailDataList: widget.detailDataList,
                                        ));
                                Navigator.push(context, route);
                              },
                              child: Text(
                                'Sonraki Yazı',
                                style: TextStyle(color: mPrimaryColor),
                              ),
                            ),
                          )

Problem: Detail Page creates a new page every time it is created, which means extra unnecessary cost. How can I create the detail page with the new data in the list?

Route route = MaterialPageRoute(
                                    builder: (c) => DetailPage(
                                          index: widget.index + 1,
                                          detailDataList: widget.detailDataList,
                                        ));

In summary: When the user clicks the next content button at the bottom of the detail page, the same page should be rebuilt with the next data in the list, but the new page, not over the previous page. How can I do that?

>Solution :

                           Visibility(
                            visible: widget.index < _listLength ? true : false,
                            child: TextButton(
                              onPressed: () {
                                widget.index = widget.index + 1;
                                setState((){});
                              },
                              child: Text(
                                'Sonraki Yazı',
                                style: TextStyle(color: mPrimaryColor),
                              ),
                            ),
                          )