DDProgressHUD的介绍

提供了四种类型的展示:

  • 显示无限旋转的加载图(比如小菊花,可以自定义),显示文字信息。网络刷新时经常用到。

  • 显示加载进度的动画,也可以显示文字。网络下载时用的比较多,加载网页时也可以用。

  • 与用户弹窗交互的弹窗,告知用户当前操作的状态,成功还是失败,显示一张图片和文字。图片和文字也都可自定义

  • 可高度自定义的弹窗,将一个view显示在遮罩上面,相当于做了一个蒙版

最后旋转的菊花,提供了一个view的扩展,将UIActivityIndicatorView小菊花显示在调用者中间位置。

DDProgressHUD的简单使用与方法介绍

准备

  • 下载代码:使用很简单,将工程从github:https://github.com/mddios/DDProgressHUD下载下来,将DDProgressHUD文件全部拖入工程
  • 包含DDProgressHUD.h头文件即可使用
  • 不用考虑线程的问题,主线程和非主线程均可以

工程现在下来可以看到是一个demo,点击上面的按钮就一目了然

为了方便管理与自定义,建议还是fork一份到自己的github

简单使用与方法介绍

  • 第一类显示提供三个类方法:无限循化的图片
  1. /// 只显示图片,一直显示直到调用dismiss方法
  2. + (void)show;
  3. /// 显示图片和文字,一直显示直到调用dismiss方法
  4. + (void)showWithStatus:(NSString *)status;
  5. /// 很明显,显示时间由duration决定,当然,中途也可以调用dismiss方法来取消显示
  6. + (void)showWithStatus:(NSString *)status andDuration:(NSTimeInterval)duration;
  • 第二类显示提供2个类方法:加载进度
  1. /// 显示进度,不会自动消失,需要调用dismiss方法,progress 取值范围0~1
  2. + (void)showProgress:(CGFloat)progress;
  3. /// 显示进度,和一段描述,不会自动消失,需要调用dismiss方法
  4. + (void)showProgress:(CGFloat)progress withStatus:(NSString *)status;
  • 第三类显示提供6个类方法:弹窗,显示图片和文字
  1. /// 成功弹窗,只显示图片,
  2. + (void)showSuccessImage;
  3. /// 成功状态图片和info
  4. + (void)showSuccessImageWithInfo:(NSString *)info;
  5. /// 错误弹窗,只显示图片
  6. + (void)showErrorImage;
  7. /// 错误状态图片和info
  8. + (void)showErrorImageWithInfo:(NSString *)info;
  9. /// 显示自定义图片和文字信息,视图大小会根据文字和图片的大小自动调整
  10. + (void)showImage:(UIImage *)image andInfo:(NSString *)info;
  11. /// 显示自定义图片和文字信息时间到后自动消失,视图大小会根据文字和图片的大小自动调整
  12. + (void)showImage:(UIImage *)image andInfo:(NSString *)info andDuration:(CGFloat)duration;

关于显示时间的问题:会根据传入的Info长短来计算一个时间,然后和最大时间、最小时间做比较,防止超过预期值,最大最小值都可以程序设置,具体参照下面关于设置的介绍。

成功和失败的图片没有提供接口来替换,如果需要显示自定义的图片,上面也提供了方法。

当然你也将程序默认成功和失败的图片自己替换掉(在bundle中),程序会根据图片的大小来自动计算Frame,所以图片大小也不受限制,但是图片名字必须与默认的保持一致。

  • 第四类显示:在maskview(相当于蒙版)上显示view,高度自定义
  1. + (void)showWithView:(UIView *)view andDuration:(NSTimeInterval)duration;

随意显示,和上面最大的不同就是,它的frame需要使用者自己定义与计算,HUD只是提供一个蒙版,还有就是点击蒙版后的操作(隐藏,发送通知,或者什么也不做)

  • 最后,也算第五类吧

