Kann ein AnimatedContainer seine Höhe animieren?

Question

Ich möchte eine Lücke zwischen zwei Elementen in einer Liste animieren. Ich dachte daran, einen AminatedContainer mit einer Höhe von anfangs Null zu verwenden, aber ich bin nicht vertraut damit, wie das funktioniert. Mein Code ist im Moment:

new AnimatedContainer(
     duration: const Duration(milliseconds: 200), 
     height: App.itemSelected==id ? 50.0 : 0.0, 
     curve: Curves.fastOutSlowIn, 
    ), 

, dass die Höhe des Containers ändert sich aber nicht in einer animierten Weise, wie ich gehofft hatte. Jede Hilfe wäre dankbar erhalten!

Answer 1

Ich bin nicht sicher, ob AnimatedSize für Ihren Anwendungsfall geeignet ist, aber ich habe ein Beispiel dafür, wie hinzugefügt, um eine einfache Animation zu machen mit ihm:

Die Färbung ist ein bisschen off aufgrund die Aufnahme aber sollte man selbst testen können.

class MyAppState extends State<MyApp> with TickerProviderStateMixin { 
    double _height = 50.0; 
    double _width = 20.0; 
    var _color = Colors.blue; 

    @override 
    Widget build(BuildContext context) { 
    return new Scaffold(
     body: new Center(
      child: new Column(
      mainAxisAlignment: MainAxisAlignment.center, 
      children: <Widget>[ 
       new AnimatedSize(

       curve: Curves.fastOutSlowIn, child: new Container(
       width: _width, 
       height: _height, 
       color: _color, 
      ), vsync: this, duration: new Duration(seconds: 2),), 
       new Divider(height: 35.0,), 
       new Row(
       mainAxisAlignment: MainAxisAlignment.center, 
       children: <Widget>[ 
        new IconButton(
         icon: new Icon(Icons.arrow_upward, color: Colors.green,), 
         onPressed:() => 
          setState(() { 
          _color = Colors.green; 
          _height = 95.0; 
          })), 
        new IconButton(
         icon: new Icon(Icons.arrow_forward, color: Colors.red,), 
         onPressed:() => 
          setState(() { 
          _color = Colors.red; 
          _width = 45.0; 
          })), 
       ], 
      ) 
      ],) 
      ,) 
    ); 
    } 
} 

Answer 2

Sie können eine AnimatedSize für diesen Zweck verwenden.

https://docs.flutter.io/flutter/widgets/AnimatedSize-class.html