flutter 上如下出 左入右出 平移切换动画
AnimatedSwitcher(///动画执行切换时间
duration: const Duration(milliseconds: 3000),
///动画构建器 构建指定动画类型
transitionBuilder: (Widget child, Animation<double> animation) {
//Text移进的平移动画
Offset startOffset = Offset(0.0, -1.2);
Offset endOffset = Offset(0.0, 0.0);
if (animation.status == AnimationStatus.completed) {
//Text移出的平移动画
startOffset = Offset(0.0, 1.2);
endOffset = Offset(0.0, 0.0);
}
print("animation.status ${animation.status}");
//这里的核心内容是 动画的相互嵌套使用
//执行平移动画
return SlideTransition(
// 位置移动区分移动进入的Text 与 移动出去的Text
position: Tween(begin: startOffset, end: endOffset).animate(
CurvedAnimation(
parent: animation,
//动画曲线
curve: Curves.ease,
),
),
//透明度渐变动画
child: FadeTransition(
// 透明度从 0.0-1.0
opacity: Tween(begin: 0.0, end: 1.0).animate(
CurvedAnimation(
parent: animation,
curve: Curves.linear,
),
),
//绽放动画
child: ScaleTransition(
scale: Tween(begin: 0.6, end: 1.0).animate(
CurvedAnimation(
parent: animation,
curve: Curves.linear,
),
),
child: child,
),
),
);
},
///执行动画的子 Widget
///只有子 Widget 被切换时才会触发动画
child: yanzhengma?telHome(context):regHome(context),
),水平移动AnimatedSwitcher(
///动画执行切换时间
duration: const Duration(milliseconds: 400),
///动画构建器 构建指定动画类型
transitionBuilder: (Widget child, Animation<double> animation) {
//Text移进的平移动画
Offset startOffset = Offset(-1.0, 0);
Offset endOffset = Offset(0.0, 0.0);
if (animation.status == AnimationStatus.completed) {
//Text移出的平移动画
startOffset = Offset(1.0, 0);
endOffset = Offset(0.0, 0.0);
}
print("animation.status ${animation.status}");
//这里的核心内容是 动画的相互嵌套使用
//执行平移动画
return SlideTransition(
// 位置移动区分移动进入的Text 与 移动出去的Text
position: Tween(begin: startOffset, end: endOffset).animate(
CurvedAnimation(
parent: animation,
//动画曲线
curve: Curves.easeInOutSine,
),
),
child:child,
);
},
///执行动画的子 Widget
///只有子 Widget 被切换时才会触发动画
child: yanzhengma?telHome(context):regHome(context),
),
页:
[1]