炫酷动画菜单源码

[复制链接]
来自: chino 分类: Android精品源码 上传时间: 2016-3-23 11:17:03

项目介绍:

imitate Tumblr's menu, dragging animations look like a snake

something irrelated
Several days ago, I installed the tumblr app into my genymotion device, and I was totally shocked by its amazing snake-menu animation which is quite smooth and fluent. Since I cannot clearly describe its visual effects, you’d better install this app and try it yourself.

Ok, I am always the one who would like to imitate beautiful things. And I was terribly curious about how its animation is implemented.
captured images

implement principle
So, at the first sight, do you have any idea about how this animation appears?

As you know, there are 6 imageviews: P1, P2, P3, P4, P5, P6, and P6 is the top-most imageview which is enabled to be dragged. You can easily figure it out that: P1 follows P2, P2 follows P3, P3 follows P4, P4 follows P5, P5 follows P6.

First of all, I used ViewDragHelper to make P6 draggable.

Then, ViewDragHelper.CallBack can tell us some information about P6’s status, such as dragging, released, and P6’s position change and so on. To lighten the parent ViewGroup’s job, I create a ViewTrackController to process P6’s status.

Afterwards, ViewTrackController is responsible for dealing with all the linkage animations: every time P6’s position changes, causes P5’s target position changes. Every time P5’s position change causes P4’s target position changes. The rest imageviews can be done in the same manner.

To make the animation pleasing to the eyes, facebook’s rebound sdk encounters with ViewTrackController. While reviewing the source code, you will find that each imageview has a SpringListener and a fllower-SpringListener. Obviously, P6’s follower is P5, P5’s follower is P4, P4’s follower is P3, etc… P6’s position change will notify P5’s follower-SpringListener, P5’s position change will notify P4’s follower-SpringListener, etc… That’s to say, P6’s position change leads the rest imageviews animate automatically.

Finally, the animated snake-menu is implemented by this way.

contact me
The source code is easy to read. If you have any problems or advice, please leave me a message on the issues, or contact my email: 120809170@qq.com. Besides, welcome for pull requests.

demo apk download
apk download (right in this github repository)

Version: 1.0
  • Pilot version

相关源码推荐:

我来说两句
所有评论(19)
li229565 2016-3-23 16:29:39
正需要啊,感谢楼主无私分享!
回复
xingliangzheng 2016-3-24 08:20:02
学习学习!
回复
seaard 2016-3-24 08:24:02
正需要啊,感谢楼主无私分享!
回复
18380448164 2016-3-24 10:15:20
楼主用心了,内容非常精彩。
回复
嘘丶~低调 2016-3-24 11:57:02
楼主 真帅!!
回复
嘘丶~低调 2016-3-24 11:57:39
楼主用心了,内容非常精彩。
回复
去问问 2016-3-24 14:28:49
66666666
回复
123下一页
提取码:  下载次数:26 状态:已购或VIP 售价:10(原价:10)金钱 下载权限:初级码农 
1788 0 26
代码贡献英雄榜
用户名 下载数
联系我们
首页/微信公众账号投稿
帖子代码编辑/版权问题
QQ:435399051,1294855032
如何获得代码达人称号?
如何成为签约作者?
领先的中文移动开发者社区
18620764416
7*24全天服务
意见反馈:1294855032@qq.com

扫一扫关注我们

Powered by Discuz! X3.2© 2001-2019 Comsenz Inc.( 粤ICP备15117877号 )