文章目录
◯、Hero 动画简介
一、创建 Hero 动画核心组件
二、创建源页面
三、创建目的页面
四、页面跳转
五、完整代码示例
六、相关资源
◯、Hero 动画简介
----
Hero Widget...动画效果 : Hero 通过动画从 源界面 运动到 目标界面 时 , 目标界面 透明度逐渐增加 , 淡入显示 ;
Hero 是界面的组成部分 , 在 源界面 和 目标界面 都存在该组件 ;
Hero...child: Image.network(imageUrl, fit: BoxFit.contain,),
),
),),
);
}
}
二、创建源页面...----
创建一个 StatelessWidget 组件作为源页面 , 其中封装 HeroWidget 组件 , 作为显示的核心组件 , 传入一个 VoidCallback 方法 , 在该方法中跳转到目的界面...----
创建目的界面 : 这里直接在代码中创建 , 该界面中也封装了 HeroWidget 组件 , 其 tag 与源界面 HeroWidget 组件相同 , 这样就可以保证这两个界面互相跳转时 ,