這里我將展示如何在UIView上讓對(duì)象沿著路徑動(dòng)畫，我將創(chuàng)建路徑并畫到UIView上讓你能都看見，并沿相同的路徑來(lái)做動(dòng)畫。

我在添加到屏幕的UIView完成所有的這些…

首先，我們?cè)谄聊簧袭嬕粭l曲線

    

      

        
          
            //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]; 
        
      
      

        
          }
        
      
    
  

現(xiàn)在我我創(chuàng)建了一個(gè)關(guān)鍵幀動(dòng)畫，并添加一個(gè)和我們?cè)挼镁€一樣的路徑。我們還將畫一個(gè)圈，并沿著路徑做動(dòng)畫:

    

      

        
          
            -(
          
          
            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"
        
        
          ]; 
        
      
      

        
          }
        
      
    
  

要讓所有的都跑起來(lái)，你可以使用init函數(shù)：

    

      

        
          
            -(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>
          
          
          
        
      
    
  

我確定有很多更好的方式來(lái)做這個(gè)事，例如使用CALayers 和添加CGImage 到layers。但是那是一些我沒有嘗試的東西。上面的例子應(yīng)該足夠讓你開始沿著路徑做動(dòng)畫。

這里是工程拷貝http://blog.devedup.com/wp-content/uploads/2010/06/AnimateAlongAPath.zip

（譯者水平有限，歡迎指正。）

iPhone: 對(duì)象沿路徑動(dòng)畫