显示系统的菊花到view的中间,view的扩展方法

  1. /// 将DDProgressHUD无限循环动画添加到view, @return 返回DDProgressHUD实例
  2. - (UIActivityIndicatorView *)showActivityView;
  3. /// 将最顶层的ActivityView从父视图删除,如果添加了多次则只会删除最顶层! @return 找到并删除成功返回YES,否则NO
  4. - (BOOL)hiddenActivityView;

DDProgressHUD的全局设置

设置有两种:

  • 头文件里面的默认设置(宏定义),相当于初始化,全局有效。位置:DDDefaultSetup.h头文件
  • 程序提供的类方法,会覆盖之前的设置,全局有效。接口头文件:DDProgressHUD.h

简单看下视图和对应的名称,还有层级

  1. maskview显示在window上
  2. DDProgressHUD(下面简称hud)的backgroundView
  3. 大部分视图处于这一层级,比如上面提到的第一类、第二类、第三类显示的视图都在这个层级,下面示意图展示的是第二类:进度
    • 3.1: 进度条的,有两个,黑色的为foregroundRing,灰色的为backgroundRing
    • 3.2:显示的lbl

也可以根据上面显示类别和view的层级关系,分为以下几种

1 maskview,蒙版的设置

首先默认设置,一共有4个

  1. /// 遮罩默认不透明度
  2. #define kMaskViewAlpha 0.6f
  3. /// 遮罩默认颜色
  4. #define kMaskViewBackgroundColorRGB 0x999999
  5. /// 默认展示动画时间
  6. #define kShowAnimateDuration 0.2f
  7. /// 默认隐藏动画时间
  8. #define kDismissAnimateDuration 0.2f

前两个好理解,后面两个是展示maskview和隐藏时的动画时间,是对alpha做的动画。

对应类方法设置为:(void)setMaskviewColor:(UIColor *)color,颜色和透明度,一起设置。动画时间没有提供。

另外还有setMaskViewAutomaticHidden:,即点击蒙版后是否自动消失视图,即调用dismiss方法。无论YES或者NO,点击后都会发送一个通知static const NSNotificationName DDMaskViewDidClicked = @"DDMaskViewDidClicked";

2 白色的背景设置

头文件默认设置

  1. /// 圆角半径
  2. #define kCornerRadius 10
  3. #define kHudColor 0xF0F0F0
  4. /// hud最大宽度与屏幕宽度比例
  5. #define kMaxWidthRatioScreenWidth (2.0/3.0)
  6. /// hud最大高度与屏幕高度比例
  7. #define kMaxHeightRatioScreenHeight (2.0/3.0)
  8. /// hud最小宽高比,避免hud显得太瘦,使用者可以通过将文本换行(\n\r)来避免太胖
  9. #define kMinimumWidthRatioHeight 0.95
  10. /// 图片与文字之间的间隙(竖直方向)
  11. #define kViewMargin 12
  12. /// 与父视图间隙
  13. #define kTopAndBottomMargin 16
  14. /// 与父视图间隙
  15. #define kLeftAndRightMargin 16
  • 与屏幕的宽高比:主要是计算字符串文字信息是给的限定,防止超过限制,从而显得不美观
  • hud自身的宽高比:主要是避免显得太瘦,比如文字信息很短,就会现的很瘦,而太胖的话,可以对文字信息进行换行处理
  • 还有间隙的设置:主要是针对hud的子view

类方法的设置:有的没有提供(比如宽高比,比如视图间隙)

  1. /// 设置圆角,默认为10,具体参照:DDDefaultSetup.h为准
  2. + (void)setBackgroundViewCornerRadius:(CGFloat)radius;
  3. /// 设置背景颜色,默认为0xF0F0F0,具体参照:DDDefaultSetup.h为准
  4. + (void)setBackgroundViewColor:(UIColor *)color;
  5. /// 设置字体,默认为偏好设置字体
  6. + (void)setFont:(UIFont *)font;

