IOS MBProgressHUD

MBProgressHUD是一个显示HUD窗口的第三方SDK。该SDK既可以用于给用户展示提示信息，也可以用于执行后台任务时，在程序中前台显示一个进度视图。

MBProgressHUD简介

在使用MBProgressHUD之前，我们先来了解一下MBProgressHUD的基本组成。一个MBProgressHUD视图主要由四个部分组成：

• loading动画视图：loading的样式，可以是菊花、圆环、水平进度条，也可以是我们自定义的视图。
• 标题文本框：主要用于显示提示信息。这个文本框是可选的，通常位于loading动画视图的下面，且它是单行显示的。
• 详情文本框：如果有更多信息需要显示，就可以将详细信息放在这里显示。
• HUD背景框：主要是用来突出上面三部分。

MBProgressHUD的安装方法

• 在工程的Podfile中，添加MBProgressHUD的配置。

pod 'MBProgressHUD', '~> 1.0.0'

在终端运行pod install

cd [工程所在目录]
pod install

• 在需要使用MBProgressHUD的类中，导入MBProgressHUD的头文件。

#import <MBProgressHUD.h>

MBProgressHUD常用属性与方法

MBProgressHUD使用起来十分简单，只需要掌握如下一些核心属性以及方法即可。

实例化一个MBProgressHUD对象。实例化该对象后，会直接显示在指定的view上。

+ (instancetype)showHUDAddedTo:(UIView *)view animated:(BOOL)animated;

隐藏一个MBProgressHUD对象

- (void)hideAnimated:(BOOL)animated;

整体的显示样式。

@property (assign, nonatomic) MBProgressHUDMode mode;

其中，MBProgressHUDMode包括了如下6种可选样式。

typedef NS_ENUM(NSInteger, MBProgressHUDMode) {
    MBProgressHUDModeIndeterminate,// 使用一个菊花图来显示进度，这是默认值
    MBProgressHUDModeDeterminate,//使用深色圆环作为进度视图
    MBProgressHUDModeDeterminateHorizontalBar,// 使用一个水平进度条
    MBProgressHUDModeAnnularDeterminate,// 使用浅色圆环作为进度视图
    MBProgressHUDModeCustomView, // 显示一个自定义视图
    MBProgressHUDModeText // 只显示文本
};

标题文本框属性。可以通过设置其text属性来设置标题文本框的文字。

@property (strong, nonatomic, readonly) UILabel *label;

详情文本框。可以通过设置其text属性来设置详情文本框的文字。

@property (strong, nonatomic, readonly) UILabel *detailsLabel;

设置HUD显示和隐藏的动画类型。

@property (assign, nonatomic) MBProgressHUDAnimation animationType;

其中，MBProgressHUDAnimation类型包括如下的可选值。

typedef NS_ENUM(NSInteger, MBProgressHUDAnimation) {
    MBProgressHUDAnimationFade,//HUD逐渐显现之后逐渐隐藏
    MBProgressHUDAnimationZoom,//HUD出现时逐渐放大，隐藏时逐渐缩小。
    MBProgressHUDAnimationZoomOut,//HUD逐渐显现，隐藏时逐渐缩小
    MBProgressHUDAnimationZoomIn//HUD逐渐显现，隐藏时逐渐放大
};

举例

• MBProgressHUDModeIndeterminate**样式

- (IBAction)indeterminateMode:(id)sender {
    MBProgressHUD *hud = [MBProgressHUD showHUDAddedTo:self.view animated:YES];
    hud.bezelView.color = [UIColor greenColor];
    hud.bezelView.alpha = 0.5;
    hud.label.text = @"绿色的bezelView";
    //显示3秒后隐藏
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(3.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        [hud hideAnimated:YES];
    });
}

• MBProgressHUDModeDeterminate样式

- (IBAction)determinateMode:(id)sender {
    MBProgressHUD *hud = [MBProgressHUD showHUDAddedTo:self.view animated:YES];
    hud.mode = MBProgressHUDModeDeterminate;
    hud.label.text = @"正在加载...";
    hud.detailsLabel.textColor = [UIColor redColor];
    hud.detailsLabel.text = @"红色的副标题";
    //显示3秒后隐藏
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(3.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        [hud hideAnimated:YES];
    });
}

• MBProgressHUDModeAnnularDeterminate样式

- (IBAction)annularDeterminateMode:(id)sender {
    MBProgressHUD *hud = [MBProgressHUD showHUDAddedTo:self.view animated:YES];
    hud.mode = MBProgressHUDModeAnnularDeterminate;
    hud.label.text = @"正在加载...";
    hud.detailsLabel.text = @"黄色的backgroundView";
    hud.backgroundView.backgroundColor = [UIColor yellowColor];
    //显示3秒后隐藏
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(3.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        [hud hideAnimated:YES];
    });
}

• MBProgressHUDModeDeterminateHorizontalBar样式

- (IBAction)determinateHorizontalBarMode:(id)sender {
    MBProgressHUD *hud = [MBProgressHUD showHUDAddedTo:self.view animated:YES];
    hud.mode = MBProgressHUDModeDeterminateHorizontalBar;
    hud.label.text = @"正在加载...";
    hud.detailsLabel.text = @"添加了一个按钮";
    NSProgress *progressObject = [NSProgress progressWithTotalUnitCount:100];
    hud.progressObject = progressObject;
    [hud.button setTitle:@"取消加载" forState:UIControlStateNormal];
    [hud.button addTarget:progressObject action:@selector(cancel) forControlEvents:UIControlEventTouchUpInside];
    hud.button.backgroundColor = [UIColor blueColor];
    //显示3秒后隐藏
    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(3.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        [hud hideAnimated:YES];
    });
}

• MBProgressHUDModeCustomView样式

- (IBAction)customViewMode:(id)sender {
    MBProgressHUD *hud = [MBProgressHUD showHUDAddedTo:self.view  animated:YES];
    hud.mode = MBProgressHUDModeCustomView;
    UIImage *image = [[UIImage imageNamed:@"99logo"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 50, 50)];
    imageView.image = image;
    hud.customView = imageView;
    hud.label.text = @"1";
    hud.detailsLabel.text = @"苹果iOS开发进阶之路";
    [hud hideAnimated:YES afterDelay:3.f];
}

代码

https://github.com/ShaeZhuJiu/MBProgressHUD_base.git