MJRefresh源碼分析

MJRefresh是李明杰老師的作品录平,對(duì)于iOS的開(kāi)發(fā)者來(lái)說(shuō)麻车,一定非常熟悉這個(gè)簡(jiǎn)單實(shí)用缀皱,功能強(qiáng)大的下拉加載,上拉刷新的控件动猬,有很好的可定制性啤斗,幾乎能滿(mǎn)足大部分刷新的需求,非常值得鉆研學(xué)習(xí)赁咙。

這個(gè)框架的結(jié)構(gòu)設(shè)計(jì)非常清晰钮莲,非常能夠體現(xiàn)面向?qū)ο蟮脑O(shè)計(jì)原則,一般我總結(jié)為各行其是彼水,基類(lèi)MJRefreshComponent繼承自UIView崔拥,并承載著整個(gè)框架的基礎(chǔ)設(shè)置,然后MJRefreshHeader和MJRefreshFooter繼承了MJRefreshComponent凤覆,擴(kuò)展了下拉刷新和上拉加載的功能链瓦,下面的腦圖很好的說(shuō)明了整個(gè)框架的繼承關(guān)系:

.

實(shí)現(xiàn)原理:

MJRefresh的實(shí)現(xiàn)原理是擴(kuò)展了UIScrollView,添加了mj_header和mj_footer兩個(gè)控件叛赚,通過(guò)KVO機(jī)制澡绩,監(jiān)聽(tīng)了scrollView的contentOffset的變化,人為的將刷新這件事情劃分成了五種不同的狀態(tài)俺附,當(dāng)狀態(tài)變化的時(shí)候肥卡,向外暴露出調(diào)用鉤子,用戶(hù)可以利用這些鉤子來(lái)執(zhí)行刷新和加載的動(dòng)作事镣。

說(shuō)完了原理步鉴,來(lái)看一下怎么實(shí)現(xiàn)的。

MJRefreshComponent

這是所有刷新加載控件的基類(lèi)璃哟,主要做的以下幾件事:

  1. 聲明控件的所有狀態(tài)氛琢。
  2. 聲明控件的回調(diào)函數(shù)。
  3. 添加監(jiān)聽(tīng)機(jī)制随闪。
  4. 提供了刷新阳似,停止刷新的接口。
  5. 提供子類(lèi)需要實(shí)現(xiàn)的方法铐伴。
1.聲明控件的所有狀態(tài)
/** 刷新控件的狀態(tài) */
typedef NS_ENUM(NSInteger, MJRefreshState) {
    /** 普通閑置狀態(tài) */
    MJRefreshStateIdle = 1,
    /** 松開(kāi)就可以進(jìn)行刷新的狀態(tài) */
    MJRefreshStatePulling,
    /** 正在刷新中的狀態(tài) */
    MJRefreshStateRefreshing,
    /** 即將刷新的狀態(tài) */
    MJRefreshStateWillRefresh,
    /** 所有數(shù)據(jù)加載完畢撮奏,沒(méi)有更多的數(shù)據(jù)了 */
    MJRefreshStateNoMoreData
};
2.各種狀態(tài)的回調(diào)Block
/** 進(jìn)入刷新?tīng)顟B(tài)的回調(diào) */
typedef void (^MJRefreshComponentRefreshingBlock)();
/** 開(kāi)始刷新后的回調(diào)(進(jìn)入刷新?tīng)顟B(tài)后的回調(diào)) */
typedef void (^MJRefreshComponentbeginRefreshingCompletionBlock)();
/** 結(jié)束刷新后的回調(diào) */
typedef void (^MJRefreshComponentEndRefreshingCompletionBlock)();
3.添加監(jiān)聽(tīng)
#pragma mark - KVO監(jiān)聽(tīng)
- (void)addObservers
{
    NSKeyValueObservingOptions options = NSKeyValueObservingOptionNew | NSKeyValueObservingOptionOld;
    [self.scrollView addObserver:self forKeyPath:MJRefreshKeyPathContentOffset options:options context:nil];
    [self.scrollView addObserver:self forKeyPath:MJRefreshKeyPathContentSize options:options context:nil];
    self.pan = self.scrollView.panGestureRecognizer;
    [self.pan addObserver:self forKeyPath:MJRefreshKeyPathPanState options:options context:nil];
}

