Flutter圆角展开折叠组件插件rounded_expansion_tile的使用

RoundedExpansionTile 是一个简单的组合小部件，用于提供带有圆角的展开折叠列表项。该小部件仅使用默认的Flutter小部件，并适用于所有平台。

Getting Started

要开始使用 RoundedExpansionTile，只需在您的 pubspec.yaml 文件中添加依赖项并导入它即可开始使用。

dependencies:
  rounded_expansion_tile: ^1.0.0 # 请根据实际版本号替换

然后在 Dart 文件中导入：

import 'package:rounded_expansion_tile/rounded_expansion_tile.dart';

Inputfields

Default ListTile inputfields

这些是 ListTile 默认提供的输入字段：

• autofocus
• contentPadding
• dense
• enabled
• enableFeedback
• focusColor
• focusNode
• horizontalTitleGap
• hoverColor
• isThreeLine
• key
• leading
• minLeadingWidth
• minVerticalPadding
• mouseCursor
• onLongPress
• selected
• selectedTileColor
• shape
• subtitle
• title
• tileColor
• trailing
• visualDensity
• onTap

Extra inputfields and tips

shape Shape()

形状将用于 ListTile 的形状，而不是子项。这在按下时可见，并将在墨水飞溅中显示。

建议将其放在具有相同形状的 Card 小部件中以获得最佳效果：

Card(
    shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
    child: RoundedExpansionTile(
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
        title: Text('Some title'),
        children: [
            // 子项列表
        ],
    ),
),

duration Duration()

用于显示扩展动画的时间，默认为500毫秒。

children List<Widget>[]

当 ListTile 展开时显示的子项。

childrenPadding EdgeInsets()

子项周围的填充，不同于内容填充。

curve Curve()

用于子项动画的曲线，默认为 Curves.fastLinearToSlowEaseIn。

trailing Widget()

可覆盖默认汉堡菜单图标（AnimatedIcon），图标会默认旋转。

rotateTrailing bool

是否旋转自定义尾随图标，默认为true。

noTrailing bool

设置为true时，即使提供了自定义尾随也不会显示。

Example

以下是一个完整的示例代码，展示如何使用 RoundedExpansionTile：

import 'package:flutter/material.dart';
import 'package:rounded_expansion_tile/rounded_expansion_tile.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Rounded Expansion Tile Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Rounded Expansion Tile Demo'),
      ),
      backgroundColor: Colors.grey.shade200,
      body: ListView(
        padding: EdgeInsets.symmetric(horizontal: 8, vertical: 16),
        children: [
          Card(
            elevation: 0,
            color: Colors.white,
            child: RoundedExpansionTile(
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(4)),
              title: Text('BorderRadius.circular(4)'),
              children: [
                for (var i = 0; i < 5; i++)
                  ListTile(
                    title: Text('Child $i'),
                  )
              ],
            ),
          ),
          Divider(height: 20),
          Card(
            shape:
                RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
            child: RoundedExpansionTile(
              leading: Icon(Icons.person),
              shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(8)),
              title: Text('BorderRadius.circular(8)'),
              subtitle: Text('In card'),
              children: [
                for (var i = 0; i < 5; i++)
                  ListTile(
                    title: Text('Child $i'),
                  )
              ],
            ),
          ),
          // 其他示例类似，请参考完整示例代码
        ],
      ),
    );
  }
}

通过以上示例代码，您可以创建不同圆角半径和样式的展开折叠组件。希望这对您有所帮助！