如何在 Flutter 中為容器的底部邊框設置動畫？

Question

我想創建與 TabBar 動畫非常相似的東西。 當您有兩個選項卡並單擊右側的一個時，底部邊框將動畫化，就像從一個容器（選項卡）過渡到另一個容器一樣。 我可以用容器的邊框做那個動畫嗎？

這是我的容器的代碼：

Container(
  width: MediaQuery.of(context).size.width / 2,
  decoration: BoxDecoration(
    border: Border(
      bottom: BorderSide(width: 2, color: Colors.blueAccent),
    ),
  ),
  child: Align(
    alignment: Alignment.center,
    child: Text(
      'Container',
      style: TextStyle(
        color: Colors.blueAccent,
        fontSize: 17.0,
        fontWeight: FontWeight.bold,
      ),
    ),
  ),
);

謝謝你的幫助。

Answer 1

我能夠通過使用AnimatedContainer而不是Container來解決它：

AnimatedContainer(
  duration: Duration(milliseconds: 700),
  width: MediaQuery.of(context).size.width / 2,
  decoration: BoxDecoration(
    border: Border(
      bottom: BorderSide(width: 2, color: Colors.blueAccent),
    ),
  ),
  child: Align(
    alignment: Alignment.center,
    child: Text(
      'Container',
      style: TextStyle(
        color: Colors.blueAccent,
        fontSize: 17.0,
        fontWeight: FontWeight.bold,
      ),
    ),
  ),
);

希望如果有人需要它會有所幫助。