提示框框架KVNProgress介绍

gitHub上面有很多显示加载进度的框架，这里我们介绍一下KVNProgress框架，KVNProgress是一个可以完全定制的HUD（指示器）,你可以设置加载进度的画面是否全屏，可以自己修改进度显示的风格，同时这个框架也支持在ipad上面使用，效果如下：

一、导入KVNProgress框架

• 在github上面下载框架，并将相关的文件夹引入到项目中

• 在工程中添加所需头文件

1. #import "KVNProgress.h"

二、关键属性及方法介绍

1. @property (nonatomic, getter = isFullScreen) BOOL fullScreen;//设置是否全屏显示
2. + (void)show; //显示提示框
3. + (void)showWithStatus:(NSString *)status; // 在图形的下方添加描述状态的文字
4. + (void)showProgress:(CGFloat)progress; // 用0-1表示进度加载的％0-％100
5. + (void)showProgress:(CGFloat)progress status:(NSString*)status; // 在显示进度的图形下面自定义一段文字
6. + (void)showSuccessWithStatus:(NSString *)status;//显示加载成功
7. + (void)showErrorWithStatus:(NSString *)status;//显示加载失败
8. + (void)dismiss;//移除提示框
9. + (void)updateStatus:(NSString*)status; //根据进度更新图形下方的文字
10. + (void)updateProgress:(CGFloat)progress animated:(BOOL)animated; //更新此时加载的进度
11. + (void)setConfiguration:(KVNProgressConfiguration *)newConfiguration;//设置进度视图的样式
12. + (instancetype)defaultConfiguration;//默认图形样式

三、使用场景1:基本使用

• 添加相关属性

1. #import "ViewController.h"
2. #import "KVNProgress.h"
3. @interface ViewController ()
4. //框架相关属性
5. @property (nonatomic) KVNProgressConfiguration *basicConfiguration;//显示进度的图形为基本样式
6. @property (nonatomic, strong) UIButton *basicBtn;//显示基本样式的按钮
7. @end

• 使用懒加载方式初始化用到的控件

1. - (UIButton *)basicBtn{
2. if (!_basicBtn) {
3. _basicBtn = [[UIButton alloc] initWithFrame:CGRectMake(119, 136, 137, 30)];
4. [_basicBtn setTitle:@"basic" forState:UIControlStateNormal];
5. _basicBtn.backgroundColor = [UIColor grayColor];
6. [_basicBtn addTarget:self action:@selector(basic) forControlEvents:UIControlEventTouchUpInside];
7. [self.view addSubview:_basicBtn];
8. }
9. return _basicBtn;
10. }
11. - (void)viewDidLoad {
12. [super viewDidLoad];
13. [self myWebView];
14. [self basicBtn];
15. //设置加载进度图形的样式为基本样式
16. [KVNProgress setConfiguration:self.basicConfiguration];
17. //设置基本样式为默认的样式
18. self.basicConfiguration = [KVNProgressConfiguration defaultConfiguration];
19. }

• 完成KVNProgress的相关设置

1. - (void) basic{
2. [KVNProgress show];
3. //延时1秒以后移除提示框
4. dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.0f * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
5. self.basicConfiguration.tapBlock = nil;
6. [KVNProgress dismiss];
7. });
8. }

四、使用场景2:加载成功与加载错误

当我们登陆成功或者登陆失败之后，经常出现一个相关的提示框，如下图：

• 添加相关属性

1. @property (nonatomic, strong) UIButton *successBtn;
2. @property (nonatomic, strong) UIButton *errorBtn;

• 使用懒加载方式初始化用到的控件

1. - (UIButton *)successBtn{
2. if (!_successBtn) {
3. _successBtn = [[UIButton alloc] initWithFrame:CGRectMake(119, 241, 137, 30)];
4. [_successBtn setTitle:@"success" forState:UIControlStateNormal];
5. _successBtn.backgroundColor = [UIColor grayColor];
6. [_successBtn addTarget:self action:@selector(success) forControlEvents:UIControlEventTouchUpInside];
7. [self.view addSubview:_successBtn];
8. }
9. return _successBtn;
10. }
11. - (UIButton *)errorBtn{
12. if (!_errorBtn) {
13. _errorBtn = [[UIButton alloc] initWithFrame:CGRectMake(119, 341, 137, 30)];
14. [_errorBtn setTitle:@"error" forState:UIControlStateNormal];
15. _errorBtn.backgroundColor = [UIColor grayColor];
16. [_errorBtn addTarget:self action:@selector(error) forControlEvents:UIControlEventTouchUpInside];
17. [self.view addSubview:_errorBtn];
18. }
19. return _errorBtn;
20. }

