Flutter部件出场即动画，不显示时不占用空间不占内存

 

              /// flutter_animate 插件
              if (show)
                Container(
                  width: 200,
                  height: 100,
                  color: Colors.orange,
                  child: Center(child: Text('flutter_animate')),
                )
                    .animate()
                    .fadeIn() // uses `Animate.defaultDuration`
                    .scale() // inherits duration from fadeIn
                    .move(
                    delay: 300.ms,
                    duration: 600.ms) // runs after the above w/new duration
                    // .blurXY()
              ,
              Divider(
                height: 20,
              ),
              /// 使用简单，显示隐藏
              Visibility(
                visible: show,
                maintainState: true,
                maintainAnimation: true,
                child: Container(
                  width: 200,
                  height: 100,
                  color: Colors.orange,
                  child: Center(child: Text('Visibility')),
                ),
              ),
              Divider(
                height: 20,
              ),
              AnimatedSize(
                duration: Duration(milliseconds: 1000),
                curve: Curves.easeInOut,
                alignment: Alignment.topCenter, // 动画对齐方式
                child: show
                    ? Container(
                  width: 200,
                  height: 100,
                  color: Colors.orange,
                  child: Center(child: Text('AnimatedSize')),
                )
                    : const SizedBox.shrink(), // 隐藏时零高度
              ),
              Divider(
                height: 20,
              ),
              if (show)
                TweenAnimationBuilder(
                  duration: Duration(milliseconds: 1000),
                  tween: Tween<double>(begin: 0, end: 1),
                  builder: (context, value, child) {
                    return Container(
                      width: 200, // 宽度也动画
                      height: 100,
                      color: Colors.green,
                      child: Center(child: Text('TweenAnimationBuilder')),
                    );
                  },
                ),
              Divider(
                height: 20,
              ),
              AnimatedSwitcher(
                duration: Duration(milliseconds: 1000),
                transitionBuilder: (child, animation) {
                  // 组合动画：淡入 + 缩放
                  return FadeTransition(
                    opacity: animation,
                    child: ScaleTransition(
                      scale: Tween<double>(begin: 0, end: 1).animate(animation),
                      child: child,
                    ),
                  );
                },
                child: show
                    ? Container(
                  width: 200, // 宽度也动画
                  height: 100,
                  color: Colors.green,
                  child: Center(child: Text('AnimatedSwitcher')),
                )
                    : const SizedBox.shrink(),
              ),