IOS-使用CAShapLayer繪制扇形
為了增加應用體驗感，我們動態繪制扇形或者餅狀圖效果。
這里我們使用CAShapeLayer,這樣就不必再-(void)draw函數內繪制圖形
參考代碼
-(void)reDraw
{
CAShapeLayer *chartLine;
if (chartLine!=nil)
{
[chartLine removeAllAnimations];//這樣就能重復繪制餅狀圖了
}
else
{
chartLine = [CAShapeLayerlayer];
chartLine.lineWidth = 40;//這里設置填充線的寬度，這個參數很重要
chartLine.lineCap = kCALineCapButt;設置線端點樣式，這個也是非常重要的一個參數
chartLine.strokeColor = [[UIColor redColor] CGColor];//繪制的線的顏色
chartLine.fillColor = nil;
self.clipsToBounds = NO;//該屬性表示如果圖形繪制超過的容器的范圍是否被裁掉，這里我們設置為YES ，表示要裁掉超出范圍的繪制
[self.layer addSublayer:chartLine];
}
CGMutablePathRef pathRef = CGPathCreateMutable();
CGPathAddArc(pathRef, &CGAffineTransformIdentity,
CGRectGetWidth(self.frame)/2, CGRectGetHeight(self.frame)/2, 60, 0, M_PI*3/2, NO);
chartLine.path = pathRef;
CABasicAnimation *pathAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
pathAnimation.duration = 1.1;//設置繪制動畫持續的時間
pathAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
pathAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
pathAnimation.toValue = [NSNumber numberWithFloat:1.0f];
pathAnimation.autoreverses = NO;//是否翻轉繪制
pathAnimation.fillMode = kCAFillModeForwards;
pathAnimation.repeatCount = 1;
[chartLine addAnimation:pathAnimation forKey:@"strokeEndAnimation"];
chartLine.strokeEnd=1.0f;//表示繪制到百分比多少就停止，這個我們用1表示完全繪制
}
我們先來看看繪制的效果圖：
這里我們有必要說下，扇形（餅狀圖的原理），我們繪制的其實不是扇形，可以說是圓形，我們只是將圓形的邊線寬度變得很寬，比如：我們想要繪制的圓形的半徑是 R = 100，如果我們想繪制扇形就可以設置變寬為 200，因為，線是從中間到圓心來標定半徑的，這樣，邊線寬度= 200，那么，從邊線重新到圓心的距離就是200/2 = 100，這樣你看，100==R，這樣，效果就看起來我們繪制的是餅狀圖了。我們繪制的不是真正的餅狀圖，而是用其他的方法繪制餅狀圖的效果而已，這里我們特別需要主要的是，如果你想成功的繪制餅狀圖，那么你就需要掌握好，圓形半徑以及圓形邊線的寬度值，以及他們之間的比例關系，因為他們之間的關系決定了你要繪制的餅狀圖的效果以及形狀，比如：時候中間有空心，以及空心的大小。
Jason
2014年03月21日