demo地址：https://github.com/xiaochaofeiyu/YSCAnimation
有用的話求個(gè)star，歡迎建議討論。
1. CAGradientLayer實(shí)現(xiàn)漸變
CAGradientLayer是CALayer的一個(gè)特殊子類，用于生成顏色漸變的圖層，使用較為方便，下面介紹下它的相關(guān)屬性：
colors? ? 漸變的顏色
locations? ? 漸變顏色的分割點(diǎn)
startPoint&endPoint? ? 顏色漸變的方向，范圍在(0,0)與(1.0,1.0)之間，如(0,0)(1.0,0)代表水平方向漸變,(0,0)(0,1.0)代表豎直方向漸變
CAGradientLayer*gradientLayer = [CAGradientLayerlayer];? ? gradientLayer.colors= @[(__bridgeid)[UIColorredColor].CGColor, (__bridgeid)[UIColoryellowColor].CGColor, (__bridgeid)[UIColorblueColor].CGColor];? ? gradientLayer.locations= @[@0.3, @0.5, @1.0];? ? gradientLayer.startPoint=CGPointMake(0,0);? ? gradientLayer.endPoint=CGPointMake(1.0,0);? ? gradientLayer.frame=CGRectMake(0,100,300,100);? ? [self.view.layeraddSublayer:gradientLayer];
CAGradientLayer實(shí)現(xiàn)漸變標(biāo)間簡單直觀，但存在一定的局限性，比如無法自定義整個(gè)漸變區(qū)域的形狀，如環(huán)形、曲線形的漸變。
2. Core Graphics相關(guān)方法實(shí)現(xiàn)漸變
iOS Core Graphics中有兩個(gè)方法用于繪制漸變顏色，CGContextDrawLinearGradient可以用于生成線性漸變，CGContextDrawRadialGradient用于生成圓半徑方向顏色漸變。函數(shù)可以自定義path，無論是什么形狀都可以，原理都是用來做Clip，所以需要在CGContextClip函數(shù)前調(diào)用CGContextAddPath函數(shù)把CGPathRef加入到Context中。
另外一個(gè)需要注意的地方是漸變的方向，方向是由兩個(gè)點(diǎn)控制的，點(diǎn)的單位就是坐標(biāo)。因此需要正確從CGPathRef中找到正確的點(diǎn)，方法當(dāng)然有很多種看具體實(shí)現(xiàn)，本例中，我就是簡單得通過調(diào)用CGPathGetBoundingBox函數(shù)，返回CGPathRef的矩形區(qū)域，然后根據(jù)這個(gè)矩形取兩個(gè)點(diǎn)，讀者可以根據(jù)自行需求修改具體代碼。
1-> 線性漸變
- (void)drawLinearGradient:(CGContextRef)context? ? ? ? ? ? ? ? ? ? ? path:(CGPathRef)path? ? ? ? ? ? ? ? startColor:(CGColorRef)startColor? ? ? ? ? ? ? ? ? endColor:(CGColorRef)endColor{CGColorSpaceRefcolorSpace =CGColorSpaceCreateDeviceRGB();CGFloatlocations[] = {0.0,1.0};NSArray*colors = @[(__bridgeid) startColor, (__bridgeid) endColor];CGGradientRefgradient =CGGradientCreateWithColors(colorSpace, (__bridgeCFArrayRef) colors, locations);CGRectpathRect =CGPathGetBoundingBox(path);//具體方向可根據(jù)需求修改CGPointstartPoint =CGPointMake(CGRectGetMinX(pathRect),CGRectGetMidY(pathRect));CGPointendPoint =CGPointMake(CGRectGetMaxX(pathRect),CGRectGetMidY(pathRect));CGContextSaveGState(context);CGContextAddPath(context, path);CGContextClip(context);CGContextDrawLinearGradient(context, gradient, startPoint, endPoint,0);CGContextRestoreGState(context);CGGradientRelease(gradient);CGColorSpaceRelease(colorSpace);}- (void)viewDidLoad {? ? [superviewDidLoad];// Do any additional setup after loading the view.//創(chuàng)建CGContextRefUIGraphicsBeginImageContext(self.view.bounds.size);CGContextRefgc =UIGraphicsGetCurrentContext();//創(chuàng)建CGMutablePathRefCGMutablePathRefpath =CGPathCreateMutable();//繪制PathCGRectrect =CGRectMake(0,100,300,200);CGPathMoveToPoint(path,NULL,CGRectGetMinX(rect),CGRectGetMinY(rect));CGPathAddLineToPoint(path,NULL,CGRectGetMidX(rect),CGRectGetMaxY(rect));CGPathAddLineToPoint(path,NULL,CGRectGetWidth(rect),CGRectGetMaxY(rect));CGPathCloseSubpath(path);//繪制漸變[selfdrawLinearGradient:gc path:path startColor:[UIColorgreenColor].CGColorendColor:[UIColorredColor].CGColor];//注意釋放CGMutablePathRefCGPathRelease(path);//從Context中獲取圖像，并顯示在界面上UIImage*img =UIGraphicsGetImageFromCurrentImageContext();UIGraphicsEndImageContext();UIImageView*imgView = [[UIImageViewalloc] initWithImage:img];? ? [self.viewaddSubview:imgView];}
2->? 圓半徑方向漸變
- (void)drawRadialGradient:(CGContextRef)context? ? ? ? ? ? ? ? ? ? ? path:(CGPathRef)path? ? ? ? ? ? ? ? startColor:(CGColorRef)startColor? ? ? ? ? ? ? ? ? endColor:(CGColorRef)endColor{CGColorSpaceRefcolorSpace =CGColorSpaceCreateDeviceRGB();CGFloatlocations[] = {0.0,1.0};NSArray*colors = @[(__bridgeid) startColor, (__bridgeid) endColor];CGGradientRefgradient =CGGradientCreateWithColors(colorSpace, (__bridgeCFArrayRef) colors, locations);CGRectpathRect =CGPathGetBoundingBox(path);CGPointcenter =CGPointMake(CGRectGetMidX(pathRect),CGRectGetMidY(pathRect));CGFloatradius = MAX(pathRect.size.width/2.0, pathRect.size.height/2.0) * sqrt(2);CGContextSaveGState(context);CGContextAddPath(context, path);CGContextEOClip(context);CGContextDrawRadialGradient(context, gradient, center,0, center, radius,0);CGContextRestoreGState(context);CGGradientRelease(gradient);CGColorSpaceRelease(colorSpace);}- (void)viewDidLoad {? ? [superviewDidLoad];// Do any additional setup after loading the view.//創(chuàng)建CGContextRefUIGraphicsBeginImageContext(self.view.bounds.size);CGContextRefgc =UIGraphicsGetCurrentContext();//創(chuàng)建CGMutablePathRefCGMutablePathRefpath =CGPathCreateMutable();//繪制PathCGRectrect =CGRectMake(0,100,300,200);CGPathMoveToPoint(path,NULL,CGRectGetMinX(rect),CGRectGetMinY(rect));CGPathAddLineToPoint(path,NULL,CGRectGetMidX(rect),CGRectGetMaxY(rect));CGPathAddLineToPoint(path,NULL,CGRectGetWidth(rect),CGRectGetMaxY(rect));CGPathAddLineToPoint(path,NULL,CGRectGetWidth(rect),CGRectGetMinY(rect));CGPathCloseSubpath(path);//繪制漸變[selfdrawRadialGradient:gc path:path startColor:[UIColorgreenColor].CGColorendColor:[UIColorredColor].CGColor];//注意釋放CGMutablePathRefCGPathRelease(path);//從Context中獲取圖像，并顯示在界面上UIImage*img =UIGraphicsGetImageFromCurrentImageContext();UIGraphicsEndImageContext();UIImageView*imgView = [[UIImageViewalloc] initWithImage:img];? ? [self.viewaddSubview:imgView];}
3. 以CAShapeLayer作為layer的mask屬性
CALayer的mask屬性可以作為遮罩讓layer顯示mask遮住(非透明)的部分；CAShapeLayer為CALayer的子類，通過path屬性可以生成不同的形狀，將CAShapeLayer對象用作layer的mask屬性的話，就可以生成不同形狀的圖層。故生成顏色漸變有以下幾個(gè)步驟：
生成一個(gè)imageView(也可以為layer)，image的屬性為顏色漸變的圖片
生成一個(gè)CAShapeLayer對象，根據(jù)path屬性指定所需的形狀
將CAShapeLayer對象賦值給imageView的mask屬性
- (void)viewDidLoad{? ? [superviewDidLoad];? ? [self.viewaddSubview:self.firstCircle];? ? _firstCircle.frame=CGRectMake(0,0,200,200);? ? _firstCircle.center=CGPointMake(CGRectGetWidth(self.view.bounds) /2.0,CGRectGetHeight(self.view.bounds) /2.0);CGFloatfirsCircleWidth =5;self.firstCircleShapeLayer= [selfgenerateShapeLayerWithLineWidth:firsCircleWidth];? ? _firstCircleShapeLayer.path= [selfgenerateBezierPathWithCenter:CGPointMake(100,100) radius:100].CGPath;? ? _firstCircle.layer.mask= _firstCircleShapeLayer;} - (CAShapeLayer*)generateShapeLayerWithLineWidth:(CGFloat)lineWidth{CAShapeLayer*waveline = [CAShapeLayerlayer];? ? waveline.lineCap= kCALineCapButt;? ? waveline.lineJoin= kCALineJoinRound;? ? waveline.strokeColor= [UIColorredColor].CGColor;? ? waveline.fillColor= [[UIColorclearColor]CGColor];? ? waveline.lineWidth= lineWidth;? ? waveline.backgroundColor= [UIColorclearColor].CGColor;returnwaveline;}- (UIBezierPath*)generateBezierPathWithCenter:(CGPoint)center radius:(CGFloat)radius{UIBezierPath*circlePath = [UIBezierPathbezierPathWithArcCenter:center radius:radius startAngle:0endAngle:2*M_PI clockwise:NO];returncirclePath;}- (UIImageView*)firstCircle{if(!_firstCircle) {self.firstCircle= [[UIImageViewalloc] initWithImage:[UIImageimageNamed:@"circleBackground"]];? ? ? ? _firstCircle.layer.masksToBounds=YES;? ? ? ? _firstCircle.alpha=1.0;? ? }return_firstCircle;}
demo地址：https://github.com/xiaochaofeiyu/YSCAnimation
在YSCNewVoiceWaveView與YSCVoiceLoadingCircleView中
