iOS開發CoreAnimation解讀之三——幾種常用Layer的使用解析

一、CAEmitterLayer

????????CAEmitterLayer是CoreAnimation框架中的粒子發射層，在以前的一片博客中有詳細的介紹和范例，這里不再重復，地址如下：

粒子效果的應用和火焰范例：http://my.oschina.net/u/2340880/blog/485095

二、CAGradientLayer

????????CAGradientLayer是用于色彩梯度展示的layer圖層，通過CAGradientLayer，我們可以很輕松的創建出有過渡效果的色彩圖。其中屬性如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

/* 顏色數組，設置我們需要過的的顏色，必須是CGColor對象 */ @property(nullable,?copy)?NSArray?*colors; /* 顏色開始進行過渡的位置 這個數組中的元素是NSNumber類型，單調遞增的，并且在0——1之間 例如，如果我們設置兩個顏色進行過渡，這個數組中寫入0.5，則第一個顏色會在達到layer一半的時候開始向第二個顏色過渡 */ @property(nullable,?copy)?NSArray<NSNumber?*>?*locations; /* 下面兩個參數用于設置渲染顏色的起點和終點?取值范圍均為0——1 默認起點為（0.5?，0）?終點為（0.5?，1）,顏色的過渡范圍就是沿y軸從上向下 */ @property?CGPoint?startPoint; @property?CGPoint?endPoint; /* 渲染風格?iOS中只支持一種默認的kCAGradientLayerAxial，我們無需手動設置 */ @property(copy)?NSString?*type;

用如下代碼創建一個度過視圖的效果：

?

1 2 3 4 5 6 7 8

????CAGradientLayer?*?layer?=?[CAGradientLayer?layer]; ????layer.colors?=?@[(id)[UIColor?redColor].CGColor,(id)[UIColor?blueColor].CGColor,(id)[UIColor?greenColor].CGColor]; ????layer.locations?=?@[@0.1,@0.7,@1]; ????layer.bounds?=?CGRectMake(0,?0,?100,?100); ????layer.position?=?CGPointMake(100,?100); ????layer.startPoint?=?CGPointMake(0,?0); ????layer.endPoint?=?CGPointMake(1,?1); ????[self.view.layer?addSublayer:layer];

效果如下：

三、CAReplicatorLayer

????????CAReplocatorLayer是拷貝視圖容器，我們可以通過它，將其中的子layer進行拷貝，并進行一些差異處理，其中常用屬性方法如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

//拷貝的次數 @property?NSInteger?instanceCount; //是否開啟景深效果 @property?BOOL?preservesDepth; //當CAReplicatorLayer的子Layer層進行動畫的時候，拷貝的副本執行動畫的延時 @property?CFTimeInterval?instanceDelay; //拷貝副本的3D變換 @property?CATransform3D?instanceTransform; //拷貝副本的顏色變換 @property(nullable)?CGColorRef?instanceColor; //每個拷貝副本的顏色偏移參數 @property?float?instanceRedOffset; @property?float?instanceGreenOffset; @property?float?instanceBlueOffset; //每個拷貝副本的透明度偏移參數 @property?float?instanceAlphaOffset;

例如，通過拷貝一個色塊，使其產生平移排列：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

????CAReplicatorLayer?*reLayer?=?[CAReplicatorLayer?layer]; ????reLayer.position?=?CGPointMake(0,?0); ????CALayer?*?layer=?[CALayer?layer]; ????[reLayer?addSublayer:layer]; ????[self.view.layer?addSublayer:reLayer]; ????layer.bounds?=?CGRectMake(0,?0,?20,?20); ????layer.position?=?CGPointMake(30,?100); ????layer.backgroundColor?=?[UIColor?redColor].CGColor; ????//每個副本向右平移25px ????reLayer.instanceTransform=CATransform3DMakeTranslation(25,?0,?0); ????//如果進行動畫，副本延時一秒執行 ????reLayer.instanceDelay?=?1; ????//拷貝十個副本 ????reLayer.instanceCount?=?10;

效果如下：

四、CAShapeLayer

????????CAShapeLayer是圖形layer層，我們可以自定義這個層的形狀。先來看其中我們可以使用的屬性和方法：

?

1	@property(nullable)?CGPathRef?path;

path屬性為CAShapeLayer設置一個邊界路徑，例如我們可以創建一個三角形的路徑通過如下代碼：

?

1 2 3 4 5 6 7 8

