如何在 Flutter 中设置折叠元素的动画

当用户用动画点击不同的小部件（同级或父级）时，如何展开和折叠小部件？

new Column(
    children: <Widget>[
        new header.IngridientHeader(
            new Icon(
                Icons.fiber_manual_record,
                color: AppColors.primaryColor
            ),
            'Voice Track 1'
        ),
        new Grid()
    ],
)

我希望用户能够点击header.IngridientHeader进而Grid小部件应该切换（如果可见则隐藏，反之亦然）。

我正在尝试做一些类似于 Bootstrap 中的 Collapse 的事情。getbootstrap.com/docs/4.0/components/collapse http://getbootstrap.com/docs/4.0/components/collapse

The header.IngridientHeader小部件应该始终保持在原位。这grid是一个可滚动（水平）的小部件。

如果您想将一个小部件折叠到零高度或零宽度，并且该小部件的子部件在折叠时会溢出，我建议尺寸转换 https://api.flutter.dev/flutter/widgets/SizeTransition-class.html or 尺度转换 https://api.flutter.dev/flutter/widgets/ScaleTransition-class.html.

Here is an example of the ScaleTransition widget being used to collapse the container for the four black buttons and status text. My ExpandedSection widget is used with a column to get the following structure.

使用 SizeTransition 小部件动画的小部件示例：

class ExpandedSection extends StatefulWidget {

  final Widget child;
  final bool expand;
  ExpandedSection({this.expand = false, required this.child});

  @override
  _ExpandedSectionState createState() => _ExpandedSectionState();
}

class _ExpandedSectionState extends State<ExpandedSection> with SingleTickerProviderStateMixin {
  late AnimationController expandController;
  late Animation<double> animation; 

  @override
  void initState() {
    super.initState();
    prepareAnimations();
    _runExpandCheck();
  }

  ///Setting up the animation
  void prepareAnimations() {
    expandController = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 500)
    );
    animation = CurvedAnimation(
      parent: expandController,
      curve: Curves.fastOutSlowIn,
    );
  }

  void _runExpandCheck() {
    if(widget.expand) {
      expandController.forward();
    }
    else {
      expandController.reverse();
    }
  }

  @override
  void didUpdateWidget(ExpandedSection oldWidget) {
    super.didUpdateWidget(oldWidget);
    _runExpandCheck();
  }

  @override
  void dispose() {
    expandController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return SizeTransition(
      axisAlignment: 1.0,
      sizeFactor: animation,
      child: widget.child
    );
  }
}

动画容器 https://api.flutter.dev/flutter/widgets/AnimatedContainer-class.html也有效，但如果子级无法调整为零宽度或零高度，Flutter 可能会抱怨溢出。