微信高仿导航页开门动画
微信导航页的“开门”动效,做得还挺有意思的。左一扇,右一扇,一点开就像门被推开一样,UI 上确实加分不少。
这个亲,微信高仿导航页开门效果.zip
里头,源码挺完整的,适合你直接跑一跑、改一改,看看里面动画是怎么的。核心用的是ObjectAnimator,再配上AnimatorSet来控制左右两扇“门”的开合。
动画部分设置也不复杂,主要就是设置translationX的起止值,再加个Interpolator来调节节奏,比如匀速、加速、减速这些。你也可以玩点花样,比如加个透明度变化或者缩放效果,整个感觉就更立体了。
布局方面,推荐用ConstraintLayout,比较灵活。左门右门用两个View
或ImageView
分开,方便动画控制。如果你项目用的是RelativeLayout
也行,照样能跑。
想让动画响应更顺一点?那就得加个点击事件监听,比如OnClickListener
,用户一点就触发动画,体验自然。别忘了动画结束后的状态恢复,不然用户下一次点的时候会出 Bug。
另外,老设备上性能差点的,动画容易卡。建议开硬件加速,或者少做点复杂动画,用户体验能上一个台阶。适配方面,也别偷懒,试试在不同屏幕上跑一下。
压缩包里还有个项目.rar
,讲得挺细,有项目结构、关键类解释,还有注释。新手看这个也能学到不少动画基础。
如果你在做类似启动页、导航页动画,不妨参考一下。如果刚好是仿微信项目,那更合适了,直接套进来省不少事。
3.6MB
文件大小:
评论区