flutter - 如何在 ExpansionPanelList 中只制作一个与其他扩展面板不同的扩展面板？扑

Question

正如问题所暗示的那样，我有一个 ExpansionPanelList，一个 ExpansionPanel（最后一个或第 7 个）应该有 2 个额外的按钮，但我怎样才能将它们添加到最后一个面板中而不是所有其他面板中？

这是我的整个扩展面板的代码，因为我不确定你必须在哪里添加行为，但在扩展面板的主体中猜测（接近第 40 行）：

    class ExpansionList extends StatefulWidget {
  final Info info;

  const ExpansionList({
    Key key,
    this.info,
  }) : super(key: key);
  @override
  _ExpansionListState createState() => _ExpansionListState();
}

class _ExpansionListState extends State<ExpansionList> {
  Widget _buildListPanel() {
    return Container(
      child: Theme(
        data: Theme.of(context).copyWith(
          cardColor: Color(0xffDDBEA9),
        ),
        child: ExpansionPanelList(
          dividerColor: Colors.transparent,
          elevation: 0,
          expansionCallback: (int index, bool isExpanded) {
            setState(() {
              infos[index].isExpanded = !isExpanded;
            });
          },
          children: infos.map<ExpansionPanel>((Info info) {
            return ExpansionPanel(
                headerBuilder: (BuildContext context, bool isExpanded) {
                  return ListTile(
                    title: !isExpanded
                        ? Text(
                            info.headerValue,
                          ) //code if above statement is true
                        : Text(
                            info.headerValue,
                            textScaleFactor: 1.3,
                            style: TextStyle(
                            fontWeight: FontWeight.bold,
                            ),
                          ),
                  );
                },
                body: Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Container(
                    decoration: BoxDecoration(
                        color: Color(0xffFFE8D6),
                        borderRadius: BorderRadius.circular(25)),
                    child: Column(
                      children: [
                        ListView.separated(
                          physics: const NeverScrollableScrollPhysics(),
                          shrinkWrap: true,
                          padding: EdgeInsets.only(left: 40.0,),
                          itemCount: info.expandedValueData.length,
                          itemBuilder: (context, index) {
                            return CheckboxListTile(
                                title: Text(info.expandedValueData[index].title,
                                    style: TextStyle(
                                        decoration: info.expandedValueData[index]
                                                .completed
                                            ? TextDecoration.lineThrough
                                            : null)),
                                value: info.expandedValueData[index].completed,
                                onChanged: (value) {
                                  setState(() {
// Here you toggle the checked item state
                                    infos.firstWhere(
                                        (currentInfo) => info == currentInfo)
                                      ..expandedValueData[index].completed =
                                          value;
                                  });
                                });
                          },
                          separatorBuilder: (BuildContext context, int index) {
                            return SizedBox(
                              height: 20,
                            );
                          },
                        ),
                        Row(children: [
                          SizedBox(
                              width: MediaQuery.of(context).size.width * 0.16),
                          Text("Abschnitt bis zum Neustart löschen"),
                          SizedBox(
                              width: MediaQuery.of(context).size.width * 0.11),
                          IconButton(
                            icon: Icon(Icons.delete),
                            onPressed: () {
                              setState(() {
                                infos.removeWhere(
                                    (currentInfo) => info == currentInfo);
                              });
                            },
                          )
                        ]),
                      ],
                    ),
                  ),
                ),
                isExpanded: info.isExpanded);
          }).toList(),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Container(
        child: _buildListPanel(),
      ),
    );
  }
}

感谢您的建议！

标签： flutterflutter-layout

Answer 1

嗨，只需在 info 对象中添加一个字段（如果您还没有字段），您就可以更改基于该字段膨胀的小部件。例如

...
children: infos.map<ExpansionPanel>((Info info) {
  return ExpansionPanel(
    headerBuilder: (BuildContext context, bool isExpanded) {
      return info.type == TYPE_A ? TypeAWidgetHeader(info) : TypeBWidgetHeader(info);
    body: info.type == TYPE_A ? TypeAWidgetBody(info) : TypeBWidgetBody(info);
...