【iOS-cocos2d-X 游戏开发之十二】自定义Cocos2dx摇杆(增强Joystick),增加摇杆跟随

简介:

对于虚拟摇杆在游戏开发中必不可少,Android方面的是由Himi自己实现封装的,大家可以移步到这里查看详细实现机制:

【Android游戏开发二十四】360°平滑游戏摇杆(触屏方向导航) 

那么在Cocos2d引擎已提供此摇杆类(Joystick),所以Himi也就懒得重写了,但是Cocos2dx中并没有封装,那么这里Himi给出Cocos2dx版的Joystick(HRocker类),并且Himi对此类添加了一个跟随用户触点作为摇杆坐标的功能!

这里不多说代码结构直接贴出源码,然后重点说下使用与方法参数,具体实现可以参考源码以及Android部分Himi的实现机制;

 


  
  
  1. // 
  2. //  HRocker.h 
  3. //  RockerPro 
  4. // 
  5. //  Created by Himi on 12-3-30. 
  6. //  Copyright (c) 2012年 Himi. All rights reserved. 
  7. // 
  8.   
  9. #ifndef RockerPro_HRocker_h 
  10. #define RockerPro_HRocker_h 
  11.   
  12. #ifndef HRocker_H 
  13. #define HRocker_H 
  14. #include "cocos2d.h" 
  15.   
  16. using namespace cocos2d; 
  17.   
  18. class HRocker :public CCLayer { 
  19.   
  20. public : 
  21.     //初始化 aPoint是摇杆中心 aRadius是摇杆半径 aJsSprite是摇杆控制点 aJsBg是摇杆背景 
  22.     static HRocker*  HRockerWithCenter(CCPoint aPoint ,float aRadius ,CCSprite* aJsSprite,CCSprite* aJsBg,bool _isFollowRole); 
  23.   
  24.     //启动摇杆 
  25.     void Active(); 
  26.   
  27.     //解除摇杆 
  28.     void Inactive(); 
  29.   
  30. private
  31.     HRocker * initWithCenter(CCPoint aPoint ,float aRadius ,CCSprite* aJsSprite,CCSprite* aJsBg,bool _isFollowRole); 
  32.   
  33.     CCPoint centerPoint;//摇杆中心 
  34.   
  35.     CCPoint currentPoint;//摇杆当前位置 
  36.   
  37.     bool active;//是否激活摇杆 
  38.   
  39.     float radius;//摇杆半径 
  40.   
  41.     CCSprite *jsSprite; 
  42.   
  43.     bool isFollowRole;//是否跟随用户点击 
  44.   
  45.     CCPoint getDirection(); 
  46.   
  47.     float getVelocity(); 
  48.   
  49.     void  updatePos(ccTime dt); 
  50.   
  51.     virtual bool ccTouchBegan(CCTouch *pTouch, CCEvent *pEvent); 
  52.     virtual void ccTouchMoved(CCTouch *pTouch, CCEvent *pEvent); 
  53.     virtual void ccTouchEnded(CCTouch *pTouch, CCEvent *pEvent); 
  54.     LAYER_NODE_FUNC(HRocker); 
  55. }; 
  56. #endif 
  57.   
  58. #endif 
 

 


  
  
  1. // 
  2. //  HRocker.cpp 
  3. //  RockerPro 
  4. // 
  5. //  Created by Himi on 12-3-30. 
  6. //  Copyright (c) 2012年 Himi. All rights reserved. 
  7. // 
  8. #include "HRocker.h" 
  9.   
  10. void HRocker::updatePos(ccTime dt){ 
  11.     jsSprite->setPosition(ccpAdd(jsSprite->getPosition(),ccpMult(ccpSub(currentPoint, jsSprite->getPosition()),0.5))); 
  12. //启动摇杆 
  13. void HRocker::Active() 
  14.     if (!active) { 
  15.         active=true
  16.         schedule(schedule_selector(HRocker::updatePos));//添加刷新函数 
  17.         CCTouchDispatcher::sharedDispatcher()->addTargetedDelegate(this, 0,false);//添加触摸委托 
  18.     }else { 
  19.     } 
  20. //解除摇杆 
  21. void   HRocker::Inactive() 
  22.     if (active) { 
  23.         active=false
  24.         this->unschedule(schedule_selector(HRocker::updatePos));//删除刷新 
  25.         CCTouchDispatcher::sharedDispatcher()->removeDelegate(this);//删除委托 
  26.     }else { 
  27.     } 
  28. //摇杆方位 
  29. CCPoint HRocker::getDirection() 
  30.     return ccpNormalize(ccpSub(centerPoint, currentPoint)); 
  31. //摇杆力度 
  32. float HRocker::getVelocity() 
  33.     return ccpDistance(centerPoint, currentPoint); 
  34. HRocker* HRocker:: HRockerWithCenter(CCPoint aPoint ,float aRadius ,CCSprite* aJsSprite,CCSprite* aJsBg,bool _isFollowRole){ 
  35.     HRocker *jstick=HRocker::node(); 
  36.     jstick->initWithCenter(aPoint,aRadius,aJsSprite,aJsBg,_isFollowRole); 
  37.     return jstick; 
  38. bool HRocker::ccTouchBegan(CCTouch* touch, CCEvent* event) 
  39.   
  40.     if (!active) 
  41.         return false
  42.     this->setIsVisible(true); 
  43.     CCPoint touchPoint = touch->locationInView(touch->view()); 
  44.     touchPoint = CCDirector:: sharedDirector()->convertToGL(touchPoint); 
  45.     if(!isFollowRole){ 
  46.         if (ccpDistance(touchPoint, centerPoint) > radius){ 
  47.             return false
  48.         } 
  49.     } 
  50.     currentPoint = touchPoint; 
  51.     if(isFollowRole){ 
  52.         centerPoint=currentPoint; 
  53.         jsSprite->setPosition(currentPoint); 
  54.         this->getChildByTag(88)->setPosition(currentPoint); 
  55.     } 
  56.     return true
  57. void  HRocker::ccTouchMoved(CCTouch* touch, CCEvent* event) 
  58.     CCPoint touchPoint = touch->locationInView(touch->view()); 
  59.     touchPoint = CCDirector:: sharedDirector()->convertToGL(touchPoint); 
  60.     if (ccpDistance(touchPoint, centerPoint) > radius) 
  61.     { 
  62.         currentPoint =ccpAdd(centerPoint,ccpMult(ccpNormalize(ccpSub(touchPoint, centerPoint)), radius)); 
  63.     }else { 
  64.         currentPoint = touchPoint; 
  65.     } 
  66. void  HRocker::ccTouchEnded(CCTouch* touch, CCEvent* event) 
  67.     currentPoint = centerPoint; 
  68.     if(isFollowRole){ 
  69.         this->setIsVisible(false); 
  70.     } 
  71.   
  72. HRocker* HRocker::initWithCenter(CCPoint aPoint ,float aRadius ,CCSprite* aJsSprite,CCSprite* aJsBg,bool _isFollowRole){ 
  73.   
  74.     isFollowRole =_isFollowRole; 
  75.     active = false
  76.     radius = aRadius; 
  77.     if(!_isFollowRole){ 
  78.         centerPoint =aPoint; 
  79.     }else
  80.         centerPoint =ccp(0,0); 
  81.     } 
  82.   
  83.     currentPoint = centerPoint; 
  84.     jsSprite = aJsSprite; 
  85.     jsSprite->setPosition(centerPoint); 
  86.     aJsBg->setPosition(centerPoint); 
  87.     aJsBg->setTag(88); 
  88.     this->addChild(aJsBg); 
  89.     this->addChild(jsSprite); 
  90.     if(isFollowRole){ 
  91.         this->setIsVisible(false); 
  92.     } 
  93.     this->Active();//激活摇杆 
  94.     return this

创建使用方法很eazy,如下函数:

HRocker* HRocker:: HRockerWithCenter(CCPoint aPoint ,float aRadius ,CCSprite* aJsSprite,CCSprite* aJsBg,bool _isFollowRole);

第一个参数aPoint:摇杆中心点的坐标;

第二个参数aRadius: 摇杆的半径

第三个参数:aJsSprite :摇杆的图片资源精灵

第四个参数:aJsBg: 摇杆背景图片资源精灵

第五个参数:isFollowRole:是否让摇杆永远跟随用户触屏点(Himi新添加的功能)

这里对于最后一个参数可能很多童鞋不太理解,那么这里大概描述下:

对于手机游戏而言,虚拟的摇杆并不是一个很好的操作方式,但是为了满足游戏的必要操作无疑必须使用,但是虚拟摇杆存在两方面问题:

1.没有实体感觉,对于用户来说不能触觉上明显分清当前自己有没有触摸在虚拟摇杆上或者当前是按下还是按上等;

2.遮挡部分游戏画面,这一点不仅仅式虚拟摇杆的存在造成遮挡画面,用户使用虚拟摇杆时更加的造成游戏画面被挡住;

3.不容易操作,过于死板,不小心就触发了虚拟摇杆区域之外;

对于虚拟摇杆存在的第一方面没有实体感我们没法改进,但是,是否触摸到虚拟键盘这个可以使用手机震动提示;第二,三方面的问题在当前iOS手机游戏上很多公司采用了让虚拟摇杆跟随用户触屏点为摇杆中心的方式!并且用户不触摸屏幕默认不显示虚拟摇杆;这么一来不仅让游戏画面能在不需要操作的时候尽可能的完美展示外,还能有效避免用户触摸不到摇杆判断区域的问题;摇杆跟随功能就是Himi封装Rocker类创建时第五个参数 isFollowRole,传入true即可跟随!

如果还有童鞋听的不是很清楚,那么将Himi这个Rocker类进行拷贝自己项目中,然后使用以下代码进行创建使用尝试下吧:


  
  
  1. CCSprite *spRocker=CCSprite::spriteWithFile("CloseSelected.png");//摇杆 
  2. CCSprite *spRockerBG=CCSprite::spriteWithFile("rockerBg.png");//摇杆背景 
  3. HRocker *rocker=HRocker::HRockerWithCenter(ccp(210.0f,130.0f),50.0f ,spRocker ,spRockerBG,false);//创建摇杆 
  4. this->addChild(rocker);//摇杆添加到layer中 
  5. //this 是个layer 
  6.   
  7. CCSprite *spRocker2=CCSprite::spriteWithFile("CloseSelected.png");//摇杆 
  8. CCSprite *spRockerBG2=CCSprite::spriteWithFile("rockerBg.png");//摇杆背景 
  9. HRocker* rocker2=HRocker::HRockerWithCenter(ccp(210.0f,130.0f),50.0f ,spRocker2 ,spRockerBG2,true);//创建摇杆 
  10. this->addChild(rocker2);//摇杆添加到layer中 

截图如下:

更多的自定义大家可以自行尝试,Himi就不添加了,毕竟每款游戏都有不同需求~ :hmg:










本文转自 xiaominghimi 51CTO博客,原文链接:http://blog.51cto.com/xiaominghimi/908707,如需转载请自行联系原作者
目录
相关文章
|
6月前
|
iOS开发 UED
实现一个自定义的iOS动画效果
【4月更文挑战第9天】本文将详细介绍如何在iOS平台上实现一个自定义的动画效果。我们将通过使用Core Animation框架来实现这个动画效果,并展示如何在不同的场景中使用它。文章的目标是帮助读者理解如何使用Core Animation框架来创建自定义动画,并提供一个简单的示例代码。
52 1
|
16天前
|
Swift iOS开发 UED
如何使用Swift和UIKit在iOS应用中实现自定义按钮动画
本文通过一个具体案例,介绍如何使用Swift和UIKit在iOS应用中实现自定义按钮动画。当用户点击按钮时,按钮将从圆形变为椭圆形,颜色从蓝色渐变到绿色;释放按钮时,动画以相反方式恢复。通过UIView的动画方法和弹簧动画效果,实现平滑自然的过渡。
31 1
|
25天前
|
Swift iOS开发 UED
如何使用Swift和UIKit在iOS应用中实现自定义按钮动画
【10月更文挑战第18天】本文通过一个具体案例,介绍如何使用Swift和UIKit在iOS应用中实现自定义按钮动画。当用户按下按钮时,按钮将从圆形变为椭圆形并从蓝色渐变为绿色;释放按钮时,动画恢复原状。通过UIView的动画方法和弹簧动画效果,实现平滑自然的动画过渡。
46 5
|
1月前
|
Swift iOS开发 UED
实现一个自定义的iOS动画效果
本文介绍如何使用Swift和UIKit在iOS应用中实现一个自定义按钮动画,当按钮被点击时,其颜色从蓝色渐变为绿色,形状从圆形变为椭圆形,释放后恢复原状。通过UIView动画方法实现这一效果,代码示例展示了动画的平滑过渡和状态切换,有助于提升应用的视觉体验和用户交互。
49 1
|
2月前
|
Swift iOS开发 UED
揭秘一款iOS应用中令人惊叹的自定义动画效果,带你领略编程艺术的魅力所在!
【9月更文挑战第5天】本文通过具体案例介绍如何在iOS应用中使用Swift与UIKit实现自定义按钮动画,当用户点击按钮时,按钮将从圆形变为椭圆形并从蓝色渐变到绿色,释放后恢复原状。文中详细展示了代码实现过程及动画平滑过渡的技巧,帮助读者提升应用的视觉体验与特色。
61 11
|
3月前
|
Swift iOS开发 UED
【绝妙创意】颠覆你的视觉体验!揭秘一款iOS应用中令人惊叹的自定义动画效果,带你领略编程艺术的魅力所在!
【8月更文挑战第13天】本文通过一个具体案例,介绍如何使用Swift与UIKit在iOS应用中创建独特的按钮动画效果。当按钮被按下时,其形状从圆形变化为椭圆形,颜色则从蓝色渐变为绿色;释放后,动画反向恢复原状。利用UIView动画方法及弹簧动画效果,实现了平滑自然的过渡。通过调整参数,开发者可以进一步优化动画体验,增强应用的互动性和视觉吸引力。
51 7
|
API iOS开发
iOS 自定义转场动画 UIViewControllerTransitioning
iOS 自定义转场动画 UIViewControllerTransitioning
93 0
|
Android开发 iOS开发 UED
iOS 自定义收款键盘
在iOS8之前,iOS系统的输入法只能使用苹果官方提供的输入法。 对于中文来说,官方的输入法并不好用,或者说不够好用,词库,联想,云输入等都没有或者和搜狗输入法,百度输入法等有中国特色的输入法相比有一定的差距。
191 0
|
编解码 iOS开发
iOS自定义的emoji表情键盘
iOS自定义的emoji表情键盘
386 0
iOS自定义的emoji表情键盘
iOS8新特性扩展(Extension)应用之四——自定义键盘控件
iOS8新特性扩展(Extension)应用之四——自定义键盘控件
493 0
iOS8新特性扩展(Extension)应用之四——自定义键盘控件