【iOS-Cocos2d遊戲開發之十三】CCSprite利用Bezier(貝塞爾)做拋物線動作並讓CCSprite同時播放兩個Action動作!

來源:互聯網
上載者:User

 李華明Himi 原創,轉載務必在明顯處註明:
轉載自【黑米GameDev街區】 原文連結: http://www.himigame.com/iphone-cocos2d/480.html

        如果我們想實現讓CCSprite進行拋物線運動的話,那麼我想童鞋們首先會想到利用Box2d或者其他物理引擎去為CCSprite建立物理世界中對應的剛體進行實現,但是反過來想,對於不熟悉Box2d或者其他物理引擎的童鞋,肯定不方便,那麼Himi今天為大家介紹另外一種不實用物理引擎實現CCSprite拋物線方式;

        這裡我直接將封裝好的方法貼上來,注釋都在代碼中了:

//  拋物線    -Himi //mSprite:需要做拋物線的精靈//startPoint:起始位置//endPoint:中止位置//dirTime:起始位置到中止位置的所需時間- (void) moveWithParabola:(CCSprite*)mSprite startP:(CGPoint)startPoint endP:(CGPoint)endPoint dirTime:(float)time{     float sx = startPoint.x;    float sy = startPoint.y;     float ex =endPoint.x+50;    float ey =endPoint.y+150;     int h = [mSprite contentSize].height*0.5;    ccBezierConfig bezier; // 建立貝茲路徑    bezier.controlPoint_1 = ccp(sx, sy); // 起始點    bezier.controlPoint_2 = ccp(sx+(ex-sx)*0.5, sy+(ey-sy)*0.5+200); //控制點    bezier.endPosition = ccp(endPoint.x-30, endPoint.y+h); // 結束位置       CCBezierTo *actionMove = [CCBezierTo actionWithDuration:time bezier:bezier];     [mSprite runAction:actionMove];}

     之前在Android上我也有講解過貝茲路徑的博文,但是Android中不同於cocos2d封裝這個,在cocos2d中的Bezier是封裝為了精靈動作,讓精靈按照貝茲路徑的路線去運動;那麼以上封裝的代碼中對於拋物線運動來說最重要的一點就是建立貝茲路徑的第二個點,這個點控制著精靈路徑的所經過的最高點,這裡務必要知道;

    這種實現方式雖然沒有物理系統對剛體施加力來的真實,但是!我想這段代碼的實用性還是很大的,至少不需要使用box2d引擎相關知識,最重要的優點是不會存在上一章介紹的代碼混編帶來的編譯錯誤~

//----  OK,下面來介紹第二個知識點:

        很多童鞋學習cocos2d,一般不經常更新的動畫,會使用cocos2d封裝的動作,例如旋轉、漸層、位移等等,那麼一旦使用動作後,肯定就有需要兩個動作一起播放的需求,那麼基本上童鞋們大腦中第一閃現的就是利用cocos2d的動作序列  CCSequence,但是效果不理想,原因很簡單,因為顧名思義,既然是動作序列,那就是按照動作的順序一個動作一個動作的進行播放,也就是說利用動作序列只能達到連續播放動作,無法同時播放動作的目的;

        那麼在這裡給大家一個方法能讓兩個動作同時播放的方法:

         這裡為了講解方便,我在剛才封裝的貝茲路徑上的方法上進行修改,添加一個旋轉的動作,讓貝茲路徑運動與旋轉動作同時播放,這裡Himi使用一根“矛”的圖片作用來說明,因為矛與箭的運動方式最常用的動作肯定是一邊旋轉一邊拋物線位移,這樣才更加真實;

        OK,看下封裝角度後的拋物線並同時旋轉方法如下:

      

//  拋物線運動並同時旋轉    -Himi //mSprite:需要做拋物線的精靈//startPoint:起始位置//endPoint:中止位置//startA:起始角度//endA:中止角度//dirTime:起始位置到中止位置的所需時間- (void) moveWithParabola:(CCSprite*)mSprite startP:(CGPoint)startPoint endP:(CGPoint)endPoint startA:(float)startAngle endA:(float)endAngle dirTime:(float)time{     float sx = startPoint.x;    float sy = startPoint.y;     float ex =endPoint.x+50;    float ey =endPoint.y+150;     int h = [mSprite contentSize].height*0.5;    //設定精靈的起始角度    sprite.rotation=startAngle;    ccBezierConfig bezier; // 建立貝茲路徑    bezier.controlPoint_1 = ccp(sx, sy); // 起始點    bezier.controlPoint_2 = ccp(sx+(ex-sx)*0.5, sy+(ey-sy)*0.5+200); //控制點    bezier.endPosition = ccp(endPoint.x-30, endPoint.y+h); // 結束位置       CCBezierTo *actionMove = [CCBezierTo actionWithDuration:time bezier:bezier];     //建立精靈旋轉的動作    CCRotateTo *actionRotate =[CCRotateTo actionWithDuration:time angle:endAngle];    //將兩個動作封裝成一個同時播放進行的動作    CCAction * action = [CCSpawn actions:actionMove, actionRotate, nil];     [mSprite runAction:action];}

  附上運行:

  

   

   左側的矛是起始位置,後側的是拋物線與旋轉兩個動作同時進行運動中的矛~

 

     好了,就講這麼多吧,今天樣書出來了,比較海皮~哈哈;  

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.