CAShapeLayer介紹
CAShapeLayer繼承自CALayer闯第，可使用CALayer的所有屬性
CAShapeLayer需要和貝塞爾曲線配合使用才有意義拣宏。貝塞爾曲線可以為其提供形狀鲫骗，而單獨使用CAShapeLayer是沒有任何意義的犬耻。
使用CAShapeLayer與貝塞爾曲線可以實現(xiàn)不在view的DrawRect方法中畫出一些想要的圖形
關(guān)于CAShapeLayer和DrawRect的比較
-
DrawRect：DrawRect屬于CoreGraphic框架，占用CPU执泰，消耗性能大 -
CAShapeLayer：CAShapeLayer屬于CoreAnimation框架枕磁，通過GPU來渲染圖形，節(jié)省性能术吝。動畫渲染直接提交給手機GPU计济，不消耗內(nèi)存
CAShapeLayer使用
請下載Demo 運行CAShapeLayerDemo 工程
- 繪制特別的形狀
CAShapeLayer 有一個神奇的屬性path用這個屬性配合上 UIBezierPath 這個類就可以達到超神的效果。
圖片.png
實現(xiàn)如上圖效果排苍，需要創(chuàng)建一個
UIBezierPath曲線沦寂，賦值給 CAShapeLayer 的path屬性。實現(xiàn)代碼如下 淘衙，圖中紅點表示
startPoint传藏，endPoint，controlPoint1彤守，controlPoint2毯侦，
// 創(chuàng)建 path
UIBezierPath *path = [[UIBezierPath alloc]init];
[path moveToPoint:startPoint];
[path addCurveToPoint:endPoint controlPoint1:controlPoint1 controlPoint2:controlPoint2];
// 創(chuàng)建 shapeLayer
CAShapeLayer *shapeLayer = [[CAShapeLayer alloc]init];
[self.view.layer addSublayer:shapeLayer];
shapeLayer.path = path.CGPath;
shapeLayer.fillColor = [UIColor clearColor].CGColor;
shapeLayer.strokeColor = [UIColor blackColor].CGColor;
shapeLayer.lineWidth = 5;
一些特殊的界面效果，也可以通過CAShapeLayer 繪制出來
圖片.png
CGSize finalSize = CGSizeMake(CGRectGetWidth(self.view.frame), 600);
CGFloat layerHeight = finalSize.height * 0.2;
CAShapeLayer *bottomCurveLayer = [[CAShapeLayer alloc]init];
UIBezierPath *path = [[UIBezierPath alloc]init];
[path moveToPoint:CGPointMake(0, finalSize.height - layerHeight)];
[path addLineToPoint:CGPointMake(0, finalSize.height - 1)];
[path addLineToPoint:CGPointMake(finalSize.width, finalSize.height - 1)];
[path addLineToPoint:CGPointMake(finalSize.width, finalSize.height - layerHeight)];
[path addQuadCurveToPoint:CGPointMake(0, finalSize.height - layerHeight) controlPoint:CGPointMake(finalSize.width / 2, (finalSize.height - layerHeight) - 40)];
bottomCurveLayer.path = path.CGPath;
bottomCurveLayer.fillColor = [UIColor orangeColor].CGColor;
[self.view.layer addSublayer:bottomCurveLayer];
-繪制進度條
圖片.png
// 灰色虛線
@property (nonatomic, strong)CAShapeLayer *baseLayer;
// 彩色虛線
@property (nonatomic, strong)CAShapeLayer *shapeLayer;
// 外圈灰色大圓
@property (nonatomic, strong)CAShapeLayer *bigBaseLayer;
// 帶顏色的大圓
@property (nonatomic, strong)CAShapeLayer *bigShapeLayer;
設(shè)置path 給圖層具垫，
- (void)layoutSubviews {
CGPoint center = CGPointMake(self.bounds.size.width/2, self.bounds.size.height/2);
CGFloat radius = MIN(self.bounds.size.width, self.bounds.size.height)/2 - dashLayerMargin;
UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:center radius:radius startAngle:- M_PI_2 endAngle: (M_PI * 2)- M_PI_2 clockwise:YES];
CGFloat bigRadius = radius + 8;
UIBezierPath *bigPath = [UIBezierPath bezierPathWithArcCenter:center radius:bigRadius startAngle:- M_PI_2 endAngle: (M_PI * 2)- M_PI_2 clockwise:YES];
self.shapeLayer.path = path.CGPath;
self.baseLayer.path = path.CGPath;
self.bigBaseLayer.path = bigPath.CGPath;
self.bigShapeLayer.path = bigPath.CGPath;
[self createGradientLayer];
}
控制進度 使用 layer的strokeEnd 屬性
- (void)setProgress:(CGFloat)progress {
_progress = progress;
self.shapeLayer.strokeEnd = progress;
self.bigShapeLayer.strokeEnd = progress;
}
一些 CAShapeLayer 動畫
這些動畫都基于CAShapeLayer & UIBezierPath 實現(xiàn)各種形狀圖層侈离，使用 CoreAnimation顯式動畫控制圖層的變化。
動畫實現(xiàn)的關(guān)鍵是將復(fù)雜任務(wù)拆分成多個可實現(xiàn)的簡單任務(wù)筝蚕，然后選擇合適的方法實現(xiàn)
收錄下面這些動畫卦碾，可以在需要時為動畫實現(xiàn)提供參考，這里不做贅述饰及。，詳見Demo中的
CAShapeLayerDemo 康震，
OneLoadingAnimation 燎含，
ChangeAnimation
