How to pass values to widgets inside an array in Flutter

Question

I have this array/list in Flutter which contains some simple widgets:

final List<Widget> steps = [
      _step0(),
      _step1(),
      _step2(),
    ];

I can display all of them like this:

itemBuilder: (BuildContext context, int index) {
   return steps[index];
}

But how can I pass a value to one of the widget from the itemBuilder?

Widget step0 build(String something) {}

Answer 1

If I got you, this is what you are trying to achieve you need to have a list of Function not Widget:

class _MyHomePageState extends State<MyHomePage> {
  List<Function> steps;

  @override
  void initState() {
    steps = [
      _step0,
      _step1,
      _step2,
    ];
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: ListView.builder(
          itemCount: steps.length,
          itemBuilder: (BuildContext context, int index) {
            return steps[index](somethinng: "something");
          },
        ),
      ),
    );
  }

  Widget _step0({String somethinng}) {
    return Container(child: Text(somethinng ?? "anything"));
  }

  Widget _step1({String somethinng}) {
    return Container(child: Text(somethinng ?? "anything"));
  }

  Widget _step2({String somethinng}) {
    return Container(child: Text(somethinng ?? "anything"));
  }
}

If you can adjust your scenario to match with one method(without step0, step1, ...), you can try something like below or get an idea and do some changes to your scenario:

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: ListView(
          children: List.generate(10, (int index) {
            return ParentWidget(
              data: index,
              function: () => print("whooo! $index"),
              child: Text(index.toString(), style: TextStyle(fontSize: 20)),
            );
          }),
        ),
      ),
    );
  }
}

class ParentWidget extends StatefulWidget {
  final Widget child;
  final int data;
  final Function function;

  ParentWidget({this.child, this.data, this.function});

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

class _ParentWidgetState extends State<ParentWidget> {
  @override
  void initState() {
    print(widget.data);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: widget.function,
      child: Container(
        child: (widget.child != null) ? widget.child : SizedBox(),
      ),
    );
  }
}

If you have large collection of data, please dont use, List.generate() use ListView.builder like you are doing right now.

If this not what you are looking for please let me know to delete this answer.