Android锁屏动画实现,Pixate模拟“Android Lollipop的锁屏界面”制作思路分享

d29828f2266bd31b4fafc3ffd34dbc99.png

9c94d906987a4ca7806181bd17ab0279.png

因为不知何故,PS里导出的gif动画比实际播放的速度要慢一点。特别是在电话/拍照快捷键的收起动画显得有些慢。实际效果是正常的。

制作时也力求尽可能的与原生的Android Lollipop的锁屏界面的交互和动画属性逻辑相符。但由于本人技术方面和Pixate本身的限制,无法做出全部百分百的锁屏功能界面。

此案例中主要实现且重点实现思路:

1. 点击屏幕,通知条有动画弹动。并在动画结束后才可以点击电话,相机等快捷方式。但在播放弹动动画时可以随时上滑进入图形解锁界面。

2. 点击电话、相机的快捷按键需要播放完动画效果后才能进行另一个/同一个快捷键的再次点击,但同时准许直接上滑进入图形解锁界面。

制作要点:

1. 点击屏幕,通知条自动上滑后回到原始位置。且下拉无list的弹簧属性效果。

2.点击屏幕播放通知条相应动画时,亦能同时触发上滑通知条动作。

3. 点击电话相机快捷键,播放相应动画时不能重复点击触发。

制作思路:

1. 利用iOS中list本身带有的弹簧效果里实现建立一个“幽灵”list去对应通知条的滚动。新建一个可以scroll的空内容List。内容长度只需要比手机画布尺寸多出0.5,即可实现list的滚动。

特别说明:

因为通知条对应的逻辑动作比较复杂。不仅需要随手势滑动的list属性,又需要在点击屏幕和未滑动到制定位置后再次回到起始位置。所以不能单纯的给通知条赋予scroll属性。因为scroll list里的内容目前是无法做到强制定位的。也就是你无法控制通知条的位置自动回到初始状态。所以此实例仅能利用在iOS设备和模拟器中实现,而Android本身list不具有弹簧效果,故此案例无法正常运行在Android的设备上。

2. 因为点击事件与scroll滑动不可在一个list上同时触发。则需要在“幽灵”list上再分别拆成仅仅具有scroll和同时具有Tap和scroll功能的两个“幽灵list”。通过触发tap事件后将仅有scroll事件的“幽灵list”置前,来达到点击后亦可立即上滑的效果。

3. 避免在播放电话/相机快捷动画时多次触发它。需要先设置一个触控区域,并在触发此控制区域同时将其置底,当动画播放完毕后再将此设置回原来的层级关系即可。

图层分组参考:

40d0e8159c72746b5d5cd9a5fde0bde9.png

展开全部图层参考:

25a6cea141e797bdfffbcd6ea400b23c.png

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值