Flutter：自定义 ExpansionTile答案

【问题标题】：Flutter: Custom ExpansionTileFlutter：自定义 ExpansionTile
【发布时间】：2020-07-14 21:15:18
【问题描述】：

是否可以在颤动中更改扩展图块？具体来说，我想删除它在扩展时创建的分隔符。我也想调整它的填充。那可能吗？谢谢！

【问题讨论】：

只需从github.com/flutter/flutter/blob/… 复制ExpansionTile 源代码并根据需要进行编辑并制作您的自定义ExpansionTile！

【解决方案1】：

来自ExpansionTile的来源

https://github.com/flutter/flutter/blob/d927c9331005f81157fa39dff7b5dab415ad330b/packages/flutter/lib/src/material/expansion_tile.dart#L176-L184

  Widget build(BuildContext context) {
    final ThemeData theme = Theme.of(context);
    _borderColor.end = theme.dividerColor;
    _headerColor
      ..begin = theme.textTheme.subhead.color
      ..end = theme.accentColor;
    _iconColor
      ..begin = theme.unselectedWidgetColor
      ..end = theme.accentColor;
    _backgroundColor.end = widget.backgroundColor;

您可以通过将元素包装在 Theme 中来获得可以影响的内容，例如通过修改 dividerColor

_borderColor.end = theme.dividerColor;

final theme = Theme.of(context).copyWith(dividerColor: Colors.yellow);
return Theme(data: theme, child: ExpansionTile(...));

与_headerColor、_iconColor、_backgroundColor 类似。如果您需要更多自定义，您可以随时复制源代码并根据自己的喜好对其进行自定义。

【讨论】：

@GunterZochbauer 编辑源代码是一种更好的做法？我有一个类似的问题，我查看了扩展磁贴源代码，并且在扩展磁贴时应用了边框我只是评论了那段代码，因为我不需要它们并且它对我有用，应该这样做还是一种不好的做法？
@maheshmnj 如果您更改 ~/.pub-cache/... 或 ~/.flutter/... 中的代码，您将不会对 Flutter 有太多乐趣 - 一点也不好玩 - 永远不要这样做。该目录中的更改可能随时丢失。如果您将源代码复制到自己的项目中，那么维护负担就在您身上，因为当 Flutter 团队进行更改时，您甚至不会收到通知，并且您的代码可能会变得陈旧。如果小部件不允许任何其他方式来根据您的需要自定义其行为（如当时上面的示例），那么复制可能是较轻的负担。

【解决方案2】：

要移除分隔线，只需使用 Theme 小部件扭曲并让分隔线颜色透明。

final theme = Theme.of(context).copyWith(dividerColor: Colors.transparent);
return Theme(data: theme, child: ExpansionTile(...));

【讨论】：

这个答案太简短了，没有充分解释它是如何解决 OP 的问题的。

【解决方案3】：

注释掉

//        border: Border(
//          top: BorderSide(color: borderSideColor),
//          bottom: BorderSide(color: borderSideColor),
//        ),

来自expansion_tile.dart

【讨论】：

这不是一个好习惯，因为当颤振团队更新他们的代码时，它会被覆盖，请阅读上面来自@GunterZochbauer 的评论