• 完成KVNProgress的相关设置

1. - (void) success{
2. [KVNProgress show];
3. dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(4.0f * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
4. self.basicConfiguration.tapBlock = nil;
5. //提示加载成功
6. [KVNProgress showSuccessWithStatus:@"Success"];
7. });
8. }
9. - (void) error{
10. [KVNProgress show];
11. dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(4.0f * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
12. self.basicConfiguration.tapBlock = nil;
13. //提示加载失败
14. [KVNProgress showErrorWithStatus:@"Error"];
15. });
16. }

五、使用场景3:复杂使用

在我们加载网页的时候，需要根据它的加载情况来改变提示框中的图形，如下图：

• 添加相关属性及其代理协议

1. @interface ViewController ()
2. @property (nonatomic, strong) UIButton *complexBtn;
3. @property (nonatomic, strong) UIWebView *myWebView;
4. @end

• 使用懒加载方式初始化用到的控件

1. - (UIButton *)complexBtn{
2. if (!_complexBtn) {
3. _complexBtn = [[UIButton alloc] initWithFrame:CGRectMake(119, 441, 137, 30)];
4. [_complexBtn setTitle:@"complex" forState:UIControlStateNormal];
5. _complexBtn.backgroundColor = [UIColor grayColor];
6. [_complexBtn addTarget:self action:@selector(complex) forControlEvents:UIControlEventTouchUpInside];
7. [self.view addSubview:_complexBtn];
8. }
9. return _complexBtn;
10. }
11.  
12. - (UIWebView *)myWebView{
14. if (!_myWebView) {
15. _myWebView = [[UIWebView alloc] initWithFrame:self.view.bounds];
16. NSURL *url = [NSURL URLWithString:@"http://www.hcios.com"];
17. NSURLRequest *myRequest = [NSURLRequest requestWithURL:url];
18. [_myWebView loadRequest:myRequest];
19. _myWebView.delegate = self;
20. [self.view addSubview:_myWebView];
21. }
22. return _myWebView;
23. }

• 完成KVNProgress的相关设置

1. - (void) complex{
2. //创建一个视图控制器用来显示webView
3. UIViewController *myController = [[UIViewController alloc] init];
4. //创建一个返回原来控制器的按钮
5. UIButton *backBtn = [[UIButton alloc] initWithFrame:CGRectMake(10,10, 50, 50)];
6. [backBtn setTitle:@"返回" forState:UIControlStateNormal];
7. backBtn.backgroundColor = [UIColor redColor];
8. [backBtn addTarget:self action:@selector(back) forControlEvents:UIControlEventTouchUpInside];
10. [self.myWebView addSubview:backBtn];
11. [myController.view addSubview: self.myWebView];
13. [self presentViewController:myController animated:YES completion:nil];
14. }
15. - (void) back{
16. [self dismissViewControllerAnimated:YES completion:nil];
17. }
18. //在webView开始加载时候调用的函数里面设置相应的加载动画
19. - (void)webViewDidStartLoad:(UIWebView *)webView{
20. //开始加载，文字可以自定义
21. [KVNProgress showProgress:0.0f
22. status:@"加载中"];
23. //延时0.2秒以后更新进度条显示加载到％50的位置
24. dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.2 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
25. [KVNProgress updateProgress:0.5f
26. animated:YES];
27. });
28. //延时0.5秒以后修改图形下方的文字
29. dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
30. [KVNProgress updateStatus:@"请耐心等待"];
31. });
32. }
33. //当webView加载完毕以后调用
34. - (void)webViewDidFinishLoad:(UIWebView *)webView{
35. //加载进度条显示加载完毕
36. [KVNProgress updateProgress:1.0f
37. animated:YES];
38. //延时0.1秒以后隐藏加载进度的图形
39. dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
40. [KVNProgress dismiss];
41. });
42. }

六、KVNProgress和示例代码下载

 KVNProgress框架

KVNProgress