移動端項目的開發離不開loading控件,通常為了能快速在項目中實現loading效果我們有幾個主流的開源庫可以選擇:
MBProgressHUD、SVProgressHUD等
然后,為了能讓整體項目的loading效果顯得更加貼切我就想創建一個loading控件,希望此控件能夠比較方便的開啟、停止loading效果,而且能易于集成和更換logo。
為了達到這個目的,我創建了一個名為ZYLoading的控件,下面就為大家分享一下我這個控件的原理以及使用方法。
原理分析
此控件的核心思想是利用runtime機制給分類增加成員屬性,通過給UIView擴展開啟、停止loading的方法,從而實現任何UIView的實例都能方便的開啟、停止loading動畫
#import "UIView+ZYLoadingView.h"
#import <objc/runtime.h>
static char LoadingViewKey;
@implementation UIView (ZYLoadingView)
#pragma mark - Setter
// 將創建的ZYLoadingView實例關聯到分類
- (void)setLoadingView:(ZYLoadingView *)loadingView {
[self willChangeValueForKey:@"LoadingViewKey"];
objc_setAssociatedObject(self, &LoadingViewKey, loadingView, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
[self didChangeValueForKey:@"LoadingViewKey"];
}
// 獲取關聯的ZYLoadingView
- (ZYLoadingView *)loadingView {
return objc_getAssociatedObject(self, &LoadingViewKey);
}
// 開啟動畫
- (void)beginLoading {
if (!self.loadingView) {
self.loadingView = [[ZYLoadingView alloc] initWithFrame:self.bounds];
}
[self addSubview:self.loadingView];
[self.loadingView startAnimation];
}
// 停止動畫
- (void)endLoading {
if (self.loadingView) {
[self.loadingView stopAnimation];
}
}
@end
使用方法
通過一組圖片組合成動畫
// 通過枚舉選擇圖片組合動畫
ZYLoadingConfigInstance.loadingType = ZYLoadingAnimateImages;
// 圖片名稱
ZYLoadingConfigInstance.animateImageName = @"zy_loading_";
// 圖片尺寸
ZYLoadingConfigInstance.loopImageSize = CGSizeMake(37, 13);
// 動畫過渡時長
ZYLoadingConfigInstance.duration = 1.f;
通過一張圖旋轉形成動畫
// 通過枚舉選擇通過旋轉圖片展現loading動畫
ZYLoadingConfigInstance.loadingType = ZYLoadingLoopImage;
// 圖片名稱
ZYLoadingConfigInstance.loopImage = [UIImage imageNamed:@"loading_circle"];
// 圖片尺寸
ZYLoadingConfigInstance.loopImageSize = CGSizeMake(60, 60);
// 動畫過渡時長
ZYLoadingConfigInstance.duration = 0.25f;
通過一張圖片旋轉,另一張圖片漸隱漸顯組合成動畫
// 通過枚舉選擇通過旋轉圖片展現loading動畫 ZYLoadingConfigInstance.loadingType = ZYLoadingLoopImage;
// 圖片名稱
ZYLoadingConfigInstance.loopImage = [UIImage imageNamed:@"loading_circle"];
// 圖片尺寸
ZYLoadingConfigInstance.loopImageSize = CGSizeMake(60, 60);
// logo圖片名稱
ZYLoadingConfigInstance.logoImage = [UIImage imageNamed:@"loading_zhangyu"];
// logo圖片尺寸
ZYLoadingConfigInstance.logoImageSize = CGSizeMake(40, 40);
// 動畫過渡時長
ZYLoadingConfigInstance.duration = 0.25f;
開啟、停止動畫
// 開啟動畫
[self.view beginLoading];
// 停止動畫
[self.view endLoading];
你也可以直接參考github上的ZYLoading