處理監(jiān)聽(tīng):

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
    // 遇到這些情況就直接返回
    if (!self.userInteractionEnabled) return;
    
    // 這個(gè)就算看不見(jiàn)也需要處理
    if ([keyPath isEqualToString:MJRefreshKeyPathContentSize]) {
        [self scrollViewContentSizeDidChange:change];
    }
    
    // 看不見(jiàn)
    if (self.hidden) return;
    if ([keyPath isEqualToString:MJRefreshKeyPathContentOffset]) {
        [self scrollViewContentOffsetDidChange:change];
    } else if ([keyPath isEqualToString:MJRefreshKeyPathPanState]) {
        [self scrollViewPanStateDidChange:change];
    }
}
4.刷新,停止刷新的接口
#pragma mark - 刷新?tīng)顟B(tài)控制
/** 進(jìn)入刷新?tīng)顟B(tài) */
- (void)beginRefreshing;
- (void)beginRefreshingWithCompletionBlock:(void (^)())completionBlock;
/** 結(jié)束刷新?tīng)顟B(tài) */
- (void)endRefreshing;
- (void)endRefreshingWithCompletionBlock:(void (^)())completionBlock;
/** 是否正在刷新 */
- (BOOL)isRefreshing;
5.提供子類(lèi)需要實(shí)現(xiàn)的方法
#pragma mark - 交給子類(lèi)們?nèi)?shí)現(xiàn)
/** 初始化 */
- (void)prepare NS_REQUIRES_SUPER;
/** 擺放子控件frame */
- (void)placeSubviews NS_REQUIRES_SUPER;
/** 當(dāng)scrollView的contentOffset發(fā)生改變的時(shí)候調(diào)用 */
- (void)scrollViewContentOffsetDidChange:(NSDictionary *)change NS_REQUIRES_SUPER;
/** 當(dāng)scrollView的contentSize發(fā)生改變的時(shí)候調(diào)用 */
- (void)scrollViewContentSizeDidChange:(NSDictionary *)change NS_REQUIRES_SUPER;
/** 當(dāng)scrollView的拖拽狀態(tài)發(fā)生改變的時(shí)候調(diào)用 */
- (void)scrollViewPanStateDidChange:(NSDictionary *)change NS_REQUIRES_SUPER

這個(gè)基類(lèi)其實(shí)能夠表明刷新加載的實(shí)現(xiàn)原理当宴,下面的子類(lèi)在這個(gè)基礎(chǔ)上進(jìn)行了各種情形下的擴(kuò)展畜吊,下面沿著MJRfreshHeader這個(gè)分支向下面展開(kāi):

MJRefreshHeader

MJRefreshHeader繼承自MJRefreshComponent,實(shí)現(xiàn)了下面幾個(gè)功能:

  1. 初始化户矢。
  2. 設(shè)置Header的高度玲献。
  3. 重新調(diào)整Y值。
  4. 根據(jù)contentOffset的變化,來(lái)切換狀態(tài)(默認(rèn)狀態(tài)捌年,可以刷新的狀態(tài)瓢娜,正在刷新的狀態(tài)),實(shí)現(xiàn)方法是:scrollViewContentOffsetDidChange:延窜。
  5. 在切換狀態(tài)時(shí)恋腕,執(zhí)行相應(yīng)的操作抹锄。實(shí)現(xiàn)方法是:setState:逆瑞。
1.初始化方法

提供了兩個(gè)便利初始化方法,通過(guò)refreshingBlock來(lái)初始化,通過(guò)target-action來(lái)初始化:

