[心得] 这两天摸索与实作 HUD

楼主: Linux (Windows)   2015-07-09 23:33:25
Hi (), 我又来分享文章啦~
这几天再研究一种东西,一开始我还不知道怎去下关键字 Google..
不过找著找著 渐渐有方向了!
因为看到很多 GitHub 上的专案都写 HUD
所以就找了一些范例,以及 Google 找资料乱写乱测
然后有了一点点心得,就来分享一下,如果有观念不正确请大大们指教~
GitHub:
https://github.com/comdan66/OAHUD
Demo GIF:
https://github.com/comdan66/OAHUD/raw/master/OAHUD.gif
简略讲解一下~
首先我看了 MBProgressHUD 的做法,其中的 showHUDAddedTo:(UIView *)view
让我也模仿著做,于是我做了一个类似的 show,然后加在该 view 之下,
一开始还做得很开心,当我用 TabBarController、NavigationController 时
发现,只有中间的 view 区段被覆蓋,当中的 NavBar 跟 TabBar 都没有被覆蓋到
于是我只好换个方向XD
接着我 Google 到了这篇文章
http://nobodyyu.github.io/2015/05/04/make-HUD-by-your-self/
我于似乎看到了关键字 window,所以接着开始研究 UIWindow
然后开始使用 UIWindow 然后加入 ViewController 实验!
当中当然一直失败啊,直到我看到了 DaiInboxHUD 这个专案
https://github.com/DaidoujiChen/DaiInboxHUD
恩.. 很多看不懂XD,不过今天下午还是抽空把它嗑了!
因为这包 Code 我看到了很多用法,其中像是
objc/runtime.h、objc_setAssociatedObject、objc_getAssociatedObject
虽然我还没有很熟,所以有使用错误的话.. 请跟我说..
里面像是弹出的动画,也参考了它!
原本我打算找寻是否有像 css 中的 transition 搭配 cubic-bezier 的方法
但是一直没找到QQ
所以跳出的效果,我就暂时的学别人的方法
使用大量的 animateWithDuration 以及 CGAffineTransformScale
看到这样的写法,让我不禁回想起 jQuery 的 animate 搭配 callback 一起使用XD
不过使用起来没有想像中的顿,于是先这样使用啦!
中间旋转的部分,使用两张 view
第一层的 view 加上 CAGradientLayer 的彩色图层
以及 CABasicAnimation 来达到选转效果~
然后第二层的 view 使用与底层一样的颜色,并且缩小一点点将第一层盖住
这样就可以做出类似旋转的彩色圈圈!
以上是我一点点的心得分享..
我还很菜.. 应该有一堆都是不当使用 >"<
如有观念上或者写法上错误的话,欢迎各位大大指正!
作者: kaufmann (抓住虚幻的尾巴)   2015-07-09 23:43:00
谢谢分享
作者: Daidouji (Daidouji)   2015-07-10 00:23:00
O3<
楼主: Linux (Windows)   2015-07-10 00:47:00
楼上神人大大,快拜!!(已跪
作者: Daidouji (Daidouji)   2015-07-10 10:11:00
O3O 版上有很多更厉害的人
作者: sghergee (=])   2015-07-11 19:36:00
感谢分享
作者: ckvir (ckvir)   2015-07-31 17:16:00
帮之前要先缴7500

Links booklink

Contact Us: admin [ a t ] ucptt.com