Flutter Hero 实现组件跨界面跳动效果
感谢:https://juejin.im/post/5c4dae0de51d456e41391586脑图先行:今天算是完成了第一个flutter练手项目,真的佩服这个UI设计,简直了!给出链接,好文共欣赏嘛!https://github.com/sergiandreplace/flutter_planets_tutorial然后是脑图中所对应的三个demo具体信息:添加占...
·
感谢:https://juejin.im/post/5c4dae0de51d456e41391586
脑图先行:
今天算是完成了第一个flutter练手项目,真的佩服这个UI设计,简直了!给出链接,好文共欣赏嘛!
https://github.com/sergiandreplace/flutter_planets_tutorial
然后是脑图中所对应的三个demo具体信息:
添加占位符Demo:
Hero(
tag: "DemoTag",
child: Icon(
Icons.add,
size: 150.0,
),
placeholderBuilder: (context, widget) {
return Container(
height: 150.0,
width: 150.0,
child: CircularProgressIndicator(),
);
},
),
更改hero控件:
Hero(
tag: "DemoTag",
child: Icon(
Icons.add,
size: 150.0,
),
flightShuttleBuilder: (flightContext, animation, direction,
fromContext, toContext) {
return Icon(FontAwesomeIcons.rocket, size: 150.0,);
},
),
if(direction == HeroFlightDirection.push) {
return Icon(
FontAwesomeIcons.rocket,
size: 150.0,
);
} else if (direction == HeroFlightDirection.pop){
return Icon(
FontAwesomeIcons.rocket,
size: 70.0,
);
}
使用Hero动画支持ios返回滑动手势是否触发hero动画效果
Hero(
tag: "DemoTag",
child: Icon(
Icons.add,
),
transitionOnUserGestures: true,
),
好了,今天是学习Flutter的第四天了.
总有一天你将会老去,而我,将会加冕为王!!!!!
更多推荐


所有评论(0)