+ (instancetype)headerWithRefreshingBlock:(MJRefreshComponentRefreshingBlock)refreshingBlock
{
    MJRefreshHeader *cmp = [[self alloc] init];
    //傳入block
    cmp.refreshingBlock = refreshingBlock;
    return cmp;
}
+ (instancetype)headerWithRefreshingTarget:(id)target refreshingAction:(SEL)action
{
    MJRefreshHeader *cmp = [[self alloc] init];
    //設(shè)置self.refreshingTarget 和 self.refreshingAction
    [cmp setRefreshingTarget:target refreshingAction:action];
    return cmp;
}
2.設(shè)置header的高度

重寫(xiě)prepare方法伙单,來(lái)設(shè)置header的高度:

- (void)prepare
{
    [super prepare];
    
    // 設(shè)置用于在NSUserDefaults里存儲(chǔ)時(shí)間的key
    self.lastUpdatedTimeKey = MJRefreshHeaderLastUpdatedTimeKey;
    
    // 設(shè)置header的高度
    self.mj_h = MJRefreshHeaderHeight;
}
3.重新調(diào)整y值

重寫(xiě)placeSubviews方法來(lái)調(diào)整y值:

- (void)placeSubviews
{
    [super placeSubviews];
    
    // 設(shè)置y值(當(dāng)自己的高度發(fā)生改變了获高,肯定要重新調(diào)整Y值,所以放到placeSubviews方法中設(shè)置y值)
    self.mj_y = - self.mj_h - self.ignoredScrollViewContentInsetTop;
    //self.ignoredScrollViewContentInsetTop 如果是10吻育,那么就向上移動(dòng)10
}
4.狀態(tài)切換
- (void)scrollViewContentOffsetDidChange:(NSDictionary *)change
{
    [super scrollViewContentOffsetDidChange:change];
    
    // 在刷新的refreshing狀態(tài)
    if (self.state == MJRefreshStateRefreshing) {
        if (self.window == nil) return;
        
        // sectionheader停留解決
        CGFloat insetT = - self.scrollView.mj_offsetY > _scrollViewOriginalInset.top ? - self.scrollView.mj_offsetY : _scrollViewOriginalInset.top;
        insetT = insetT > self.mj_h + _scrollViewOriginalInset.top ? self.mj_h + _scrollViewOriginalInset.top : insetT;
        self.scrollView.mj_insetT = insetT;
        
        self.insetTDelta = _scrollViewOriginalInset.top - insetT;
        return;
    }
    
    // 跳轉(zhuǎn)到下一個(gè)控制器時(shí)念秧,contentInset可能會(huì)變
     _scrollViewOriginalInset = self.scrollView.contentInset;
    
    // 當(dāng)前的contentOffset
    CGFloat offsetY = self.scrollView.mj_offsetY;
    // 頭部控件剛好出現(xiàn)的offsetY
    CGFloat happenOffsetY = - self.scrollViewOriginalInset.top;
    
    // 如果是向上滾動(dòng)到看不見(jiàn)頭部控件,直接返回
    // >= -> >
    if (offsetY > happenOffsetY) return;
    
    // 普通 和 即將刷新 的臨界點(diǎn)
    CGFloat normal2pullingOffsetY = happenOffsetY - self.mj_h;
    CGFloat pullingPercent = (happenOffsetY - offsetY) / self.mj_h;
    
    if (self.scrollView.isDragging) { // 如果正在拖拽
        self.pullingPercent = pullingPercent;
        if (self.state == MJRefreshStateIdle && offsetY < normal2pullingOffsetY) {
            // 轉(zhuǎn)為即將刷新?tīng)顟B(tài)
            self.state = MJRefreshStatePulling;
        } else if (self.state == MJRefreshStatePulling && offsetY >= normal2pullingOffsetY) {
            // 轉(zhuǎn)為普通狀態(tài)
            self.state = MJRefreshStateIdle;
        }
    } else if (self.state == MJRefreshStatePulling) {// 即將刷新 && 手松開(kāi)
        // 開(kāi)始刷新
        [self beginRefreshing];
    } else if (pullingPercent < 1) {
        self.pullingPercent = pullingPercent;
    }
}