3 弹窗、无限旋转的图片、进度圈的设置

共同的设置,即文字(lbl)字体:

类方法:setFont:,默认设置为跟随偏好设置的小标题大小变化[UIFont preferredFontForTextStyle:UIFontTextStyleSubheadline]

  • 弹窗

默认:

  1. /// 最长10秒,最短3秒
  2. #define kDDMaxImageShowDuration 10.0f
  3. #define kDDMinimumImageShowDuration 3.0f
  4. /// 每个文字显示时间
  5. #define kEveryWordShowDuration 0.2f

类方法:

  1. + (void)setMaxImageShowDuration:(CGFloat)duration;
  2. + (void)setMinimumImageShowDuration:(CGFloat)duration;
  3. /// 默认每个文字0.2s,具体参照:DDDefaultSetup.h为准
  4. + (void)setEveryWordShowDuration:(CGFloat)duration;

主要用于计算弹窗显示时间长短

  • 无限旋转的图片

默认:

  1. /// 旋转一周所用的时间,控制旋转的速度
  2. #define kOneRoundDuration 1.0f

类方法:多提供了旋转的图片设置,可以在这里设置,也可以直接将bundle里面的替换,替换后全局有效

  1. /// 自定义旋转的图片
  2. + (void)setLoopImage:(UIImage *)image;
  3. /// 控制旋转的速度:旋转一圈所用的时间,默认为1s,具体参照:DDDefaultSetup.h为准
  4. + (void)setLoopOneRingDuration:(CGFloat)duration;
  • 进度圈

默认:

  1. /// 进度圆环线半径大小
  2. #define kRingRadius 25.0f
  3. /// 进度圆环线宽度
  4. #define kRingLineWidth 3.0f
  5. /// 进度圆环颜色
  6. #define kForegroundRingLineColorRGB 0x333333
  7. #define kBackgroundRingLineColorRGB 0xE0E0E0

类方法:

  1. /// 圆弧半径,默认为25,具体参照:DDDefaultSetup.h为准
  2. + (void)setForegroundRingRadius:(CGFloat)radius;
  3. + (void)setBackgroundRingRadius:(CGFloat)radius;
  4. /// 圆弧线宽度,默认为3,具体参照:DDDefaultSetup.h为准
  5. + (void)setForegroundRingLineWidth:(CGFloat)width;
  6. + (void)setBackgroundRingLineWidth:(CGFloat)width;
  7. /// 圆弧线颜色,默认为0xE0E0E0 0x333333,具体参照:DDDefaultSetup.h为准
  8. + (void)setForegroundRingLineColor:(UIColor *)color;
  9. + (void)setBackgroundRingLineColor:(UIColor *)color;

github地址:https://github.com/mddios/DDProgressHUD ,已支持CocoaPods:pod 'MDDProgressHUD',注意前面是MDD,不是DD(被别人占用)

如果帮到了你,给颗星吧!

