实现效果
项目源码
对flutter中的动画不了解的可以看这篇 Flutter 动画入门
实现
- 首先将界面拆解成两部分 menu 和 homePage 使用Stack组件将两者包裹起来(类似使用FrameLayout)
menu
- menu的动画可以分解成两部分:
- 平移:从左侧推入
- 缩放:从0.0放大至1.0
- menu动画初始化如下:
- menu动画具体使用
- 关于推进动画,下图说明
homePage
- homePager的动画分为两部分
- 平移:平移伴随着尺寸的变化
- 缩放:从1.0缩小至0.8
- homePage动画初始化如下:
- homePage动画具体使用