做三點(diǎn)說(shuō)明:

  1. 三種狀態(tài):默認(rèn)狀態(tài)(MJRefreshStateIdle)布疼,可以刷新?tīng)顟B(tài)(MJRefreshStatePulling)摊趾,正在刷新?tīng)顟B(tài)(MJRefreshStateRefreshing)。
  2. 兩種因素:一個(gè)是下拉的距離是否超過(guò)臨界值游两,另一個(gè)是 手指是否離開(kāi)屏幕砾层。這是狀態(tài)切換的觸發(fā)因素。
  3. 一點(diǎn)注意:可以刷新的狀態(tài)和正在刷新的狀態(tài)是不同的贱案。因?yàn)樵谑种高€貼在屏幕的時(shí)候是不能進(jìn)行刷新的肛炮。所以即使在下拉的距離超過(guò)了臨界距離(狀態(tài)欄 + 導(dǎo)航欄 + header高度),如果手指沒(méi)有離開(kāi)屏幕宝踪,那么也不能馬上進(jìn)行刷新侨糟,而是將狀態(tài)切換為:可以刷新。一旦手指離開(kāi)了屏幕瘩燥,馬上將狀態(tài)切換為正在刷新秕重。
5.狀態(tài)切換的相應(yīng)操作
- (void)setState:(MJRefreshState)state
{
    MJRefreshCheckState
    
    // 根據(jù)狀態(tài)做事情
    if (state == MJRefreshStateIdle) {
        if (oldState != MJRefreshStateRefreshing) return;
        
        // 保存刷新時(shí)間
        [[NSUserDefaults standardUserDefaults] setObject:[NSDate date] forKey:self.lastUpdatedTimeKey];
        [[NSUserDefaults standardUserDefaults] synchronize];
        
        // 恢復(fù)inset和offset
        [UIView animateWithDuration:MJRefreshSlowAnimationDuration animations:^{
            self.scrollView.mj_insetT += self.insetTDelta;
            
            // 自動(dòng)調(diào)整透明度
            if (self.isAutomaticallyChangeAlpha) self.alpha = 0.0;
        } completion:^(BOOL finished) {
            self.pullingPercent = 0.0;
            
            if (self.endRefreshingCompletionBlock) {
                self.endRefreshingCompletionBlock();
            }
        }];
    } else if (state == MJRefreshStateRefreshing) {
         dispatch_async(dispatch_get_main_queue(), ^{
            [UIView animateWithDuration:MJRefreshFastAnimationDuration animations:^{
                CGFloat top = self.scrollViewOriginalInset.top + self.mj_h;
                // 增加滾動(dòng)區(qū)域top
                self.scrollView.mj_insetT = top;
                // 設(shè)置滾動(dòng)位置
                [self.scrollView setContentOffset:CGPointMake(0, -top) animated:NO];
            } completion:^(BOOL finished) {
                [self executeRefreshingCallback];
            }];
         });
    }

兩點(diǎn)說(shuō)明:

  1. 這里是重寫(xiě)MJRefreshState的set方法,在狀態(tài)變更成MJRefreshStateIdle和MJRefreshStateRefreshing時(shí)候厉膀,觸發(fā)的相應(yīng)的操作溶耘,也是針對(duì)開(kāi)始刷新和結(jié)束刷新這兩個(gè)狀態(tài)切換點(diǎn)來(lái)進(jìn)行相應(yīng)的觸發(fā)。
  2. 結(jié)束刷新的時(shí)候會(huì)記錄下當(dāng)前的系統(tǒng)時(shí)間站蝠,因?yàn)閔eader里面有個(gè)磨人的label來(lái)顯示上次刷新的時(shí)間汰具。