灵活、可高度自定义的——Progress进度圈、弹窗、加载进度、小菊花的更多相关文章

  1. canvas扇形进度圈动态加载

    效果图如下:动态加载的 实现代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  2. 文件分片 浏览器文件大小限制 自定义请求头 在一个资源的加载进度停止之后被触发 arrayBuffer 异步 二进制数据缓存区

    js 整数限制 浏览器文件大小限制 https://w3c.github.io/FileAPI/#dom-blob-arraybuffer https://developer.mozilla.org/ ...

  3. Unity 异步加载 进度条

    当我们进行游戏开发时,时常会进行场景切换,如果下个场景较大,切换时就会出现卡顿现象,甚至看起来像是"死机",非常影响用户体验,我们这时就可以运用异步加载,在界面上显示加载的进度条以 ...

  4. Android 自定义View修炼-自定义加载进度动画XCLoadingImageView

    一.概述 本自定义View,是加载进度动画的自定义View,继承于ImageView来实现,主要实现蒙层加载进度的加载进度效果. 支持水平左右加载和垂直上下加载四个方向,同时也支持自定义蒙层进度颜色. ...

  5. 简单的ajax遮罩层(加载进度圈)cvi_busy_lib.js

    cvi_busy_lib.js cvi_busy_lib.js 是一个基于ajax的遮罩js,遮罩区域为body区域.使用比较简单. 效果: 在下面的Js代码,标注为红色标记为需要设置的参数. 1.g ...

  6. pace.js和NProgress.js两个加载进度插件的一点小总结

    这两个插件都是关于加载进度动画的,应该说各有特点吧,最起码对我来说是各有优势的.今天一天就捣鼓了加载进度动画,也研究了大量的(也就这两个)加载进度动画,也算对加载进度动画有了一个初步的了解了吧. NP ...

  7. pace.js – 加载进度条插件

    这儿只是简单介绍一下这个插件pace.js. 在页面中引入Pace.js,页面就会自动监测你的请求(包括Ajax请求),在事件循环滞后,会在页面记录加载的状态以及进度情况.此插件的兼容性很好,可以兼容 ...

  8. prelaod场景,用来显示资源加载进度

    phaser.js的源码可以到它在github上的托管里去下载,游戏要用到的图片声音等素材资源请点击这里下载.Phaser的使用非常简单,只需要引入它的主文件,然后在页面中指定一个用来放置canvas ...

  9. iOS UIWebView 加载进度条的使用-WKWebView的使用,更新2017.6.26

    1.由于项目中加载网络插件,直接使用了webview加载.使用了三方NJKWebViewProgress进度条的使用,近期在测试时发现,网络缓慢时出现白屏,有卡顿现象. 于是采用了WKWebView进 ...

随机推荐

  1. SDN竞赛思考总结

    SDN竞赛思考总结 2016年下半年张老师开始着手组建SDN小组,从未接触过任何网络知识的我也有幸成为小组一员.从最开始刷Openflow交换机,Get了刷交换机的新技能;到P4FPGA的无疾而终,表 ...

  2. android开发心得之知识的量变到质变

    随着身边越来越多的人开始了尝试android开发,看着他们一点点学期 从nodepad++写代码 cmd 执行,到安装eclipse 和android SDK,仿佛看到了昨天的我一样,一样勤勤恳恳的学 ...

  3. 3D 立体 backface-visibility

    <!DOCTYPE html> <html> <head> <!-- backface-visibility属性用来设置,是否显示元素的背面,默认是显示的 b ...

  4. Linux基础六(网络管理)

    目录 一.网络配置 1. IP 地址配置 2. 网络配置文件 3. 虚拟机网络配置参数 二.网络命令 1. 网络环境查看命令 2. 网络测试命令 三.远程会话安全协议-SSH原理 1. SSH 原理 ...

  5. centos 6.9安装mysql

    1.确认mysql是否已安装,有下面的代码可知 [root@cdh1 zjl]# yum list installed mysql* Loaded plugins: fastestmirror, re ...

  6. String js删除字符串的最后一个字符三种方法

    字符串 var basic = "abc,def,ghi,"; 第一种 basic = basic.substr(0, basic.length - 1); 第二种 basic = ...

  7. java 重载 : 1.参数个数不同,2.参数类型不同

    参数个数相同时,参数类型需要不同,即使是不同变量名也不行.和是和变量的个数或者是变量的类型有关系  如果相同的话是覆盖 会报错 重载(overloading) 是在一个类里面,方法名字相同,而参数不同 ...

  8. hdu 6183 Color it (线段树 动态开点)

    Do you like painting? Little D doesn't like painting, especially messy color paintings. Now Little B ...

  9. POJ 2584 T-Shirt Gumbo

    T-Shirt Gumbo Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 3689   Accepted: 1755 Des ...

  10. String args[] 和 String[] args 有什么区别

    String args[] 和 String[] args 有什么区别 public static void main(String args[]) 或 public static void main ...