美文网首页
iOS MBProgressHUD 源码泛读

iOS MBProgressHUD 源码泛读

作者: 杨柳小易 | 来源:发表于2017-04-14 10:40 被阅读50次

    <code>MBProgressHUD</code>源码通读。

    <code>MBProgressHUD</code>是一个简单的在app里面弹出tost的开源库,可以显示进度条,菊花,文字,等等。直接看<code>git</code>就很容易上手使用。

    因为项目中使用到了,敢完一期需求巴拉巴拉一下源码。

    <code>.h</code>文件中的定义。

    ///显示样式
    MBProgressHUDMode
    ///动画样式
    MBProgressHUDAnimation
    
    ///view 定义
    MBProgressHUD
    
    ///条状进度条定义
    MBBarProgressView
    
    ///环状进度条定义
    MBRoundProgressView
    
    

    应用中如果有要使用进度条的的地方,可以直接从源码中抠出<code>MBBarProgressView</code>或者<code> MBRoundProgressView </code>修改使用。

    先 巴拉一下进度条的实现,比如:<code>MBBarProgressView</code>

    定义如下:

    @interface MBBarProgressView : UIView
    
    //进度 0 到 1 之间
    @property (nonatomic, assign) float progress;
    
    //边线颜色
    @property (nonatomic, MB_STRONG) UIColor *lineColor;
    
    //背景色
    @property (nonatomic, MB_STRONG) UIColor *progressRemainingColor;
    
    //进度条的颜色
    @property (nonatomic, MB_STRONG) UIColor *progressColor;
    
    @end
    

    实现比较简单,默认的宽高是120 * 20

    - (id)init {
        return [self initWithFrame:CGRectMake(.0f, .0f, 120.0f, 20.0f)];
    }
    
    

    初始化方法只是简单的设置一些默认值,还有注册<code>kvo</code>

    - (id)initWithFrame:(CGRect)frame {
        self = [super initWithFrame:frame];
        if (self) {
            _progress = 0.f;
            _lineColor = [UIColor whiteColor];
            _progressColor = [UIColor whiteColor];
            _progressRemainingColor = [UIColor clearColor];
            self.backgroundColor = [UIColor clearColor];
            self.opaque = NO;
            [self registerForKVO];
        }
        return self;
    }
    
    

    进度条的实现是通过<code>drawRect</code>方法,画上去的,有空可以细细的研究一番。

    所有属性变化都是通过kvo来监听的,然后强制调用一下draw方法。

    - (void)drawRect:(CGRect)rect {
        CGContextRef context = UIGraphicsGetCurrentContext();
    
    - (void)registerForKVO {
        for (NSString *keyPath in [self observableKeypaths]) {
            [self addObserver:self forKeyPath:keyPath options:NSKeyValueObservingOptionNew context:NULL];
        }
    }
    
    - (void)unregisterFromKVO {
        for (NSString *keyPath in [self observableKeypaths]) {
            [self removeObserver:self forKeyPath:keyPath];
        }
    }
    
    - (NSArray *)observableKeypaths {
        return [NSArray arrayWithObjects:@"lineColor", @"progressRemainingColor", @"progressColor", @"progress", nil];
    }
    
    - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context {
        [self setNeedsDisplay];
    }
    
    

    <strong>到此,一个简单的进度条就实现了。</strong>以后可以借鉴,毕竟,这么人使用过。。。MBRoundProgressView 进度条实现方法基本一致,只是大小和 画图的地方不一样。

    <code> MBProgressHUD </code> 的组成

    label
    detailsLabel
    Indicator
    

    其中 <code>Indicator</code>可以是

    UIActivityIndicatorView
    MBBarProgressView
    MBRoundProgressView
    

    或者自定义的一个view

    <code> MBProgressHUD </code> 并没有使用 <code>autolayout</code>,而是使用 <code>frame</code> 直接设置位置, 位置的设置 是在 <code>layoutSubviews</code>中完成的,
    布局完成后会记录总共的使用的<code>size</code>
    <code>self.size = totalSize;</code>这是为了绘制黑色背景部分记录的。

    绘制背景依旧在<code>drawRect</code>方法中。

    属性的改变也是通过kvo 来监听的,变化了就调用布局和绘制方法,

    - (void)updateUIForKeypath:(NSString *)keyPath {
        if ([keyPath isEqualToString:@"mode"] || [keyPath isEqualToString:@"customView"]) {
            [self updateIndicators];
        } else if ([keyPath isEqualToString:@"labelText"]) {
            label.text = self.labelText;
        } else if ([keyPath isEqualToString:@"labelFont"]) {
            label.font = self.labelFont;
        } else if ([keyPath isEqualToString:@"detailsLabelText"]) {
            detailsLabel.text = self.detailsLabelText;
        } else if ([keyPath isEqualToString:@"detailsLabelFont"]) {
            detailsLabel.font = self.detailsLabelFont;
        } else if ([keyPath isEqualToString:@"progress"]) {
            if ([indicator respondsToSelector:@selector(setProgress:)]) {
                [(id)indicator setProgress:progress];
            }
            return;
        }
        [self setNeedsLayout];
        [self setNeedsDisplay];
    }
    
    

    代码整体难度不大,但是在项目中使用广泛。

    我们的项目从头到尾只使用了菊花和问题的样式,所以,进度条那些完全可以自己剔除掉。个人愚见。。

    相关文章

      网友评论

          本文标题:iOS MBProgressHUD 源码泛读

          本文链接:https://www.haomeiwen.com/subject/hdrwattx.html