????CAShapeLayer?*?layer?=?[CAShapeLayer?layer]; ????layer.position=CGPointMake(0,0); ????CGMutablePathRef?path?=?CGPathCreateMutable(); ????CGPathMoveToPoint(path,?0,?100,?100); ????CGPathAddLineToPoint(path,?0,?300,?100); ????CGPathAddLineToPoint(path,?0,?200,?200); ????CGPathAddLineToPoint(path,?0,?100,?100); ????layer.path=path;

僅僅有路徑，不能將我們想要的形狀畫出來，下面一些屬性可以對圖形的一些基礎屬性進行設置：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40

//設置圖形的填充顏色 @property(nullable)?CGColorRef?fillColor; /* 設置圖形的填充規則?選項如下： 非零填充 ?NSString?*const?kCAFillRuleNonZero; ?奇偶填充 ?NSString?*const?kCAFillRuleEvenOdd; */ @property(copy)?NSString?*fillRule; //設置線條顏色 @property(nullable)?CGColorRef?strokeColor; //設置線條的起點與終點?0-1之間 @property?CGFloat?strokeStart; @property?CGFloat?strokeEnd; //設置線條寬度 @property?CGFloat?lineWidth; //設置兩條線段相交時銳角斜面長度 @property?CGFloat?miterLimit; /* 設置線條首尾的外觀 可選參數如下 無形狀 ?NSString?*const?kCALineCapButt; ?圓形 ?NSString?*const?kCALineCapRound; ?方形 ?NSString?*const?kCALineCapSquare; */ @property(copy)?NSString?*lineCap; /* 設置線段的鏈接方式 棱角 ?NSString?*const?kCALineJoinMiter; ?平滑 ?NSString?*const?kCALineJoinRound; ?折線 ?NSString?*const?kCALineJoinBevel; */ @property(copy)?NSString?*lineJoin;

修改一下上面的代碼，如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

CAShapeLayer?*?layer?=?[CAShapeLayer?layer]; ????layer.position=CGPointMake(0,0); ????CGMutablePathRef?path?=?CGPathCreateMutable(); ????CGPathMoveToPoint(path,?0,?100,?100); ????CGPathAddLineToPoint(path,?0,?300,?100); ????CGPathAddLineToPoint(path,?0,?200,?200); ????CGPathAddLineToPoint(path,?0,?100,?100); ????layer.path=path; ????layer.fillColor=?[UIColor?redColor].CGColor; ????layer.fillRule?=?kCAFillRuleEvenOdd; ????layer.strokeColor?=?[UIColor?blueColor].CGColor; ????layer.strokeStart?=0; ????layer.strokeEnd?=0.5; ????layer.lineWidth?=?5; ????layer.miterLimit?=?1; ????layer.lineJoin?=?kCALineJoinMiter; ????[self.view.layer?addSublayer:layer];

效果如下：

除此之外，我們還可以設置邊界的線條為虛線，通過下面兩個屬性：

?

1 2 3 4 5 6 7

????//設置線段的寬度為5px?間距為10px ????/* ????這個數組中還可以繼續添加，會循環進行設置?例如?5?2?1?3?則第一條線段5px，間距2px，第二條線段1px?間距3px再開始第一條線段 ????*/ ????layer.lineDashPattern?=?@[@05,@10]; ????//設置從哪個位置開始 ????layer.lineDashPhase?=5;

如下：

五、CATextLayer

????????CATextLayer可以進行文本的繪制，屬性方法如下：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

//渲染的文字字符串 @property(nullable,?copy)?id?string; //設置字體 @property(nullable)?CFTypeRef?font; //設置字號 @property?CGFloat?fontSize; //設置文字顏色 @property(nullable)?CGColorRef?foregroundColor; //是否換行 @property(getter=isWrapped)?BOOL?wrapped; /* 設置截斷模式 ?NSString?*?const?kCATruncationNone; ?截斷前部分 ?NSString?*?const?kCATruncationStart; ?截斷后部分 ?NSString?*?const?kCATruncationEnd; ?截斷中間 ?NSString?*?const?kCATruncationMiddle; */ @property(copy)?NSString?*truncationMode; /* 設置文字對齊模式 ?NSString?*?const?kCAAlignmentNatural; ?NSString?*?const?kCAAlignmentLeft; ?NSString?*?const?kCAAlignmentRight; ?NSString?*?const?kCAAlignmentCenter; ?NSString?*?const?kCAAlignmentJustified; */ @property(copy)?NSString?*alignmentMode;

總結

以上是生活随笔為你收集整理的iOS开发CoreAnimation解读之三——几种常用Layer的使用解析的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。