How to pass data from one page to another with flutter?

Question

I figured already how to transfer data from one page to another but I found a challenge...

1. A user has to select one of the matches from pg1 (footballEvent) to go to page2(footballScreen)

footballEvent pg1

2. Images displayed on page2 should be the same as the ones previous selected from pg1,

footballScreen pg2

3. This is the code I wrote to pass data from pg1 to pg2. [6]: https://i.stack.imgur.com/u2etq.png the problem with this approach is: leftPlayer[index] , because only the data on the left it's updated on pg2, but not the data on the right side.

4. This is the code I used inside pg2 to update a team's image data.imageUrl. [5]: https://i.stack.imgur.com/PSkFf.png

5. This is how I structured the matches: (and I believe this could be the problem because I'm not using the rightPlayer data on the code(3rd point) to pass data to the 2nd pg). leftPlayer and rightPlayer

So, how can I fix this?

Answer 1

You need to pass a values to a next screen class constructor.

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => FootbalScreen(leftPlayer[index]),
  ),
);

RouteSettings useful when you defining routing on an app main class and all routing managed in this class. You can read more about routing organization in Documentation .