iOS猿媛圈iOS Developer闻道丶iOS(尝鲜版)

iOS-SVProgressHUD进度框

2017-03-19  本文已影响588人  FlyElephant

iOS项目开发中SVProgressHUD出现的场景比较高频,上手快,使用简单方便,Show和Dismiss基本上解决了绝大多数的问题.

FlyElephant.png

官方Demo中有三个重要的设置选项,弹出框背景色(Style),动画类型(AnimationType)及遮罩层颜色(MaskType).
<pre><code>`typedef NS_ENUM(NSInteger, SVProgressHUDStyle) {
SVProgressHUDStyleLight, // default style, white HUD with black text, HUD background will be blurred on iOS 8 and above
SVProgressHUDStyleDark, // black HUD and white text, HUD background will be blurred on iOS 8 and above
SVProgressHUDStyleCustom // uses the fore- and background color properties
};

typedef NS_ENUM(NSUInteger, SVProgressHUDMaskType) {
SVProgressHUDMaskTypeNone = 1, // default mask type, allow user interactions while HUD is displayed
SVProgressHUDMaskTypeClear, // don't allow user interactions
SVProgressHUDMaskTypeBlack, // don't allow user interactions and dim the UI in the back of the HUD, as on iOS 7 and above
SVProgressHUDMaskTypeGradient, // don't allow user interactions and dim the UI with a a-la UIAlertView background gradient, as on iOS 6
SVProgressHUDMaskTypeCustom // don't allow user interactions and dim the UI in the back of the HUD with a custom color
};

typedef NS_ENUM(NSUInteger, SVProgressHUDAnimationType) {
SVProgressHUDAnimationTypeFlat, // default animation type, custom flat animation (indefinite animated ring)
SVProgressHUDAnimationTypeNative // iOS native UIActivityIndicatorView
};`</code></pre>

背景色和动画类型设置:
<pre><code> [SVProgressHUD setDefaultStyle:SVProgressHUDStyleDark]; [SVProgressHUD setDefaultAnimationType:SVProgressHUDAnimationTypeFlat];</code></pre>

SVProgressHUDMaskType中默认设置的SVProgressHUDMaskTypeNone用户是可以通过遮罩层对视图中的其他进行点击操作的,剩余的四种类型都是不允许进行其他操作.
SVProgressHUDMaskTypeCustom允许用户自定义显示遮罩层的背景颜色:
<pre><code>[SVProgressHUD setBackgroundLayerColor:[[UIColor redColor] colorWithAlphaComponent:0.4]]; [SVProgressHUD setDefaultMaskType:SVProgressHUDMaskTypeCustom];</code></pre>

SVProgressHUD显示的Show方法:
<pre><code>`+ (void)show;

// stops the activity indicator, shows a glyph + status, and dismisses the HUD a little bit later

// shows a image + status, use 28x28 white PNGs

如果项目中发现SVProgressHUD默认的图片不满足需求,可以通过ShowImage自定义图片实现:
<pre><code>`// shows a image + status, use 28x28 white PNGs

关于弹出框背景颜色,文字颜色,字体大小,偏移量都可以自定义设置:
<pre><code>`+ (void)setDefaultStyle:(SVProgressHUDStyle)style; // default is SVProgressHUDStyleLight

SVProgressHUD实现原理也不难,主要通过单例实现:
<pre><code>`+ (SVProgressHUD*)sharedView {
static dispatch_once_t once;

static SVProgressHUD *sharedView;

if !defined(SV_APP_EXTENSIONS)

dispatch_once(&once, ^{ sharedView = [[self alloc] initWithFrame:[[[UIApplication sharedApplication] delegate] window].bounds]; });

else

dispatch_once(&once, ^{ sharedView = [[self alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; });

endif

return sharedView;

}`</code></pre>

通常主线程更新UI的方法如下:
<pre><code>` dispatch_async(dispatch_get_main_queue(), ^{

});`</code></pre>

SVProgressHUD中的的更新方法如下:
<pre><code>`- (void)showImage:(UIImage)image status:(NSString)status duration:(NSTimeInterval)duration {
__weak SVProgressHUD *weakSelf = self;
[[NSOperationQueue mainQueue] addOperationWithBlock:^{
__strong SVProgressHUD *strongSelf = weakSelf;
if(strongSelf){
// Update / Check view hierarchy to ensure the HUD is visible
[strongSelf updateViewHierarchy];

        // Reset progress and cancel any running animation
        strongSelf.progress = SVProgressHUDUndefinedProgress;
        [strongSelf cancelRingLayerAnimation];
        [strongSelf cancelIndefiniteAnimatedViewAnimation];
        
        // Update imageView
        UIColor *tintColor = strongSelf.foregroundColorForStyle;
        UIImage *tintedImage = image;
        if (image.renderingMode != UIImageRenderingModeAlwaysTemplate) {
            tintedImage = [image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
        }
        strongSelf.imageView.tintColor = tintColor;
        strongSelf.imageView.image = tintedImage;
        strongSelf.imageView.hidden = NO;
        
        // Update text
        strongSelf.statusLabel.text = status;
        
        // Show
        [strongSelf showStatus:status];
        
        // An image will dismissed automatically. Therefore we start a timer
        // which then will call dismiss after the predefined duration
        strongSelf.fadeOutTimer = [NSTimer timerWithTimeInterval:duration target:strongSelf selector:@selector(dismiss) userInfo:nil repeats:NO];
        [[NSRunLoop mainRunLoop] addTimer:strongSelf.fadeOutTimer forMode:NSRunLoopCommonModes];
    }
}];

}`</code></pre>

SVProgressHUD消失除了常用的dismiss方法,还有popActivity,实现代码:
<pre><code>+ (void)popActivity { if([self sharedView].activityCount > 0) { [self sharedView].activityCount--; } if([self sharedView].activityCount == 0) { [[self sharedView] dismiss]; } }</code></pre>

SVProgressHUD内部定义几种常用的视图出现,点击,消失的通知事件:
<pre><code>extern NSString * const SVProgressHUDDidReceiveTouchEventNotification; extern NSString * const SVProgressHUDDidTouchDownInsideNotification; extern NSString * const SVProgressHUDWillDisappearNotification; extern NSString * const SVProgressHUDDidDisappearNotification; extern NSString * const SVProgressHUDWillAppearNotification; extern NSString * const SVProgressHUDDidAppearNotification;</code></pre>

SVProgressHUD中的几种动画效果有单独的文件,有兴趣的可以自己看一下,关于SVProgressHUD的常用时间进行了一下梳理,如有遗漏,欢迎指教~

上一篇下一篇

猜你喜欢

热点阅读