Размер AnimatedContainer не анимируется, если я не задаю высоту или ширину

Question

container анимируется, если я назначу value для height или width. Но я не хочу присваивать height или width container.

Прямо сейчас размер container устанавливается автоматически, когда я назначаю ему child. Если размер 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

Вместо AnimatedContainer вы должны попробовать AnimatedSize.

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 в ваше состояние.