# 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 @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`作為視圖的宿主圖層，而不是添加一個子視圖（圖層蒙板的詳細解釋見第四章『視覺效果』）。