SVProgressHUD源码解读(2.0.3)

SVProgressHUDiOS开发中比较常用的一个三方库,用来在执行耗时操作或者指示用户操作结果的场合,由于使用简单,功能丰富,交互友好,被广泛应用。本文从源码的角度,解读一下实现的过程,希望能起到抛砖引玉的作用。

一. 效果预览

1. SVPIndefiniteAnimatedView


无限循环

2. SVProgressAnimatedView


单次滚动

3. SVRadialGradientLayer


渐变视图

二. 类分析

1. SVProgressHUD

这是SVProgressHUD显示提示框的类,提供类方法和属性来进行不同的设置。

** HUD提示框背景

** 遮罩层背景

** 无限循环的显示类型

**常用属性介绍

hud最小尺寸,默认是(100,100)

@property (assign, nonatomic) CGSize minimumSize UI_APPEARANCE_SELECTOR;

圆环厚度,默认是2px

@property (assign, nonatomic) CGFloat ringThickness UI_APPEARANCE_SELECTOR;

圆环半径,默认是18px

@property (assign, nonatomic) CGFloat ringRadius UI_APPEARANCE_SELECTOR;

提示语字体,默认是14px

@property (strong, nonatomic) UIFont *font UI_APPEARANCE_SELECTOR;

Image提示框显示时间,默认是5s

@property (assign, nonatomic) NSTimeInterval minimumDismissTimeInterval;

** 常用方法介绍

  • 无限循环状态显示,不会自动小时,需主动调用dismiss方法

  • 进度条状态显示

  • 图片状态显示

  • hud距离中心点的偏移量

** 通知

通过监听不同的通知事件,可以获取hud的状态

** hud显示流程

SVProgressHUD采用单例模式,简化代码维护;同时,根据SVProgressHUD的层级结构可以看出,从底层到顶层依次是:UIControl (overlayView) -> SVProgressHUD -> UIView (hudView) -> UIVisualEffectView -> AnimatedView (具体动画视图) 。

  • -(void)showStatus:(NSString*)status, 这是显示无限循环状态的提示框,可以添加文字进一步详细补充。其中,SVProgressHUD采用图形和文字分离的模式,方面文字视图的复用。所有,显示文字的视图,最终都会调用下面的方法。

  • -(void)showProgress:(float)progress status:(NSString*)status,这是显示单次滚动效果的提示框,每次显示视图前,都会取消其它视图,防止上次显示不同视图产生的干扰。其中,在设置strokeEnd时,使用事物类CATransaction,确保操作不被干扰。

  • -(void)showImage:(UIImage*)image status:(NSString*)status duration:(NSTimeInterval)duration,这是显示带Image的提示框,自带info/success/error三种类型,也可以自定义图片。

**其它方法

  • 设置hud位置的方法

- (void)positionHUD:(NSNotification*)notification

  • 调整hud尺寸的方法

- (void)updateHUDFrame

  • 更新模糊背景视图的方法

- (void)updateBlurBounds

2. SVPIndefiniteAnimatedView 类

这个类提供了一个无线旋转的动画,实现方法是把一个颜色渐变的图片旋转,然后利用UIBezierPath/CAShapeLayer/Mask等遮住不需要的部分,最后利用CABasicAnimation设置无限旋转动画。其中,核心部分是利用layermask属性实现遮罩功能,而mask的实现方法是显示显示bounds的非透明部分,实例图如下:


mask效果

3. SVProgressAnimatedView 类

这个类提供一个画圆环的视图,通过不断改变layerstrokeEnd的值,实现了进度的显示。顺便提一下,storkeStart使用的默认值是0, 所以是从正上方开始的。

4. SVRadialGradientLayer 类

这个类继承自CALayer,通过CGContextDrawRadialGradient来画渐变颜色层;其中,CoreFoundation中通过create创建的需要用release释放,否则会造成内存泄漏。

至此,SVProgressHUD分析暂告一段落,分析的不全面的地方,欢迎交流。


###参考资料

https://github.com/SVProgressHUD/SVProgressHUD

http://www.jianshu.com/p/a08d4597cf24

感觉不错,打个赏?
微信                                 支付宝
pay_weixin            pay_zhifubao
金额随意 快来“”我呀~
联系方式:kelvin@fishbay.cn

发表评论

电子邮件地址不会被公开。 必填项已用*标注