Flutter 折叠控件

Flutter 中折叠控件可以使用 ExpansionPanel 和 ExpansionPanelList 实现。ExpansionPanel 可以定义一个折叠面板，而 ExpansionPanelList 可以多个 ExpansionPanel 组合成一个列表。

下面是一个简单的例子，展示如何使用 ExpansionPanelList 实现折叠控件：

import 'package:flutter/material.dart';

class MyExpansionPanel extends StatefulWidget {
  @override
  _MyExpansionPanelState createState() => _MyExpansionPanelState();
}

class _MyExpansionPanelState extends State<MyExpansionPanel> {
  List<Item> _items = <Item>[
    Item(
      headerValue: 'Header 1',
      expandedValue: 'Expanded 1',
    ),
    Item(
      headerValue: 'Header 2',
      expandedValue: 'Expanded 2',
    ),
    Item(
      headerValue: 'Header 3',
      expandedValue: 'Expanded 3',
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: ExpansionPanelList(
        expansionCallback: (int index, bool isExpanded) {
          setState(() {
            _items[index].isExpanded = !isExpanded;
          });
        },
        children: _items.map<ExpansionPanel>((Item item) {
          return ExpansionPanel(
            headerBuilder: (BuildContext context, bool isExpanded) {
              return ListTile(
                title: Text(item.headerValue),
              );
            },
            body: ListTile(
              title: Text(item.expandedValue),
            ),
            isExpanded: item.isExpanded,
          );
        }).toList(),
      ),
    );
  }
}

class Item {
  Item({
    this.expandedValue,
    this.headerValue,
    this.isExpanded = false,
  });

  String expandedValue;
  String headerValue;
  bool isExpanded;
}

在上面的例子中，我们创建了一个 Item 类，表示每个折叠面板的内容。然后，我们创建了一个 List<Item>，包含几个 Item 对象。接着，我们将这些 Item 对象映射为 ExpansionPanel 对象，并将它们放在一个 ExpansionPanelList 中。

在 ExpansionPanelList 中，我们需要实现一个 expansionCallback 方法，这个方法会在用户点击折叠面板时被调用。在这个方法中，我们可以改变每个 Item 对象的 isExpanded 属性，从而控制折叠面板的展开和关闭。

最后，我们把 ExpansionPanelList 放在一个 SingleChildScrollView 中，这是为了让折叠控件可以滚动。