MJRefreshStateHeader

這個(gè)是MJRefreshHeader的子類(lèi),實(shí)現(xiàn)了兩個(gè)功能:

  1. 簡(jiǎn)單布局了子控件stateLabel和lastUpdateTimeLabel菱魔。
  2. 根據(jù)刷新?tīng)顟B(tài)留荔,實(shí)現(xiàn)了這兩個(gè)label的顯示狀態(tài)的切換。
1.布局子控件

重寫(xiě)prepare方法,初始化間距和要顯示的文字

    // 初始化間距
    self.labelLeftInset = MJRefreshLabelLeftInset;
    
    // 初始化文字
    [self setTitle:[NSBundle mj_localizedStringForKey:MJRefreshHeaderIdleText] forState:MJRefreshStateIdle];
    [self setTitle:[NSBundle mj_localizedStringForKey:MJRefreshHeaderPullingText] forState:MJRefreshStatePulling];
    [self setTitle:[NSBundle mj_localizedStringForKey:MJRefreshHeaderRefreshingText] forState:MJRefreshStateRefreshing];

這個(gè)方法供調(diào)用來(lái)自定義設(shè)置不同狀態(tài)下的顯示文本聚蝶。

#pragma mark - 公共方法
- (void)setTitle:(NSString *)title forState:(MJRefreshState)state
以刷新?tīng)顟B(tài)為Key杰妓,以顯示的title為值,來(lái)儲(chǔ)存不同狀態(tài)的文本信息碘勉。

placeSubviews方法巷挥,負(fù)責(zé)對(duì)子控件進(jìn)行布局,如果更新時(shí)間label是隱藏的验靡,則讓狀態(tài)label撐滿(mǎn)整個(gè)header倍宾,如果更新時(shí)間label不是隱藏的,根據(jù)約束設(shè)置更新時(shí)間label和狀態(tài)label(高度各占一半)胜嗓。

重寫(xiě)setState方法高职,根據(jù)傳入的state不同,在stateLabel和lastUpdateTimeLabel里切換相應(yīng)的文字辞州,stateLabel里的文字直接從stateTitles字典里取出怔锌,lastUpdateTimeLabel里的文字需要通過(guò)一個(gè)方法來(lái)取出。

- (void)setState:(MJRefreshState)state
{
    MJRefreshCheckState
    
    // 設(shè)置狀態(tài)文字
    self.stateLabel.text = self.stateTitles[@(state)];
    
    // 重新設(shè)置key(重新顯示時(shí)間)
    self.lastUpdatedTimeKey = self.lastUpdatedTimeKey;
}

MJRefreshNormalHeader

MJRefreshNormalHeader 繼承于 MJRefreshStateHeader变过,它主要做了兩件事:

  1. 在MJRefreshStateHeader上添加arrowView和loadingView兩個(gè)指示控件埃元。
  2. 改變這兩個(gè)控件顯示的樣式。
1.重寫(xiě)prepare方法

給indicatorView定義一個(gè)初始樣式媚狰。

self.activityIndicatorViewStyle = UIActivityIndicatorViewStyleGray;
2.重寫(xiě)placeSubviews方法

要注意的點(diǎn)是,因?yàn)閟tateLabel和lastUpdatedTimeLabel是上下并排分布的岛杀,而arrowView或loadingView是在這二者的左邊,所以為了避免這兩組重合哈雏,在計(jì)算arrowView或loadingView的center的時(shí)候楞件,需要獲取stateLabel和lastUpdatedTimeLabel兩個(gè)控件的寬度并比較大小,將較大的一個(gè)作為兩個(gè)label的‘最寬距離’裳瘪,再計(jì)算center土浸,這樣一來(lái)就不會(huì)重合了。

作者對(duì)于文本寬度計(jì)算的封裝彭羹,也可以用在自己的項(xiàng)目中:

- (CGFloat)mj_textWith {
    CGFloat stringWidth = 0;
    CGSize size = CGSizeMake(MAXFLOAT, MAXFLOAT);
    if (self.text.length > 0) {
#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && __IPHONE_OS_VERSION_MAX_ALLOWED >= 70000
        stringWidth =[self.text
                      boundingRectWithSize:size
                      options:NSStringDrawingUsesLineFragmentOrigin
                      attributes:@{NSFontAttributeName:self.font}
                      context:nil].size.width;
#else
        
        stringWidth = [self.text sizeWithFont:self.font
                             constrainedToSize:size
                                 lineBreakMode:NSLineBreakByCharWrapping].width;
#endif
    }
    return stringWidth;
}

主要是不同版本的api有變化黄伊。
setState方法

根據(jù)不同的狀態(tài)修改箭頭的transfrom屬性,控制indicatorView的顯示樣式和是否要顯示派殷。

- (void)setState:(MJRefreshState)state
{
    MJRefreshCheckState
    
    // 根據(jù)狀態(tài)更新arrowView和loadingView的顯示
    if (state == MJRefreshStateIdle) {
       
        //1. 設(shè)置為默認(rèn)狀態(tài)
        if (oldState == MJRefreshStateRefreshing) {
            
            //1.1 從正在刷新?tīng)顟B(tài)中切換過(guò)來(lái)
            self.arrowView.transform = CGAffineTransformIdentity;
            
            [UIView animateWithDuration:MJRefreshSlowAnimationDuration animations:^{
                //隱藏菊花
                self.loadingView.alpha = 0.0;
                
            } completion:^(BOOL finished) {
                
                // 如果執(zhí)行完動(dòng)畫(huà)發(fā)現(xiàn)不是idle狀態(tài)还最,就直接返回,進(jìn)入其他狀態(tài)
                if (self.state != MJRefreshStateIdle) return;
                //菊花停止旋轉(zhuǎn)
                self.loadingView.alpha = 1.0;
                [self.loadingView stopAnimating];
                //顯示箭頭
                self.arrowView.hidden = NO;
            }];
            
        } else {
            //1.2 從其他狀態(tài)中切換過(guò)來(lái)
            [self.loadingView stopAnimating];
            //顯示箭頭并設(shè)置為初始狀態(tài)
            self.arrowView.hidden = NO;
            [UIView animateWithDuration:MJRefreshFastAnimationDuration animations:^{
                self.arrowView.transform = CGAffineTransformIdentity;
            }];
        }
        
    } else if (state == MJRefreshStatePulling) {
        
        //2. 設(shè)置為可以刷新?tīng)顟B(tài)
        [self.loadingView stopAnimating];
        self.arrowView.hidden = NO;
        [UIView animateWithDuration:MJRefreshFastAnimationDuration animations:^{
            //箭頭倒立
            self.arrowView.transform = CGAffineTransformMakeRotation(0.000001 - M_PI);
        }];
        
    } else if (state == MJRefreshStateRefreshing) {
        
        //3. 設(shè)置為正在刷新?tīng)顟B(tài)
        self.loadingView.alpha = 1.0; // 防止refreshing -> idle的動(dòng)畫(huà)完畢動(dòng)作沒(méi)有被執(zhí)行
        //菊花旋轉(zhuǎn)
        [self.loadingView startAnimating];
        //隱藏arrowView
        self.arrowView.hidden = YES;
    }
}

這樣我們就從上到下毡惜,從基礎(chǔ)api到完整功能的實(shí)現(xiàn)來(lái)看了一遍這個(gè)框架拓轻,注意到三個(gè)貫穿基類(lèi)和子類(lèi)的方法prepareplaceSubviews经伙,setState扶叉,分別在各層實(shí)現(xiàn)自己這一層的功能。

