如果我不提供高度或宽度，AnimatedContainer 大小不会设置动画

Question

如果我为 height 或 width 分配 value，container 会生成动画。但是，我不想将任何 height 或 width 分配给 container。

现在，当我分配 child 时，container 尺寸会自动设置。如果 child 的大小发生变化，container 的大小也会发生变化。

我的代码如下所示

                      AnimatedContainer(
                        padding:
                            EdgeInsets.symmetric(horizontal: 20, vertical: 5),
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.circular(20),
                        ),
                        child: Text(
                          '$someText',
                          style: TextStyle(
                              color: Colors.amber,
                              fontWeight: FontWeight.bold,
                              fontSize: 16),
                        ),
                      ),

如果$someText的值改变，container的宽度也会改变。但是 animation 不起作用。

Answer 1

您应该尝试使用 AnimatedSize 而不是 AnimatedContainer。

Container(
    padding: EdgeInsets.symmetric(horizontal: 20, vertical: 5),
    decoration: BoxDecoration(
      color: Colors.white,
      borderRadius: BorderRadius.circular(20),
    ),
    child: AnimatedSize(
      vsync: this,
      duration: Duration(milliseconds: 200),
      child: Text(
        'Text',
        style: TextStyle(
            color: Colors.amber, fontWeight: FontWeight.bold, fontSize: 16),
      ),
    ),
  ),

此外，您还必须为此将 TickerProviderStateMixin 添加到您的状态。

如果我不提供高度或宽度，AnimatedContainer 大小不会设置动画

AnimatedContainer size does not animate if I don't give Height or Width

flutter

flutter-animation