UIBezierPath動(dòng)畫
1哟楷、前幾篇主要是講UIBezierPath 繪制基本圖形叫确,現(xiàn)在我們將這些圖形用動(dòng)畫的形式展示出來担平。
效果圖:
函數(shù)代碼:
/**
*? 曲線動(dòng)畫
*/
-(void)secondBeziePathDrawAnimation
{
//曲線
UIBezierPath *path=[UIBezierPath bezierPath];
//起點(diǎn)
[path moveToPoint:CGPointMake(20, 20)];
// 基本曲線
//[path addQuadCurveToPoint:CGPointMake(self.frame.size.width-30, 20) controlPoint:CGPointMake(self.frame.size.width/2., self.frame.size.height/2.)];
//二次曲線
[path addCurveToPoint:CGPointMake(self.frame.size.width-30, 20) controlPoint1:CGPointMake(self.frame.size.width/4., 0) controlPoint2:CGPointMake(120., 120)];
CAShapeLayer *sLayer=[CAShapeLayer layer];
sLayer.fillColor=[UIColor clearColor].CGColor;
//畫筆顏色
sLayer.strokeColor=[UIColor redColor].CGColor;
//畫筆寬度
sLayer.lineWidth=2.f;
//路徑
sLayer.path=path.CGPath;
sLayer.strokeStart=0.;
sLayer.strokeEnd=1.;
[self.layer addSublayer:sLayer];
//動(dòng)畫效果
CABasicAnimation *slayerAnimat=[CABasicAnimation animationWithKeyPath:@"strokeEnd"];
slayerAnimat.duration=5;
slayerAnimat.fromValue=[NSNumber numberWithFloat:0.];
slayerAnimat.toValue=[NSNumber numberWithFloat:1.];
slayerAnimat.timingFunction=[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
slayerAnimat.fillMode=kCAFillModeForwards;
slayerAnimat.removedOnCompletion=YES;
[sLayer addAnimation:slayerAnimat forKey:@"path"];
}