MBProgressHUD详解(一)

MBProgressHUD详解(一)

MBProgressHUD是一个显示HUD窗口的第三方类库,源码点击这里
它主要用于在执行一些后台任务时,在程序中显示一个表示进度的loading视图和两个可选的文本提示的HUD窗口。大多时候用在加载网络数据的时候,这个库几乎成为APP的标配,试问有那个APP没有网络通信,没有网络交互。按照github上的实例说明,基本都够用了。本文主要是作为学习笔记,从源码层面分析一下这个库的实现,就源码来说,就两个文件一个头文件(MBProgressHUD.h),一个实现文件(MBProgressHUD.m),库本身并没有用到什么高深的技术,简单既是美!很适合初学者学习。
</br>我们先看一下头文件的内容

MBProgressHUD.h

前一段代码MBProgressHUD定义了一些HUD所需的枚举,具体的信息可以看一下注释,就不多做介绍了,下面主要部分也是主要以代码注释说明为主

//MBProgressHUD进度条的模式,即样式
typedef NS_ENUM(NSInteger, MBProgressHUDMode) {
    /// UIActivityIndicatorView.  
    //默认使用UIActivityIndicatorView来显示进度,由系统提供
    MBProgressHUDModeIndeterminate,
    /// A round, pie-chart like, progress view. 
    //圆形饼图进度视图
    MBProgressHUDModeDeterminate,
    /// Horizontal progress bar. 
    //水平进度条
    MBProgressHUDModeDeterminateHorizontalBar,
    /// Ring-shaped progress view.
    //圆环进度条
    MBProgressHUDModeAnnularDeterminate,
    /// Shows a custom view.
    //自定义视图,可以自定义提示图
    MBProgressHUDModeCustomView,
    /// Shows only labels.
    //只显示文本
    MBProgressHUDModeText
};
//MBProgressHUD进度条的动画效果
typedef NS_ENUM(NSInteger, MBProgressHUDAnimation) {
    /// Opacity animation
    //不透明
    MBProgressHUDAnimationFade,
    /// Opacity + scale animation (zoom in when appearing zoom out when disappearing)
    //出现和消失时,透明变化
    MBProgressHUDAnimationZoom,
    /// Opacity + scale animation (zoom out style)
    //消失时透明效果变化
    MBProgressHUDAnimationZoomOut,
    /// Opacity + scale animation (zoom in style)
    //出现时透明效果变化
    MBProgressHUDAnimationZoomIn
};
//MBProgressHUD进度条的背景样式
typedef NS_ENUM(NSInteger, MBProgressHUDBackgroundStyle) {
    MBProgressHUDBackgroundStyleSolidColor,
    MBProgressHUDBackgroundStyleBlur
};

</br></br>
接下来我们看一下MBProgressHUD提供的一些属性和函数,同样以代码注释说明为主

@interface MBProgressHUD : UIView
//创建一个新的HUD,并把它显示在view之上,还可以设置是否以动画的形式,此外,该函数返回一个HUD的对象
//默认removeFromSuperViewOnHide属性为YES
+ (instancetype)showHUDAddedTo:(UIView *)view animated:(BOOL)animated;

//找到最上层的HUD subview 并把它隐藏,成功为YES、其他情况为NO
//同时置removeFromSuperViewOnHide = YES
+ (BOOL)hideHUDForView:(UIView *)view animated:(BOOL)animated;

//返回最上层的HUD subview
+ (nullable MBProgressHUD *)HUDForView:(UIView *)view;

//以view为基准创建初始化一个HUD对象,为HUD的初始化构造函数
- (instancetype)initWithView:(UIView *)view;

//显示HUD控件,此函数应该在主线程中调用
- (void)showAnimated:(BOOL)animated;

//隐藏HUD控件,animated控制是否显示动画。对应于- (void)showAnimated:(BOOL)animated;
- (void)hideAnimated:(BOOL)animated;

//在delay时间之后隐藏HUD,animated控制显示动画与否,delay控制延迟时间
- (void)hideAnimated:(BOOL)animated afterDelay:(NSTimeInterval)delay;

//MBProgressHUDDelegate代理
@property (weak, nonatomic) id<MBProgressHUDDelegate> delegate;

//宽限时间,在graceTime之后才显示HUD。此值默认是0,直接显示
@property (assign, nonatomic) NSTimeInterval graceTime;

//HUD最小显示时间,在执行短时任务时可以设置这个值控制HUD的显示时间
@property (assign, nonatomic) NSTimeInterval minShowTime;

//当HUD隐藏时 是否从父视图中移除HUD对象
@property (assign, nonatomic) BOOL removeFromSuperViewOnHide;

//MBProgressHUD显示样式
@property (assign, nonatomic) MBProgressHUDMode mode;

//MBProgressHUD显示内容的颜色--(待定)
@property (strong, nonatomic, nullable) UIColor *contentColor UI_APPEARANCE_SELECTOR;

//MBProgressHUD动画效果
@property (assign, nonatomic) MBProgressHUDAnimation animationType UI_APPEARANCE_SELECTOR;

//挡板相对于视图中心的偏移
@property (assign, nonatomic) CGPoint offset UI_APPEARANCE_SELECTOR;

//HUD边缘和HUD元素之间的空间大小
@property (assign, nonatomic) CGFloat margin UI_APPEARANCE_SELECTOR;

