自己写一个UISwitch

最近应用中需要添加用户头像的显示功能,突发奇想加入了滑动头像注销当前用户的功能,实现后的效果如下图:

1、滑动前的状态


2、滑动后的状态


【需求】:从左向右的滑动过程中用户信息逐渐隐藏,松手注销用户的信息逐渐显现,当手指松开的位置是开关的最右端位置时弹出注销提示,否则头像向左回弹到初始位置。

【思路】:拿到这个需求之后,大致将问题划分为以下三个子问题:
1、头像的跟踪手指滑动。
2、用户信息文字与松手注销用户提示文字的切换。
3、头像的回弹动画。

针对第一个问题想到最简单就是用UIPanGestureRecognizer,通过获取滑动过程中UIPanGestureRecognizer的state和头像view的中心center.x的具体位移来判断头像的移动状态,做出相应的响应。
针对第二个问题想到只要获取到头像当前位置距初始位置的移动位移与轨道总长度的占比,然后根据这个值动态设置提示文字与用户信息文字UILabel的alpha值就可以实现了。
针对第三个问题在UIPanGestureRecognizer的state为UIGestureRecognizerStateEnded(松开手指状态)的时候,判断一下头像的当前位置状态,如果没有导到最右端,添加一个由当前位置到初始位置的平移动画就OK了。

【细节】:
setExclusiveTouch,避免滑动的时候点击到其它按钮造成动画的停顿。

发布了31 篇原创文章 · 获赞 4 · 访问量 10万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章