效果(gif掉真實(shí)際效果可以運(yùn)行demo)：
demo已經(jīng)放在GitHub,里面有更多動畫效果虫腋，在不斷更新田晚，歡迎下載查看，有幫助可以star智润，謝謝及舍！
時(shí)間問題原理在這里不再多敘述，具體實(shí)際實(shí)現(xiàn)見代碼：
LRProgressColor.h
#import <Foundation/Foundation.h>
@interface LRProgressColor : NSObject
/**
存儲的是CGColor的數(shù)組元素
*/
@property (nonatomic, strong)NSArray *cgColors;
/**
顏色起始點(diǎn)
*/
@property (nonatomic, assign)CGPoint startPoint;
/**
顏色結(jié)束點(diǎn)
*/
@property (nonatomic, assign)CGPoint endPoint;
/**
顏色移位一次的動畫時(shí)間
*/
@property (nonatomic, assign)NSTimeInterval duration;
/**
* -----------[ 子類可以重寫該方法 ]-----------
*
* 轉(zhuǎn)換顏色的算法
*
* @return 移位后的顏色數(shù)組
*/
- (NSArray *)accessColors;
#pragma mark - 便利構(gòu)造器方法(自己添加方法) --
+ (instancetype)redGradientColor;
@end
LRProgressColor.m
#import "LRProgressColor.h"
@implementation LRProgressColor
- (instancetype)init{
if (self = [super init]) {
self.startPoint = CGPointMake(0.f, 0.5f);
self.endPoint = CGPointMake(1.f, 0.5f);
self.duration = 0.1f;
}
return self;
}
- (NSArray *)accessColors{
NSMutableArray *mutableArr = [_cgColors mutableCopy];
//第一個(gè)和最后一個(gè)顏色交換實(shí)現(xiàn)位移
id last = mutableArr.lastObject;
[mutableArr removeLastObject];
[mutableArr insertObject:last atIndex:0];
NSArray *colors = [NSArray arrayWithArray:mutableArr];
return colors;
}
+ (instancetype)redGradientColor{
LRProgressColor *color = [[self alloc] init];
NSMutableArray *cgColors = [NSMutableArray array];
[cgColors addObject:(id)[UIColor colorWithRed:0.2f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.2f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.3f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.4f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.5f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.6f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.7f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.8f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.9f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:1.0f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.9f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.8f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.7f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.6f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.5f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.4f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.3f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.2f green:0.f blue:0.f alpha:1.f].CGColor];
[cgColors addObject:(id)[UIColor colorWithRed:0.2f green:0.f blue:0.f alpha:1.f].CGColor];
color.cgColors = cgColors;
color.duration = 0.1f;
return color;
}
@end
LRColorFullProgressView.h
#import <UIKit/UIKit.h>
#import "LRProgressColor.h"
@interface LRColorFullProgressView : UIView
/**
進(jìn)度
*/
@property (nonatomic, assign)CGFloat progress;
/**
進(jìn)度顏色
*/
@property (nonatomic, strong)LRProgressColor *progressColor;
/**
配置生效以及開始運(yùn)行
*/
- (void)configAvailableAndBegin;
/**
便利構(gòu)造器方法
@param frame 尺寸
@param progressColor 顏色值,可以為空
@return 實(shí)例對象
*/
+ (instancetype)colorfulProgressViewWithFrame:(CGRect)frame progressColor:(LRProgressColor *)progressColor;
@end
LRColorFullProgressView.m
#import "LRColorFullProgressView.h"
@interface LRColorFullProgressView()<CAAnimationDelegate>{
/**
* 當(dāng)前view寬度
*/
CGFloat _width;
/**
* 當(dāng)前view高度 用于記錄原始高度
*/
CGFloat _height;
}
@property (nonatomic, strong)UIView *baseView;
@property (nonatomic, strong)CAGradientLayer *gradientLayer;
@end
@implementation LRColorFullProgressView
- (instancetype)initWithFrame:(CGRect)frame{
if (self = [super initWithFrame:frame]) {
_width = self.frame.size.width;
_height = self.frame.size.height;
// baseView
self.baseView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 0, _height)];
_baseView.layer.masksToBounds = YES;
[self addSubview:_baseView];
// gradientLayer
self.gradientLayer = [CAGradientLayer layer];
_gradientLayer.frame = self.bounds;
[self.baseView.layer addSublayer:_gradientLayer];
}
return self;
}
- (void)configAvailableAndBegin{
// 如果沒有設(shè)置ProgressColor,則自己生成一個(gè)
if (_progressColor == nil) {
_progressColor = [[LRProgressColor alloc] init];
NSMutableArray *cgColors = [NSMutableArray array];
for (NSInteger i = 0; i < 360; i+=5) {
//指定HSB窟绷，參數(shù)是：色調(diào)（hue）锯玛，飽和的（saturation），亮度（brightness）
UIColor *color = [UIColor colorWithHue:i/360.0 saturation:1.0 brightness:1.0 alpha:1.0];
[cgColors addObject:(__bridge id)color.CGColor];
}
_progressColor.cgColors = cgColors;
}
_gradientLayer.colors = _progressColor.cgColors;
_gradientLayer.startPoint = _progressColor.startPoint;
_gradientLayer.endPoint = _progressColor.endPoint;
[self animation];
}
- (void)animation{
NSArray *fromColors = _progressColor.cgColors;
//獲取最后一幀
NSArray *toClors = [_progressColor accessColors];
_progressColor.cgColors = toClors;
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"colors"];
animation.fromValue = fromColors;
animation.toValue = toClors;
animation.duration = _progressColor.duration;
animation.fillMode = kCAFillModeForwards;
animation.removedOnCompletion = YES;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
animation.delegate = self;
//layerhuadh
//防止復(fù)原 removedOnCompletion == YES 則需要設(shè)置動畫完后最終顏色
_gradientLayer.colors = toClors;
[_gradientLayer addAnimation:animation forKey:@"colorsAnimation"];
}
#pragma mark-- CAAnimationDelegate --
-(void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag{
[self animation];
}
+ (instancetype)colorfulProgressViewWithFrame:(CGRect)frame progressColor:(LRProgressColor *)progressColor{
LRColorFullProgressView *progressView = [[self alloc] initWithFrame:frame];
if (progressColor) {
progressView.progressColor = progressColor;
}
[progressView configAvailableAndBegin];
return progressView;
}
#pragma mark -- 重寫getter,setter方法 --
@synthesize progress = _progress;
- (void)setProgress:(CGFloat)progress{
_progress = progress;
if (progress <= 0) {
_baseView.frame = CGRectMake(0, 0, 0, _height);
}else if (progress <= 1){
_baseView.frame = CGRectMake(0, 0, _width*progress, _height);
}else{
_baseView.frame = CGRectMake(0, 0, _width, _height);
}
}
- (CGFloat)progress{
return _progress;
}
@end
控制器調(diào)用：
#import "LRColorProgressController.h"
#import "LRColorFullProgressView.h"
#import "LRProgressColor.h"
@interface LRColorProgressController ()
@property (nonatomic, strong)GCDTimer *timer;
@property (nonatomic, strong)LRColorFullProgressView *progressView0;
@property (nonatomic, strong)LRColorFullProgressView *progressView1;
@end
@implementation LRColorProgressController
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor blackColor];
/*
CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.frame = CGRectMake(0, 80, 100, 200);
[self.view.layer addSublayer:gradientLayer];
gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor,
(__bridge id)[UIColor greenColor].CGColor,
(__bridge id)[UIColor blueColor].CGColor];
gradientLayer.locations = @[@0.25,@0.5,@0.75];
gradientLayer.startPoint = CGPointMake(0, 0.5);
gradientLayer.endPoint = CGPointMake(1, 0.5);
*/
// progressView0
self.progressView0 = [LRColorFullProgressView colorfulProgressViewWithFrame:CGRectMake(0, 160, self.view.width, 2.f)
progressColor:nil];
[self.view addSubview:self.progressView0];
// progressView1
self.progressView1 = [LRColorFullProgressView colorfulProgressViewWithFrame:CGRectMake(0, 180, self.view.width, 2.f)
progressColor:[LRProgressColor redGradientColor]];
[self.view addSubview:self.progressView1];
// timer
_timer = [[GCDTimer alloc] initInQueue:[GCDQueue mainQueue]];
[_timer event:^{
CGFloat percent0 = arc4random() % 101 / 100.f;
CGFloat percent1 = arc4random() % 101 / 100.f;
[UIView animateWithDuration:0.5 delay:0 usingSpringWithDamping:1.f initialSpringVelocity:0 options:0 animations:^{
_progressView0.progress = percent0;
_progressView1.progress = percent1;
} completion:^(BOOL finished) {
}];
} timeInterval:NSEC_PER_SEC];
[_timer start];
}
@end
