AnimationFoo AnimatedContainer

 import "package:flutter/material.dart";

void main() {
  runApp(AppAnimate(),);
}
class AppAnimate extends StatelessWidget {
  const AppAnimate({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: "Foo Animation in Flutter",
      theme: ThemeData(
        primarySwatch: Colors.teal,
      ),
      home: FooAnimation(),
    );
  }
}
class FooAnimation extends StatefulWidget {
  const FooAnimation({super.key});

  @override
  State<FooAnimation> createState() {
    return FooAnimationState();
  }
}
class FooAnimationState extends State<FooAnimation> {
  var _width = 200.0;
  var _height = 100.0;

  bool flag = true;

  Color bgColor = Colors.blueGrey;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Foo Animation - Animated Container"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            AnimatedContainer(
              width: _width,
              height: _height,
              color: bgColor,
              curve: Curves.slowMiddle,
              duration: const Duration(seconds: 2,),
            ),
            SizedBox(height: 30.0,),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  if(flag) {
                    _width = 100.0;
                    _height = 200.0;
                    bgColor = Colors.orange;
                    flag = false;
                  } else {
                    _width = 200.0;
                    _height = 100.0;
                    bgColor = Colors.blueGrey;
                    flag = true;
                  }
                },);
              },
              child: Text("Animation"),
            ),
          ],
        ),
      ),
    );
  }
}