[iOS Animation]-CALayer 專用圖層

專用圖層

複雜的組織都是專門化的

Catharine R. Stimpson

到目前爲止，咱們已經探討過CALayer類了，同時咱們也瞭解到了一些很是有用的繪圖和動畫功能。可是Core Animation圖層不單單能做用於圖片和顏色而已。本章就會學習其餘的一些圖層類，進一步擴展使用Core Animation繪圖的能力。

CAShapeLayer

在第四章『視覺效果』咱們學習到了不使用圖片的狀況下用CGPath去構造任意形狀的陰影。若是咱們能用一樣的方式建立相同形狀的圖層就行了。

CAShapeLayer是一個經過矢量圖形而不是bitmap來繪製的圖層子類。你指定諸如顏色和線寬等屬性，用CGPath來定義想要繪製的圖形，最後CAShapeLayer就自動渲染出來了。固然，你也能夠用Core Graphics直接向原始的CALyer的內容中繪製一個路徑，相比直下，使用CAShapeLayer有如下一些優勢：

• 渲染快速。CAShapeLayer使用了硬件加速，繪製同一圖形會比用Core Graphics快不少。
• 高效使用內存。一個CAShapeLayer不須要像普通CALayer同樣建立一個寄宿圖形，因此不管有多大，都不會佔用太多的內存。
• 不會被圖層邊界剪裁掉。一個CAShapeLayer能夠在邊界以外繪製。你的圖層路徑不會像在使用Core Graphics的普通CALayer同樣被剪裁掉（如咱們在第二章所見）。
• 不會出現像素化。當你給CAShapeLayer作3D變換時，它不像一個有寄宿圖的普通圖層同樣變得像素化。

建立一個CGPath

CAShapeLayer能夠用來繪製全部可以經過CGPath來表示的形狀。這個形狀不必定要閉合，圖層路徑也不必定要不可破，事實上你能夠在一個圖層上繪製好幾個不一樣的形狀。你能夠控制一些屬性好比lineWith（線寬，用點表示單位），lineCap（線條結尾的樣子），和lineJoin（線條之間的結合點的樣子）；可是在圖層層面你只有一次機會設置這些屬性。若是你想用不一樣顏色或風格來繪製多個形狀，就不得不爲每一個形狀準備一個圖層了。

清單6.1 的代碼用一個CAShapeLayer渲染一個簡單的火柴人。CAShapeLayer屬性是CGPathRef類型，可是咱們用UIBezierPath幫助類建立了圖層路徑，這樣咱們就不用考慮人工釋放CGPath了。圖6.1是代碼運行的結果。雖然還不是很完美，可是總算知道了大意對吧！

清單6.1 用CAShapeLayer繪製一個火柴人

#import "DrawingView.h" #import <QuartzCore/QuartzCore.h> @interface ViewController () @property (nonatomic, weak) IBOutlet UIView *containerView; @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; //create path UIBezierPath *path = [[UIBezierPath alloc] init]; [path moveToPoint:CGPointMake(175, 100)];  [path addArcWithCenter:CGPointMake(150, 100) radius:25 startAngle:0 endAngle:2*M_PI clockwise:YES]; [path moveToPoint:CGPointMake(150, 125)]; [path addLineToPoint:CGPointMake(150, 175)]; [path addLineToPoint:CGPointMake(125, 225)]; [path moveToPoint:CGPointMake(150, 175)]; [path addLineToPoint:CGPointMake(175, 225)]; [path moveToPoint:CGPointMake(100, 150)]; [path addLineToPoint:CGPointMake(200, 150)]; //create shape layer CAShapeLayer *shapeLayer = [CAShapeLayer layer]; shapeLayer.strokeColor = [UIColor redColor].CGColor; shapeLayer.fillColor = [UIColor clearColor].CGColor; shapeLayer.lineWidth = 5; shapeLayer.lineJoin = kCALineJoinRound; shapeLayer.lineCap = kCALineCapRound; shapeLayer.path = path.CGPath; //add it to our view  [self.containerView.layer addSublayer:shapeLayer]; } @end

 

圖6.1 用CAShapeLayer繪製一個簡單的火柴人

圓角

第二章裏面提到了CAShapeLayer爲建立圓角視圖提供了一個方法，就是CALayer的cornerRadius屬性（譯者注：實際上是在第四章提到的）。雖然使用CAShapeLayer類須要更多的工做，可是它有一個優點就是能夠單獨指定每一個角。

咱們建立圓角矩形其實就是人工繪製單獨的直線和弧度，可是事實上UIBezierPath有自動繪製圓角矩形的構造方法，下面這段代碼繪製了一個有三個圓角一個直角的矩形：

//define path parameters CGRect rect = CGRectMake(50, 50, 100, 100); CGSize radii = CGSizeMake(20, 20); UIRectCorner corners = UIRectCornerTopRight | UIRectCornerBottomRight | UIRectCornerBottomLeft; //create path UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:rect byRoundingCorners:corners cornerRadii:radii];

 

咱們能夠經過這個圖層路徑繪製一個既有直角又有圓角的視圖。若是咱們想依照此圖形來剪裁視圖內容，咱們能夠把CAShapeLayer做爲視圖的宿主圖層，而不是添加一個子視圖（圖層蒙板的詳細解釋見第四章『視覺效果』）。