How to control an expansionPanel in flutter

Question

So I have a list of elements that I made from another list. The list is setout in a list of expansionPanels.

I am unable to expand and shrink the panel. could someone kindly help.

Also I am kinda new to flutter feel free to offer a better approach I there is one.

class Expansionpanel extends StatefulWidget {
  final List<MoneyTransactionModel> transactions;
  Expansionpanel({Key key, @required this.transactions}) : super(key: key);

  Expansionpaneltate createState() => Expansionpaneltate();
}

class NewItem {
  bool isExpanded;
  final String header;
  final Widget body;
  final Icon iconpic;
  NewItem(this.isExpanded, this.header, this.body, this.iconpic);
}

class Expansionpaneltate extends State<Expansionpanel> {
  List<NewItem> getItemList() {
    List<NewItem> items = List<NewItem>();
    for (final item in widget.transactions) {
      
      items.add(NewItem(
          false,
          item.productId,
          Padding(
              padding: EdgeInsets.all(20.0),
              child: Column(children: <Widget>[
                Text('data'),
                Text('data'),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: <Widget>[
                    Text('data'),
                    Text('data'),
                    Text('data'),
                  ],
                ),
                Radio(value: null, groupValue: null, onChanged: null),
                //put the children here
              ])),
          Icon(Icons.image)));
    }
    return items;
  }

  Widget List_Criteria;

  Widget build(BuildContext context) {
    List_Criteria = Padding(
      padding: EdgeInsets.all(10.0),
      child: ExpansionPanelList(
        expansionCallback: (int index, bool isExpanded) {
          setState(() {
            print(getItemList()[index].isExpanded);
            getItemList()[index].isExpanded = !getItemList()[index].isExpanded;
          });
        },
        children: getItemList().map((NewItem item) {
          return ExpansionPanel(
            headerBuilder: (BuildContext context, bool isExpanded) {
              return MyListTile(header: item.header,);
            },
            canTapOnHeader: true,
            isExpanded: item.isExpanded,
            body: item.body,
          );
        }).toList(),
      ),
    );

    return Container(
      child: List_Criteria,
    );
  }
}

This is what my code looks like so far

Answer 1

Small remark: Don't call variable List_Criteria

Class members, top-level definitions, variables, parameters, and named parameters should capitalize the first letter of each word except the first word, Effective Dart: Style

Here the answer to your question:

    import 'package:flutter/material.dart';

    void main() => runApp(MyApp());

    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Flutter Demo',
          home: Scaffold(
            body: SafeArea(
              child: SingleChildScrollView(
                child: ExpansionListExample(transactions: [
                  MoneyTransactionModel(productId: 'id-1'),
                  MoneyTransactionModel(productId: 'id-2'),
                  MoneyTransactionModel(productId: 'id-3'),
                  MoneyTransactionModel(productId: 'id-4'),
                ]),
              ),
            ),
          ),
        );
      }
    }

    class ExpansionListExample extends StatefulWidget {
      final List<MoneyTransactionModel> transactions;
      ExpansionListExample({
        Key key,
        @required this.transactions,
      }) : super(key: key);

      ExpansionListExampleState createState() => ExpansionListExampleState();
    }

    class ExpansionListExampleState extends State<ExpansionListExample> {
      List<bool> openList;

      @override
      void initState() {
        openList = List.filled(widget.transactions.length, false);
        super.initState();
      }

      Widget build(BuildContext context) {
        return Container(
            child: Padding(
          padding: EdgeInsets.all(10.0),
          child: ExpansionPanelList(
            expansionCallback: (index, isExpanded) {
              setState(() {
                openList[index] = !openList[index];
              });
            },
            children: getItemList(),
          ),
        ));
      }

      List<ExpansionPanel> getItemList() {
        return widget.transactions
            .asMap()
            .map((index, item) {
              return MapEntry(
                  index,
                  ExpansionPanel(
                    headerBuilder: (context, isExpanded) {
                      return Text(
                        item.productId,
                      );
                    },
                    canTapOnHeader: true,
                    isExpanded: openList[index],
                    body: Padding(
                      padding: EdgeInsets.all(20.0),
                      child: Column(
                        children: <Widget>[
                          Text('data'),
                          Text('data'),
                          Row(
                            mainAxisAlignment: MainAxisAlignment.spaceAround,
                            children: <Widget>[
                              Text('data'),
                              Text('data'),
                              Text('data'),
                            ],
                          ),
                          Radio(value: null, groupValue: null, onChanged: null),
                          //put the children here
                        ],
                      ),
                    ),
                  ));
            })
            .values
            .toList();
      }
    }

    class MoneyTransactionModel {
      final String productId;

      MoneyTransactionModel({this.productId});
    }