前言：最近公司項(xiàng)目有個(gè)需求紊遵，需要實(shí)現(xiàn)讓一個(gè)view沿著橢圓軌跡做動(dòng)畫(huà)，效果實(shí)現(xiàn)后侥蒙，就自己封裝做了一個(gè)小demo暗膜，使用更方便。先看效果：
效果圖中的白色橢圓軌跡線其實(shí)是用貝塞爾曲線畫(huà)出來(lái)的辉哥，為了清晰的看出來(lái)運(yùn)動(dòng)的軌跡桦山。其實(shí)項(xiàng)目中是不顯示軌跡線的攒射，也就是小球是懸空運(yùn)動(dòng)的。若不需要?jiǎng)h除掉即可恒水。
**
實(shí)現(xiàn)步驟：
**
1.首先設(shè)定關(guān)鍵幀動(dòng)畫(huà)CAKeyframeAnimation的一些屬性会放，比如運(yùn)動(dòng)時(shí)間和重復(fù)次數(shù)和calculationMode模式，我們選擇kCAAnimationPaced 使得動(dòng)畫(huà)均勻進(jìn)行钉凌。
CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
pathAnimation.calculationMode = kCAAnimationPaced;
pathAnimation.fillMode = kCAFillModeForwards;
pathAnimation.removedOnCompletion = NO;
pathAnimation.duration = 5.0;
pathAnimation.repeatCount = 2;
2.設(shè)定好關(guān)鍵幀動(dòng)畫(huà)的path咧最，即一個(gè)橢圓形的路徑。需要使用CGPathAddArc御雕，CGPathAddArc經(jīng)常用于畫(huà)正圓矢沿，比如下面就是一個(gè)正圓，各個(gè)參數(shù)的意義：
//160,200為圓心,100為半徑 （startAngle酸纲，endAngle）為起始角度和結(jié)束角度捣鲸，1為順時(shí)針，0 為逆時(shí)針
CGPathAddArc(curvedPath, NULL, 160,200, 100, startAngle, endAngle, 0);
需要注意的是由于iOS中的坐標(biāo)體系是和Quartz坐標(biāo)體系中Y軸相反的闽坡，所以iOS UIView在做Quartz繪圖時(shí)栽惶，Y軸已經(jīng)做了Scale為-1的轉(zhuǎn)換，因此造成CGPathAddArc函數(shù)最后一個(gè)是否是順時(shí)針的參數(shù)結(jié)果正好是相反的疾嗅，也就是說(shuō)如果設(shè)置最后的參數(shù)為YES外厂，根據(jù)參數(shù)定義應(yīng)該是順時(shí)針的，但實(shí)際繪圖結(jié)果會(huì)是逆時(shí)針的代承！
我們需要畫(huà)的是橢圓啊汁蝶，別急，接下來(lái)稍作更改即可论悴。正圓第二個(gè)參數(shù)默認(rèn)為NULL掖棉，我們要改成橢圓，
//短半軸和長(zhǎng)半軸的比例
float radiuscale = 0.5;
//橢圓頂點(diǎn)的坐標(biāo)值
CGFloat origin_x = self.frame.size.width/2;
CGFloat origin_y = self.frame.size.height/2;
//長(zhǎng)半軸的長(zhǎng)
CGFloat radiusX = 100;
CGMutablePathRef curvedPath = CGPathCreateMutable();
CGAffineTransform t2 = CGAffineTransformConcat(CGAffineTransformConcat(
CGAffineTransformMakeTranslation(-origin_x, -origin_y),
CGAffineTransformMakeScale(1, radiuscale)),
CGAffineTransformMakeTranslation(origin_x, origin_y));
CGPathAddArc(curvedPath, &t2, origin_x, origin_y, radiusX,startAngle,endAngle, 1);
pathAnimation.path = curvedPath;
CGPathRelease(curvedPath);
好了膀估，至此啊片，動(dòng)畫(huà)的軌跡和屬性都寫(xiě)好了。添加到view上就ok了玖像。
3.貝塞爾畫(huà)橢圓
如果是整個(gè)橢圓的話紫谷，只需要設(shè)定好理想中的橢圓的外切圓即可。
//整個(gè)橢圓
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context);
UIBezierPath *arc = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(origin_x-100, origin_y-50, 200, 100)];
[[UIColor whiteColor] setStroke];
[arc stroke];
CGContextRestoreGState(context);
**總結(jié): 希望本文能對(duì)你有幫助捐寥。如果你有更好的想法,歡迎和我交流! **
demo地址:https://github.com/xiaochenyi/CircleAnimateDemo
