animated positioned took too much space while changing the position. the question is there is any way to minimize this space ? it ascends to safeare

the source code is below so you can try it:

class Test extends StatefulWidget {
  const Test({Key? key}) : super(key: key);

  @override
  State<Test> createState() => _TestState();
}

class _TestState extends State<Test> with TickerProviderStateMixin {
  bool selected = false;

  late AnimationController colorController;
  late Animation animation;

  @override
  initState() {
    super.initState();
    WidgetsBinding.instance!.addPostFrameCallback((_) {
      setState(() {
        selected = true;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    changeStatusColor(colorPrimary);
    return Scaffold(
      backgroundColor: colorPrimary,
      body: Stack(
        alignment: Alignment.bottomCenter,
        children: [
          AnimatedPositioned(
            curve: Curves.elasticOut,
            duration: Duration(milliseconds: 10000),
            width: MediaQuery.of(context).size.width,
            height: selected
                ? MediaQuery.of(context).size.height
                : MediaQuery.of(context).size.height * .7,
            top: selected
                ? 50.0
                : MediaQuery.of(context).size.height -
                    MediaQuery.of(context).size.height * .7,
            child: Container(
                padding: EdgeInsets.fromLTRB(26, 0, 26, 25.51),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.vertical(top: Radius.circular(40)),
                ),
                child: Column(children: [])),
          ),
        ],
      ),
    );
  }
}


Solution 1: Yeasin Sheikh

The animation curve: Curves.elasticOut is responsible for this. You can switch to difference one or reduce the top animation point.

enter image description here

You can check this elasticOut behavior

Check Curves class and choose the one you need