這里我將展示如何在UIView上讓對象沿著路徑動畫，我將創建路徑并畫到UIView上讓你能都看見，并沿相同的路徑來做動畫。
我在添加到屏幕的UIView完成所有的這些…
首先，我們在屏幕上畫一條曲線
-
//Thisdrawsaquadraticbeziercurvedlinerightacrossthescreen
-
-(
void
)drawACurvedLine{
-
//Createabitmapgraphicscontext,youwilllatergetaUIImagefromthis
-
UIGraphicsBeginImageContext(CGSizeMake(320,460));
-
CGContextRefctx=UIGraphicsGetCurrentContext();
-
-
//Setvariablesinthecontextfordrawing
-
CGContextSetLineWidth(ctx,1.5);
-
CGContextSetStrokeColorWithColor(ctx,[UIColorwhiteColor].CGColor);
-
-
//Setthestartpointofyourdrawing
-
CGContextMoveToPoint(ctx,10,10);
-
//Theendpointofthelineis310,450....i'malsosettingareferencepointof10,450
-
//Aquadraticbeziercurveisdrawnusingthesecoordinates-experimentandseetheresults.
-
CGContextAddQuadCurveToPoint(ctx,10,450,310,450);
-
//Addanothercurve,theoppositeoftheabove-finishingbackwherewestarted
-
CGContextAddQuadCurveToPoint(ctx,310,10,10,10);
-
-
//Drawtheline
-
CGContextDrawPath(ctx,kCGPathStroke);
-
-
//GetaUIImagefromthecurrentbitmapcontextwecreatedatthestartandthenendtheimagecontext
-
UIImage*curve=UIGraphicsGetImageFromCurrentImageContext();
-
UIGraphicsEndImageContext();
-
-
//Withtheimage,weneedaUIImageView
-
UIImageView*curveView=[[UIImageViewalloc]initWithImage:curve];
-
//Settheframeoftheview-whichisusedtopositionitwhenweaddittoourcurrentUIView
-
curveView.frame=CGRectMake(1,1,320,460);
-
curveView.backgroundColor=[UIColorclearColor];
-
[selfaddSubview:curveView];
-
}
現在我我創建了一個關鍵幀動畫，并添加一個和我們話得線一樣的路徑。我們還將畫一個圈，并沿著路徑做動畫:
-
-(
void
)animateCicleAlongPath{
-
//Preparetheanimation-weusekeyframeanimationforanimationsofthiscomplexity
-
CAKeyframeAnimation*pathAnimation=[CAKeyframeAnimationanimationWithKeyPath:@
"position"
];
-
//Setsomevariablesontheanimation
-
pathAnimation.calculationMode=kCAAnimationPaced;
-
//Wewanttheanimationtopersist-notsoimportantinthiscase-butkeptforclarity
-
//Ifweanimatedsomethingfromlefttoright-andwewantedittostayinthenewposition,
-
//thenwewouldneedtheseparameters
-
pathAnimation.fillMode=kCAFillModeForwards;
-
pathAnimation.removedOnCompletion=NO;
-
pathAnimation.duration=5.0;
-
//Letsloopcontinuouslyforthedemonstration
-
pathAnimation.repeatCount=1000;
-
-
//Setupthepathfortheanimation-thisisverysimilarasthecodethedrawtheline
-
//insteadofdrawingtothegraphicscontext,insteadwedrawlinesonaCGPathRef
-
CGPointendPoint=CGPointMake(310,450);
-
CGMutablePathRefcurvedPath=CGPathCreateMutable();
-
CGPathMoveToPoint(curvedPath,NULL,10,10);
-
CGPathAddQuadCurveToPoint(curvedPath,NULL,10,450,310,450);
-
CGPathAddQuadCurveToPoint(curvedPath,NULL,310,10,10,10);
-
-
//Nowwehavethepath,wetelltheanimationwewanttousethispath-thenwereleasethepath
-
pathAnimation.path=curvedPath;
-
CGPathRelease(curvedPath);
-
-
//Wewillnowdrawacircleatthestartofthepathwhichwewillanimatetofollowthepath
-
//Weusethesametechniqueasbeforetodrawtoabitmapcontextandtheneventuallycreate
-
//aUIImageViewwhichweaddtoourview
-
UIGraphicsBeginImageContext(CGSizeMake(20,20));
-
CGContextRefctx=UIGraphicsGetCurrentContext();
-
//Setcontextvariables
-
CGContextSetLineWidth(ctx,1.5);
-
CGContextSetFillColorWithColor(ctx,[UIColorgreenColor].CGColor);
-
CGContextSetStrokeColorWithColor(ctx,[UIColorwhiteColor].CGColor);
-
//Drawacircle-andpaintitwithadifferentoutline(white)andfillcolor(green)
-
CGContextAddEllipseInRect(ctx,CGRectMake(1,1,18,18));
-
CGContextDrawPath(ctx,kCGPathFillStroke);
-
UIImage*circle=UIGraphicsGetImageFromCurrentImageContext();
-
UIGraphicsEndImageContext();
-
-
UIImageView*circleView=[[UIImageViewalloc]initWithImage:circle];
-
circleView.frame=CGRectMake(1,1,20,20);
-
[selfaddSubview:circleView];
-
-
//AddtheanimationtothecircleView-onceyouaddtheanimationtothelayer,theanimationstarts
-
[circleView.layeraddAnimation:pathAnimationforKey:@
"moveTheSquare"
];
-
}
要讓所有的都跑起來，你可以使用init函數：
-
-(id)initWithFrame:(CGRect)frame{
-
if
(self=[superinitWithFrame:frame]){
-
[selfdrawACurvedLine];
-
[selfanimateCicleAlongPath];
-
}
-
return
self;
-
}
在你的ViewController中像這樣寫
-
-(
void
)viewDidLoad{
-
UIView*customView=[[Canvasalloc]initWithFrame:CGRectMake(0,0,320,460)];
-
customView.backgroundColor=[UIColorblackColor];
-
[self.viewaddSubview:customView];
-
[customViewrelease];
-
[superviewDidLoad];
-
}
還有，不要忘記添加 Quartz 引用:
-
#import<QuartzCore/QuartzCore.h>
我確定有很多更好的方式來做這個事，例如使用CALayers 和添加CGImage 到layers。但是那是一些我沒有嘗試的東西。上面的例子應該足夠讓你開始沿著路徑做動畫。
這里是工程拷貝http://blog.devedup.com/wp-content/uploads/2010/06/AnimateAlongAPath.zip
（譯者水平有限，歡迎指正。）
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點擊下面給點支持吧，站長非常感激您！手機微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