//HUD的bezel的最小大小
@property (assign, nonatomic) CGSize minSize UI_APPEARANCE_SELECTOR;

//是否强制HUD背景框宽高相等
@property (assign, nonatomic, getter = isSquare) BOOL square UI_APPEARANCE_SELECTOR;

//当启用时,bezel的中心会被设备的加速计数据影响,iOS < 7.0一下可忽略
@property (assign, nonatomic, getter=areDefaultMotionEffectsEnabled) BOOL defaultMotionEffectsEnabled UI_APPEARANCE_SELECTOR;

//进度指标条的当前进入 数值为(0.0-1.0)
@property (assign, nonatomic) float progress;

//小方块背景视图
@property (strong, nonatomic, readonly) MBBackgroundView *bezelView;

//HUD整个的背景视图,放置在bezelView之后
@property (strong, nonatomic, readonly) MBBackgroundView *backgroundView;

//当HUD是MBProgressHUDModeCustomView的模式时,所显示的指示器图片,这个大小最好是37*37像素
@property (strong, nonatomic, nullable) UIView *customView;

//指示器下方的lebel控件,显示简要信息
@property (strong, nonatomic, readonly) UILabel *label;

//指示器下方的lebel控件,显示详细信息
@property (strong, nonatomic, readonly) UILabel *detailsLabel;

//labels下方的button按钮,仅当添加目标/动作时可见
@property (strong, nonatomic, readonly) UIButton *button;

@end

前面说到,MBProgressHUD有一个mode属性,这个属性可以控制HUD的窗口模式,默认是使用系统提供的菊花型进度视图,我们可以通过这个属性来改变窗口模式,这里提供了两个类来实现自定义的进度条样式,圆形视图[圆饼或者圆环](MBRoundProgressView)、棒状视图(MBBarProgressView)。同时也提供了几个公有属性供使用者来修改外观,见代码注释

//一个圆形进度条视图
@interface MBRoundProgressView : UIView 

//进度条当前数值大小
@property (nonatomic, assign) float progress;

//指示器进度条颜色
@property (nonatomic, strong) UIColor *progressTintColor;

//进度条背景颜色
@property (nonatomic, strong) UIColor *backgroundTintColor;

//进度条形状,NO是圆  YES是圆环
@property (nonatomic, assign, getter = isAnnular) BOOL annular;

@end


//扁平棒状进度条视图
@interface MBBarProgressView : UIView

//进度条当前数值大小
@property (nonatomic, assign) float progress;

//进度条边框线的颜色
@property (nonatomic, strong) UIColor *lineColor;

//进度条背景颜色
@property (nonatomic, strong) UIColor *progressRemainingColor;

//进度条颜色
@property (nonatomic, strong) UIColor *progressColor;

@end

MBProgressHUD提供了一个简单的背景视图View,我们可以设置背景视图样式,这个属性我们应该不怎么常用

//MBProgressHUD的背景视图
@interface MBBackgroundView : UIView

//背景视图样式
//iOS 7或者以上版本默认风格是MBProgressHUDBackgroundStyleBlur,其他为MBProgressHUDBackgroundStyleSolidColor
//注意由于iOS 7不支持UIVisualEffectView,所以在iOS7 和 更高版本中会有所不同
@property (nonatomic) MBProgressHUDBackgroundStyle style;

//背景颜色
//注意由于iOS 7不支持UIVisualEffectView,所以在iOS7 和 更高版本中会有所不同
@property (nonatomic, strong) UIColor *color;

@end

</br>
MBProgressHUD还为我们提供了一个代理MBProgressHUDDelegate,这个代理中只提供了一个方法,即:

//代理类
@protocol MBProgressHUDDelegate <NSObject>

@optional
//当HUD完全消失后调用
- (void)hudWasHidden:(MBProgressHUD *)hud;
@end

这个代理方法是在隐藏HUD窗口后调用,如果此时我们需要在我们自己的实现中执行某些操作,则可以实现这个方法。

这篇文章主要简略介绍一下MBProgressHUD的头文件,(枚举,函数,属性,以及所用到的视图类),下一篇我们主要讲一下,HUD对象的工作过程,以及这些属性,函数,视图怎么影响HUD的最终显示效果

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,445评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,889评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,047评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,760评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,745评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,638评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,011评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,669评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,923评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,655评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,740评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,406评论 4 320
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,995评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,961评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,197评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,023评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,483评论 2 342

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,016评论 4 62
  • 源码来源:gitHub源码 转载于: CocoaChina 来源:南峰子的技术博客 版本:0.9.1 MBPr...
    李小六_阅读 6,423评论 2 5
  • 生活就是一场修行吗? 可能是小时候太缺爱了,所以现在比以前挣的钱多了仍然觉得钱不够。要多少钱才能带来安全感? 每天...
    九蜜阅读 353评论 0 0
  • 职场之上,总会有一些人,不是那么会说话,不会沟通,比如下面这个: 公司里有一个同事比较自卑,也许是家境不太好的缘故...
    架构师米洛阅读 378评论 0 0
  • 广州九月的太阳依旧凶残,我的出租房在顶楼,所以太阳的能量很快就能透过混泥土充满这五十平米不到的房子。 出一趟门,更...
    苛政猛于虎也阅读 2,709评论 0 4