基于第三方的MBProgressHUDExtend自定义加载动画

项目提出一个需求：等待加载数据时用动画效果显示。
图片会有两种情况， 第一种是设计师给你多张静态图，自己实现动画效果。第二种是设计师给了你一个GIF图。
当然给你一个GIF效果图更好实现，但是我们公司给的是多张静态图，下面我分别实现静态图动画和GIF动画。
如果给了多张静态的可以用UIImageView实现动画效果
效果这样的：
(原谅公司的设计不是科班出身，暂时这样看吧)

loading.gif
好了，知道效果是这样的，那么来看怎么实现。

静态图实现加载动画效果

1.创建Category文件继承自MBProgressHUD，如图：

image.png

2.在创建的文件.h中增加一个类方法，比如这样：

image.png

3.在创建的文件.m中实现，比如这样：

image.png

如何使用呢？
在请求数据的地方这样调用：

image.png

在请求完成或者请求失败的时候给隐藏掉，这样：

image.png

下面放下代码：
.h文件：

/** 自定义加载动画 手动消失：文字和动画 */
+(MBProgressHUD *)showText:(NSString *)textTip showGIFToView:(UIView *)view;

.m文件实现：

/** 自定义加载动画 手动消失：文字和动画(放到指定view中) */
+(MBProgressHUD *)showText:(NSString *)textTip showGIFToView:(UIView *)view {
    if (view == nil) {`
        view = [[UIApplication sharedApplication].windows firstObject];
    }
    // 如果之前有hud，先隐藏之前的hud
    [self hideHUDForView:view animated:NO];
   // 快速显示一个提示信息`
   MBProgressHUD *hud = [MBProgressHUD showHUDAddedTo:view animated:YES];
   // 设置模式
    hud.mode = MBProgressHUDModeCustomView;
    //使用gif图片
    NSMutableArray *imgArr = [NSMutableArray array];
    UIImage *img;
    for (int i = 1; i<11; i++) {
        img = [UIImage imageNamed:[NSString stringWithFormat:@"loading_00%d",i]];
        [imgArr addObject:img];
   }
    UIImageView *custImageV = [[UIImageView alloc] initWithImage:img];
    custImageV.animationImages = imgArr;
    custImageV.animationDuration = 0.5;
    custImageV.animationRepeatCount = 0;
    [custImageV startAnimating];
    hud.customView = custImageV;
    hud.detailsLabel.text = textTip;
    hud.detailsLabel.font = [UIFont systemFontOfSize:kTitleFontSize];
    hud.detailsLabel.textColor = [UIColor whiteColor];
    hud.minSize = CGSizeMake(90, 60);
    [hud.bezelView setStyle:MBProgressHUDBackgroundStyleSolidColor];
    [hud.bezelView setColor:[UIColor colorWithRed:0 green:0 blue:0 alpha:0.8f]];
    // 隐藏时候从父控件中移除
    hud.removeFromSuperViewOnHide = YES;
    return hud;
}

GIF图实现加载动画效果

使用GIF只需要改动.m文件中的代码就行。另外需要注意的是使用了SDWebImage这个第三方库，在创建的.m文件中引入#import "UIImage+GIF.h"这个头文件，这样：

image.png

代码如下：

/** 自定义加载动画 手动消失：文字和动画(放到指定view中) */
+(MBProgressHUD *)showText:(NSString *)textTip showGIFToView:(UIView *)view {
    if (view == nil) {
        view = [[UIApplication sharedApplication].windows firstObject];
    }
    // 如果之前有hud，先隐藏之前的hud
    [self hideHUDForView:view animated:NO];
    // 快速显示一个提示信息
    MBProgressHUD *hud = [MBProgressHUD showHUDAddedTo:view animated:YES];
    // 设置模式
    hud.mode = MBProgressHUDModeCustomView;
    //使用SDW 实现gif图片
        UIImage *image = [UIImage sd_animatedGIFNamed:@"logoLoad"];
   //自定义UIImageView
        UIImageView *custImageV = [[UIImageView alloc] initWithImage:image];
    hud.customView = custImageV;
    hud.detailsLabel.text = textTip;
    hud.detailsLabel.font = [UIFont systemFontOfSize:kTitleFontSize];
    hud.detailsLabel.textColor = [UIColor whiteColor];
    hud.minSize = CGSizeMake(90, 60);
    [hud.bezelView setStyle:MBProgressHUDBackgroundStyleSolidColor];
    [hud.bezelView setColor:[UIColor colorWithRed:0 green:0 blue:0 alpha:0.8f]];
    // 隐藏时候从父控件中移除
    hud.removeFromSuperViewOnHide = YES;
   return hud;
}

如有更好的方法可以一起讨论。互相学习。