MJRefreshHeader:負(fù)責(zé)header的高度設(shè)置和調(diào)整header在scrollView中的位置。
MJRefreshStateHeader:負(fù)責(zé)header內(nèi)部stateLabel和lastUpdateTimeLabel的布局和不同狀態(tài)下內(nèi)部文字的顯示枣氧。
MJRefreshNormalHeader:負(fù)責(zé)header內(nèi)部子控件loadingView和arrowView的布局和不同狀態(tài)下的顯示溢十。

這樣就非常好的實(shí)現(xiàn)了軟件架構(gòu)思維中的分層解耦,各層互不影響达吞,如果某一天我們要給MJRefresh添加一個(gè)新的樣式张弛,我們就只需要在一層上面做文章,而不用牽一發(fā)而動(dòng)全身酪劫。例如框架里面提供的MJRefreshGifHeader和MJRefreshNormalHeader處于同一層吞鸭,二者具有相同的stateLabel和lastUpdateTimeLabel,這是左側(cè)的顯示狀態(tài)不同:

  • MJRefreshNormalHeader左側(cè)是箭頭和indicatorView契耿;
  • MJRefreshGifHeader左側(cè)是一個(gè)gif動(dòng)畫(huà)瞒大。

來(lái)看一下是怎么實(shí)現(xiàn)的:
MJRefreshGifHeader的左側(cè)是一個(gè)imageView,并提供了兩個(gè)設(shè)置圖片數(shù)組對(duì)的接口:

/** 設(shè)置state狀態(tài)下的動(dòng)畫(huà)圖片images 動(dòng)畫(huà)持續(xù)時(shí)間duration*/
- (void)setImages:(NSArray *)images duration:(NSTimeInterval)duration forState:(MJRefreshState)state;
- (void)setImages:(NSArray *)images forState:(MJRefreshState)state;

然而MJRefreshGifHeader只需要和MJRefreshNormalHeader一樣搪桂,重寫(xiě)基類(lèi)提供的三個(gè)方法來(lái)實(shí)現(xiàn)顯示gif圖片的功能。

1. 初始化和右側(cè)label的間距
- (void)prepare
{
    [super prepare];
    
    // 初始化間距
    self.labelLeftInset = 20;
}
2.設(shè)置承載gif的imageView的位置
- (void)placeSubviews
{
    [super placeSubviews];
    
    //如果約束存在盯滚,就立即返回
    if (self.gifView.constraints.count) return;
    
    self.gifView.frame = self.bounds;
    
    if (self.stateLabel.hidden && self.lastUpdatedTimeLabel.hidden) {
        
        //如果stateLabel和lastUpdatedTimeLabel都在隱藏狀態(tài)踢械,將gif劇中顯示
        self.gifView.contentMode = UIViewContentModeCenter;
        
    } else {
        
        //如果stateLabel和lastUpdatedTimeLabel中至少一個(gè)存在,則根據(jù)label的寬度設(shè)置gif的位置
        self.gifView.contentMode = UIViewContentModeRight;
        
        CGFloat stateWidth = self.stateLabel.mj_textWith;
        CGFloat timeWidth = 0.0;
        if (!self.lastUpdatedTimeLabel.hidden) {
            timeWidth = self.lastUpdatedTimeLabel.mj_textWith;
        }
        CGFloat textWidth = MAX(stateWidth, timeWidth);
        self.gifView.mj_w = self.mj_w * 0.5 - textWidth * 0.5 - self.labelLeftInset;
    }
}
3.設(shè)置圖片數(shù)組動(dòng)畫(huà)
- (void)setState:(MJRefreshState)state
{
    MJRefreshCheckState
    
    if (state == MJRefreshStatePulling || state == MJRefreshStateRefreshing) {
        
        //1. 如果傳進(jìn)來(lái)的狀態(tài)是可以刷新和正在刷新
        NSArray *images = self.stateImages[@(state)];
        if (images.count == 0) return;
        
        [self.gifView stopAnimating];
        
        if (images.count == 1) {
            //1.1 單張圖片
            self.gifView.image = [images lastObject];
        } else {
            //1.2 多張圖片
            self.gifView.animationImages = images;
            self.gifView.animationDuration = [self.stateDurations[@(state)] doubleValue];
            [self.gifView startAnimating];
        }
    } else if (state == MJRefreshStateIdle) {
        //2.如果傳進(jìn)來(lái)的狀態(tài)是默認(rèn)狀態(tài)
        [self.gifView stopAnimating];
    }
}

