CAShapeLayer
普通CALayer在被初始化時是需要給一個frame值的,這個frame值一般都與給定view的bounds值一致,它本身是有形狀的,而且是矩形.
每個CAShapeLayer對象都代表著將要被渲染到屏幕上的形狀(shape),CAShapeLayer在初始化時也需要給一個frame值,但是,它本身沒有形狀,它的形狀來源于你給定的一個path,然后它去取CGPath值,它與CALayer有著很大的區(qū)別.
并且，系統(tǒng)僅會渲染CAShapeLayer對象的形狀柱蟀，其他任何非CAShapeLayer的自由屬性在渲染是都會被忽略河绽。因此從某種意義上講CAShapeLayer僅是形狀的容器。雖然由于其實CALayer的子類，可以設(shè)置contents疑枯、backgroundColor等屬性廉赔，但這些屬性在渲染時也會被忽略。
- 但是辽慕，CAShapeLayer提供了自身的可設(shè)置性：
| path | fillColor | fillRule | strokeColor |
| strokeStart | strokeEnd | lineWidth | miterLimit |
| lineCap | lineJoin | lineDashPhase | lineDashPattern |
path
動畫路徑，默認為NULL赦肃，不支持隱式動畫溅蛉。路徑可以使用任何的具體子類的動畫CAPropertyAnimation。如果此屬性的值是不為NULL他宛，則path使用指定的路徑船侧，而不是創(chuàng)建該層的合成后的alpha通道。它使用的是非零纏繞規(guī)則和當前顏色厅各，不透明度和模糊半徑填充镜撩。fillColor
填充顏色，默認為不透明的黑色队塘，若值為nil袁梗，則沒有填充效果宜鸯。
fillColor針對于閉合的圖形，對于鏤空圖形只需設(shè)置畫筆顏色strokeColor即可遮怜。
//閉合多邊形
- (void)drawTriangle {
UIView *view = [self.view viewWithTag:1026];
CAShapeLayer *triangle = [CAShapeLayer layer];
triangle.lineWidth = 2;
triangle.strokeColor = [UIColor clearColor].CGColor;
triangle.fillColor = [UIColor redColor].CGColor;
[view.layer addSublayer:triangle];
UIBezierPath *bezierPath = [UIBezierPath bezierPath];
[bezierPath moveToPoint:CGPointMake(kDeviceWidth/2.0, 50)];
[bezierPath addLineToPoint:CGPointMake(kDeviceWidth/2.0-100, 150)];
[bezierPath addLineToPoint:CGPointMake(kDeviceWidth/2.0+100, 150)];
[bezierPath addLineToPoint:CGPointMake(kDeviceWidth/2.0, 50)];
triangle.path = bezierPath.CGPath;
}
fillRule
填充規(guī)則淋袖，默認是kCAFillRuleNonZero。
kCAFillRuleNonZero：指定非零纏繞規(guī)則锯梁。計算每個左到右的路徑+1或-1為每個從右到左的道路即碗。如果所有交叉的總和為0，則點是路徑之外陌凳，如果該和為非零剥懒，改點是在路徑內(nèi)與包含它的區(qū)域被填充。
kCAFillRuleEvenOdd：指定奇偶纏繞規(guī)則合敦。算路徑交叉的總和初橘，如果橫跨的數(shù)目是偶數(shù)，改點在路徑之外蛤肌。如果橫跨的數(shù)目是奇數(shù)壁却，所述點是在路徑內(nèi)與包含它的區(qū)域應(yīng)被填充。strokeColor
畫筆顏色裸准。strokeStart
和strokeEnd組合使用，默認值為1.0赔硫，取值范圍0.0~1.0strokeEnd
和strokeStart組合使用炒俱，默認值為1.0，取值范圍為0.0~1.0lineWidth
線寬爪膊。注意線寬有一個特點权悟，線寬從你設(shè)置的起點往左右兩邊同時伸展。miterLimit
斜接樣式推盛，默認值為10.0-
lineCap
線端點樣式峦阁，默認值為kCALineCapButt，還有kCALineCapRound耘成，kCALineCapSquare
線端點樣式示例 -
lineJoin
拐角樣式榔昔，默認值為kCALineJoinMiter（尖角），還有kCALineJoinRound（圓角）瘪菌，kCALineJoinBevel（平角）
拐角樣式示例 lineDashPhase
沖刺階段應(yīng)用到的形狀的路徑撒会，默認是0.0lineDashPattern
設(shè)置線的樣式，默認為實線师妙，該數(shù)組為一個NSNumber數(shù)組诵肛，數(shù)組中的數(shù)值依次表示虛線中，單個線的長度默穴，和空白的長度怔檩，如:數(shù)組@[@10,@5] 表示 有長度為10的線褪秀，長度為5的空白，不斷循環(huán)后組成的虛線薛训。
當然數(shù)組的長度是不做限制的媒吗，你亦可以@[@2,@3,@4,@5],可以表示為長度為2的線+長度為3的空白+長度為4的線+長度為5的空白，不斷循環(huán)直到線段結(jié)束许蓖。-
mask
mask本身就是個CALayer蝴猪，mask屬性用作裁剪功能。
mask只作為形狀（shape）的樣子膊爪，裁剪后的形狀以mask為準自阱，其他例如顏色等屬性以原圖為準。
兩種mask裁剪示例
- CAShapeLayer有以下幾點特點：
- 它依附于一個
path米酬，必須給予path沛豌，即使path不完整也會自動首尾相接。 -
strokeStart及strokeEnd代表著在這個path中所占用的百分比赃额。 - CAShapeLayer動畫僅限于沿著邊緣的動畫效果加派，它不能直接實現(xiàn)填充效果，但可以間接實現(xiàn)填充效果跳芳。
UIBezierPath
使用UIBezierPath可以創(chuàng)建基于矢量的路徑芍锦，此類是Core Graphics框架關(guān)于路徑的封裝。使用此類可以定義簡單的形狀飞盆，如橢圓娄琉、矩形或有多個直線和曲線組成的形狀等。
UIBezierPath是CGPathRef數(shù)據(jù)類型的封裝吓歇。如果是基于矢量形狀的路徑孽水，都用直線或曲線去創(chuàng)建。我們使用直線段去創(chuàng)建矩形和多邊形城看，使用曲線去創(chuàng)建圓弧女气、圓或其他復(fù)雜的曲線形狀。
- 最基本的初始化方法测柠，用它創(chuàng)建的對象炼鞠，我們可以根據(jù)我們的需要任意定制樣式，可以話任何想畫的圖形鹃愤。
+ (instancetype)bezierPath;
- 初始化一個矩形矩形貝塞爾曲線簇搅。
+ (instancetype)bezierPathWithRect:(CGRect)rect;
- 根據(jù)一個矩形畫內(nèi)切曲線，通常用來畫圓或橢圓（取決于傳入的rect是正方形還是長方形）软吐。
+ (instancetype)bezierPathWithOvalInRect:(CGRect)rect;
- 畫矩形瘩将，但是這個矩形可以畫圓角。第一個參數(shù)是矩形，第二個參數(shù)是圓角大小姿现。
+ (instancetype)bezierPathWithRoundedRect:(CGRect)rect cornerRadius:(CGFloat)cornerRadius;
- 畫矩形肠仪，矩形可以圓角，可以指定某個角或其中多個角成為圓角备典。參數(shù)：
UIRectCornerTopLeft异旧，UIRectCornerTopRight，UIRectCornerBottomLeft提佣，UIRectCornerBottomRight吮蛹，UIRectCornerAllCorners
+ (instancetype)bezierPathWithRoundedRect:(CGRect)rect byRoundingCorners:(UIRectCorner)corners cornerRadii:(CGSize)cornerRadii;
- 畫弧線，參數(shù)說明：
- center 弧線中心點的坐標
- radius 弧線所在圓的半徑
- startAngle 弧線開始的角度值
- endAngle 弧線結(jié)束的角度值
- clockwise 是否順時針畫弧線
+ (instancetype)bezierPathWithArcCenter:(CGPoint)center radius:(CGFloat)radius startAngle:(CGFloat)startAngle endAngle:(CGFloat)endAngle clockwise:(BOOL)clockwise;
CABasicAnimation
CABasicAnimation類的使用方式就是關(guān)鍵幀動畫拌屏，所謂關(guān)鍵幀動畫潮针，就是將Layer的屬性作為keyPath來注冊，指定動畫的起始幀和結(jié)束幀倚喂，然后自動計算和實現(xiàn)中間的過渡動畫的一種動畫方式每篷。
CABasicAnimation自己只有三個property:
@property(nullable, strong) id fromValue;
@property(nullable, strong) id toValue;
@property(nullable, strong) id byValue
當創(chuàng)建一個CABasicAnimation的時候，需要通過 -setFromValue和 -setToValue 來指定一個開始值和結(jié)束值端圈。當你增加基礎(chǔ)動畫到層中的時候焦读，它開始運行。當用屬性做動畫完成時舱权，例如用位置屬性做動畫矗晃，層就會立刻返回到它的初始位置。
- 設(shè)定動畫的屬性說明
| 屬性 | 說明 | |
|---|---|---|
| duration | 動畫時長（單位：秒） | |
| repeatCount | 重復(fù)次數(shù)宴倍，永久重復(fù)的話設(shè)置為HUGE_VALF | |
| beginTime | 指定動畫開始時間喧兄。從開始指定延遲幾秒執(zhí)行的話，請設(shè)置為「CACurrentMediaTime() + 秒數(shù)」的形式 | |
| timingFunction | 設(shè)定動畫的速度變化 | |
| autoreverses | 動畫結(jié)束時是否執(zhí)行逆動畫 | |
| shadowColor | 陰影的顏色 | |
| shadowOffset | 陰影的偏移量 | |
| shadowOpacity | 陰影的透明度 | |
| shadowRadius | 陰影的圓角 | |
| fromValue | 所改變屬性的起始值 | |
| toValue | 所改變屬性的結(jié)束時的值 | |
| byValue | 所改變屬性相同起始值得改變量 | ; |
- 常用的animationWithKeyPath值的總結(jié)
| 值 | 說明 | 使用形式 |
|---|---|---|
| transform.scale | 比例轉(zhuǎn)化 | @(0.8) |
| transform.scale.x | 寬的比例 | @(0.8) |
| transform.scale.y | 高的比例 | @(0.8) |
| transform.rotation.x | 圍繞x軸旋轉(zhuǎn) | @(M_PI) |
| transform.rotation.y | 圍繞y軸旋轉(zhuǎn) | @(M_PI) |
| transform.rotation.z | 圍繞z軸旋轉(zhuǎn) | @(M_PI) |
| cornerRadius | 圓角的設(shè)置 | @(20) |
| backgroundColor | 背景顏色的變化 | [UIColor orangeColor].CGColor; |
| bounds | 大小啊楚，中心不變 | [NSValue valueWithCGRect:CGRectMake(100,100)]; |
| position | 位置(中心點的改變) | [NSValue valueWithCGPoint:CGPointMake(100,100)]; |
| contents | 內(nèi)容(比如UIImageView的圖片) | imageAnima.toValue = (id)[UIImage imageNamed:@“toIcon”].CGImage; |
| opacity | 透明度 | @(0.8) |
| contentsRect.size.width | 橫向拉伸縮放 | @(0.5)最好在0~1之間 |
- 捕獲動畫開始時和終了時的事件
設(shè)置委托對象，實現(xiàn)委托方法浑彰。
/**
* 動畫開始時
*/
- (void)animationDidStart:(CAAnimation *)theAnimation {
NSLog(@"begin");
}
/**
* 動畫結(jié)束時
*/
- (void)animationDidStop:(CAAnimation *)theAnimation finished:(BOOL)flag {
NSLog(@"end");
}
結(jié)語
CAShapeLayer和UIBezierPath規(guī)定一個形狀恭理，CABasicAnimation為其添加動畫。下一篇我將寫具體的實例郭变。最后颜价，非常感謝您閱讀本文。
