Flutter 中的扩展面板列表

Posted 2023-05-07

【中文标题】Flutter 中的扩展面板列表

【英文标题】：Expansion Panel List in Flutter

【发布时间】：2018-01-15 12:11:06

【问题描述】：

我是 Flutter 的新手，但我遇到了一个问题。我正在尝试制作扩展面板列表。我可以制作列表，但无法使扩展面板展开或折叠。我正在附上代码。请看一下，让我知道问题所在。

ExpansionPanelList criteria;
criteria = new ExpansionPanelList(
  children: <ExpansionPanel>[
    new ExpansionPanel(
      headerBuilder: schoolheaderBuilder,
      body: new Text("school"),
      isExpanded: false,
    ),
    new ExpansionPanel(
      headerBuilder: hospitalheaderBuilder,
      body: new Text("hospital"),
    ),
    new ExpansionPanel(
        headerBuilder: vaheaderBuilder,
        body: new Text("va facility"),
        isExpanded: false),
    new ExpansionPanel(
        headerBuilder: restheaderBuilder,
        body: new Text("Restaurants"),
        isExpanded: false),
    new ExpansionPanel(
        headerBuilder: crimeheaderBuilder,
        body: new Text("Crime"),
        isExpanded: false),
    new ExpansionPanel(
        headerBuilder: commuteheaderBuilder,
        body: new Text("Commute"),
        isExpanded: false),
    new ExpansionPanel(
        headerBuilder: incomeBuilder,
        body: new Text("Household Income"),
        isExpanded: false),
    new ExpansionPanel(
        headerBuilder: househeaderBuilder,
        body: new Text("House Value"),
        isExpanded: false)
  ],
  expansionCallback: (int index, bool isExpanded)
  
    isExpanded = !criteria.children[index].isExpanded;
  ,
);

【问题讨论】：

你可以尝试用criteria.children切换isExpanded...吗？像这样：criteria.children[index].isExpanded = !isExpanded;

有人给了我那个：***.com/questions/45104182/…

检查来自颤振画廊的this example

嘿...感谢您的意见。我解决了这个问题:)

@RainerWittmann 这不起作用，因为 criteria.children[index].isExpanded 是最终的

【参考方案1】：

这是我使用的代码：

class Criterias extends StatefulWidget 
  CriteriaState createState() => new CriteriaState();


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


double discretevalue = 2.0;
double hospitaldiscretevalue = 25.0;

class CriteriaState extends State<Criterias> 
  List<NewItem> items = <NewItem>[
    new NewItem(
        false,
        'Schools',
        new Padding(
            padding: new EdgeInsets.all(20.0),
            child: new Column(
                children: <Widget>[
                    //put the children here
                ])
              ),new Icon(Icons.add)),
              //give all your items here
  ];

  ListView List_Criteria;
  Widget build(BuildContext context) 
    List_Criteria = new ListView(
      children: [
        new Padding(
          padding: new EdgeInsets.all(10.0),
          child: new ExpansionPanelList(
            expansionCallback: (int index, bool isExpanded) 
              setState(() 
                items[index].isExpanded = !items[index].isExpanded;
              );
            ,
            children: items.map((NewItem item) 
              return new ExpansionPanel(
                headerBuilder: (BuildContext context, bool isExpanded) 
                  return new ListTile(
                      leading: item.iconpic,
                      title: new Text(
                        item.header,
                        textAlign: TextAlign.left,
                        style: new TextStyle(
                          fontSize: 20.0,
                          fontWeight: FontWeight.w400,
                        ),
                      ));
                ,
                isExpanded: item.isExpanded,
                body: item.body,
              );
            ).toList(),
          ),
        )
      ],
    );

    Scaffold scaffold = new Scaffold(
      appBar: new AppBar(
        title: new Text("Criteria Selection"),
      ),
      body: List_Criteria,
      persistentFooterButtons: <Widget>[
        new ButtonBar(children: <Widget>[
          new FlatButton(
            color: Colors.blue,
            onPressed: null,
            child: new Text(
              'Apply',
              textAlign: TextAlign.left,
              style: new TextStyle(fontWeight: FontWeight.bold),
            ),
          )
        ])
      ],
    );
    return scaffold;