使用
Transition定义了 页面从 A 跳转到 B 时的过渡动画效果。比如:从右边滑入、淡入淡出、缩放、无动画等等。
在 GetPage
或 Get.to
系列方法中都可以用:
Get.to(
NextPage(),
transition: Transition.fadeIn,
);
GetPage(
name: AppRoutes.Detail, // Detail = '/detail'
page: () => DetailView(),
transition: Transition.downToUp,
),
常用的 Transition
枚举值
Transition.fade → 直接淡入淡出。
Transition.fadeIn → 新页面从透明到完全显示。
Transition.rightToLeft → 新页面从右往左滑入。
Transition.leftToRight → 新页面从左往右滑入。
Transition.upToDown → 从上往下。
Transition.downToUp → 从下往上。
Transition.zoom → 页面从小到大放大进入。
Transition.cupertino → iOS 风格的右滑进入、右滑返回。
Transition.native → 根据平台选择默认动画(iOS 用 Cupertino,Android 用 Material)。
Transition.noTransition → 没有动画,直接切换。
配合 duration
使用
Get.to(
NextPage(),
transition: Transition.zoom,
duration: Duration(milliseconds: 500),
);
全局默认动画
如果想让所有页面默认使用某种动画,可以在 GetMaterialApp
里设置:
GetMaterialApp(
defaultTransition: Transition.fade,
transitionDuration: Duration(milliseconds: 400),
getPages: [
GetPage(name: '/home', page: () => HomePage()),
GetPage(name: '/login', page: () => LoginPage()),
],
);