Flutter – How to pass data between pages in PageView Widget?

Issue

I have a PageView widget like below:

Widget buildPageView() {
    return PageView(
      controller: pageController,

      onPageChanged: (index) {
        pageChanged(index);
      },

      children: <Widget>[
        AddPropertyDescription(pageController: pageController,),
        AddPropertyMedia(pageController: pageController),
        AddPropertyLocation(pageController: pageController),
        AddPropertyDetails(pageController: pageController),
        AddPropertyAmenities(pageController: pageController)
      ],
    );
  }

I have five pages as a Widget in my PageView, now I want to pass data from one page to another till the last page when page changed…..

I have taken the Next button in each Page, In the Next button onTap() I simply increase the page number to slide to next page like below

 onTap: () async{
                  pageController.animateToPage(
                    1,
                    duration: Duration(milliseconds: 300),
                    curve: Curves.linear,
                  );
              }, 

When pressing the next button and go to the next screen I want to carry data and pass it to the next page.

Is there anyone here who could have faced the same problem in flutter…..

Please guide me on how can I achieve this…….

Solution

The Page widget can get data, and a callback for passing data, I’ll explain what I mean.

The buildPageView should pass to the widgets the extra parameters:

int data = 0;

void onDataChange(int newData) {
  setState(() => data = newData);
}

Widget buildPageView() {
    return PageView(
      controller: pageController,

      onPageChanged: (index) {
        pageChanged(index);
      },

      children: <Widget>[
        AddPropertyDescription(pageController: pageController, data: data, onDataChange: onDataChange),
        AddPropertyMedia(pageController: pageController, data: data, onDataChange: onDataChange),
        AddPropertyLocation(pageController: pageController, data: data, onDataChange: onDataChange),
        AddPropertyDetails(pageController: pageController, data: data, onDataChange: onDataChange),
        AddPropertyAmenities(pageController: pageController, data: data, onDataChange: onDataChange)
      ],
    );
  }

And the widget itself should except the parameters:

class MyWidget extends StatelessWidget {
  const MyWidget({
    @required this.data,
    @required this.onDataChange,
    Key key,
  }) : super(key: key);

  final int data;
  final Function(int) onDataChange;

  @override
  Widget build(BuildContext context) {
    return FlatButton(
      onPressed: () => onDataChange(data + 1),
      child: Text(data.toString()),
    );
  }
}

Answered By – Zvi Karp

Answer Checked By – Timothy Miller (FlutterFixes Admin)