總結(jié)

這樣就沿著一條線(xiàn)把MJRefresh的實(shí)現(xiàn)思路和方法解讀了一遍魄藕,總之這個(gè)框架的設(shè)計(jì)非常優(yōu)美内列,通過(guò)一個(gè)基類(lèi)來(lái)定義一些狀態(tài)和一些需要子類(lèi)實(shí)現(xiàn)的接口。通過(guò)一層一層地繼承背率,讓每一層的子類(lèi)各司其職话瞧,只完成真正屬于自己的任務(wù),提高了框架的可定制性寝姿,而且對(duì)于功能的擴(kuò)展和bug的追蹤也很有幫助交排,非常值得我們參考與借鑒。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末饵筑,一起剝皮案震驚了整個(gè)濱河市埃篓,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌根资,老刑警劉巖架专,帶你破解...
    沈念sama閱讀 218,858評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異玄帕,居然都是意外死亡部脚,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,372評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門(mén)裤纹,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)委刘,“玉大人,你說(shuō)我怎么就攤上這事∏祝” “怎么了骂铁?”我有些...
    開(kāi)封第一講書(shū)人閱讀 165,282評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀(guān)的道長(zhǎng)罩抗。 經(jīng)常有香客問(wèn)我拉庵,道長(zhǎng),這世上最難降的妖魔是什么套蒂? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 58,842評(píng)論 1 295
  • 正文 為了忘掉前任钞支,我火速辦了婚禮,結(jié)果婚禮上操刀,老公的妹妹穿的比我還像新娘烁挟。我一直安慰自己,他們只是感情好骨坑,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,857評(píng)論 6 392
  • 文/花漫 我一把揭開(kāi)白布撼嗓。 她就那樣靜靜地躺著,像睡著了一般欢唾。 火紅的嫁衣襯著肌膚如雪且警。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 51,679評(píng)論 1 305
  • 那天礁遣,我揣著相機(jī)與錄音斑芜,去河邊找鬼。 笑死祟霍,一個(gè)胖子當(dāng)著我的面吹牛杏头,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播沸呐,決...
    沈念sama閱讀 40,406評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼醇王,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了垂谢?” 一聲冷哼從身側(cè)響起厦画,我...
    開(kāi)封第一講書(shū)人閱讀 39,311評(píng)論 0 276
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎滥朱,沒(méi)想到半個(gè)月后根暑,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,767評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡徙邻,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,945評(píng)論 3 336
  • 正文 我和宋清朗相戀三年排嫌,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片缰犁。...
    茶點(diǎn)故事閱讀 40,090評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡淳地,死狀恐怖怖糊,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情颇象,我是刑警寧澤伍伤,帶...
    沈念sama閱讀 35,785評(píng)論 5 346
  • 正文 年R本政府宣布,位于F島的核電站遣钳,受9級(jí)特大地震影響扰魂,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜蕴茴,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,420評(píng)論 3 331
  • 文/蒙蒙 一劝评、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧倦淀,春花似錦蒋畜、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 31,988評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至能扒,卻和暖如春佣渴,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背初斑。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 33,101評(píng)論 1 271
  • 我被黑心中介騙來(lái)泰國(guó)打工, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留膨处,地道東北人见秤。 一個(gè)月前我還...
    沈念sama閱讀 48,298評(píng)論 3 372
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像真椿,于是被迫代替她去往敵國(guó)和親鹃答。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,033評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容