iOS开发之MBProgressHUD的使用

本是古典何须时尚 2022-05-27 00:42 555阅读 0赞

MBProgressHUD是iOS中的一个第三方库，主要是在界面上显示一个加载的进度框或者提示框，如下图所示：

![Center][]              ![Center 1][]

下面就记录一下使用MBProgressHUD的方法：

1、导入MBProgressHUD到项目中

这里使用cocoapods导入，Podfile文件的内容如下：

![Center 2][]

如果不清楚MBProgressHUD的版本是多少，可以在终端下执行pod search MBProgressHUD命令，即可显示出当前的MBProgressHUD的最新版本，如下图所示：

![Center 3][]

2、在代码中使用MBProgressHUD

首先在头文件中声明一个MBProgressHUD变量，需要引入相应的头文件，ViewController.h文件的代码如下：

\[objc\]  [view plain][]  [copy][view plain]

1.  \#import "ViewController.h"  
2.    
3.  @interface ViewController ()  
4.    
5.  @end  
6.    
7.  @implementation ViewController  
8.    
9.  \- (void)viewDidLoad \{  
10.     \[super viewDidLoad\];  
11.     //初始化MBProgressHUD  
12.     self.progressHUD = \[\[MBProgressHUD alloc\] initWithView:self.view\];  
13. //    self.progressHUD.mode = MBProgressHUDModeIndeterminate;  
14.     self.progressHUD.progress = 0.4;  
15.     //添加ProgressHUD到界面中  
16.     \[self.view addSubview:self.progressHUD\];  
17. \}  
18.   
19. \#pragma mark - 显示进度框  
20. \-(void)showProgress:(id)sender \{  
21.     self.progressHUD.dimBackground = NO; //设置有遮罩  
22.     self.progressHUD.labelText = @"加载中..."; //设置进度框中的提示文字  
23.     \[self.progressHUD show:YES\]; //显示进度框  
24. \}  
25.   
26. \- (void)didReceiveMemoryWarning \{  
27.     \[super didReceiveMemoryWarning\];  
28.     // Dispose of any resources that can be recreated.  
29. \}  
30.   
31. @end

其中，MBProgressHUD有一些配置项，下面分别说明：

（1）self.progressHUD.dimBackground配置项。该项主要配置对话框是否有遮罩，取值为YES  /   NO，下面两张图是该配置项的区别：

![Center 4][]        ![Center 5][]

（2）self.progressHUD.mode配置项。该配置项有6种不同的取值，分别对应6中不同形状的进度框，取值有下面6种：

\[objc\]  [view plain][]  [copy][view plain]

1.  typedef NS\_ENUM(NSInteger, MBProgressHUDMode) \{  
2.      /\*\* Progress is shown using an UIActivityIndicatorView. This is the default. \*/  
3.      MBProgressHUDModeIndeterminate,  
4.      /\*\* Progress is shown using a round, pie-chart like, progress view. \*/  
5.      MBProgressHUDModeDeterminate,  
6.      /\*\* Progress is shown using a horizontal progress bar \*/  
7.      MBProgressHUDModeDeterminateHorizontalBar,  
8.      /\*\* Progress is shown using a ring-shaped progress view. \*/  
9.      MBProgressHUDModeAnnularDeterminate,  
10.     /\*\* Shows a custom view \*/  
11.     MBProgressHUDModeCustomView,  
12.     /\*\* Shows only labels \*/  
13.     MBProgressHUDModeText  
14. \};

对应的进度框如下图所示：

![Center 6][]      ![Center 7][]

![Center 8][]       ![Center 9][]

![Center 10][]

还有一种mode为MBProgressHUDModeCustomView，即自定义的View。

隐藏进度框需要调用下面的方法：

\[objc\]  [view plain][]  [copy][view plain]

1.  \[self.progressHUD hide:YES\];  
2.  \[self.progressHUD hide:YES afterDelay:5\];

其中第一个方法是立即隐藏进度框，第二个方法是延迟5秒再隐藏进度框。

3、self.progressHUD.progress属性。该属性配置的是进度框中显示的进度，取值为0-1

[Center]: https://img-blog.csdn.net/20160414171511787?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 1]: /images/20220527/898f641dd834457c8932a3a544fc00cc.png
[Center 2]: /images/20220527/504d01e467f14196b06c1d2f7a174cf2.png
[Center 3]: /images/20220527/ef75bdc871874bafab1376858b681cfb.png
[view plain]: https://blog.csdn.net/yubo_725/article/details/51153178#
[Center 4]: https://img-blog.csdn.net/20160414172733927?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 5]: /images/20220527/ab8eaa4e01ac49c2816e681abbefe1b2.png
[Center 6]: https://img-blog.csdn.net/20160414173357404?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 7]: /images/20220527/f0d78988375d42678a83632ac20edebb.png
[Center 8]: https://img-blog.csdn.net/20160414173414654?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 9]: /images/20220527/d9e31e1baa754ab5beb20be2f8be80f1.png
[Center 10]: /images/20220527/d3e40095176043e3b10fb2fb3252abcf.png