加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

Cocos2d-x 自定义血条及其美化----之游戏开发《赵云要格斗》(4

发布时间:2020-12-14 20:19:12 所属栏目:百科 来源:网络整理
导读:源码:git@github.com:baidang201/ARPG_Zhaoyun.git ///////////////////////////////////////////////////////////////// 转载请 注明出处http://www.jb51.cc/article/p-zfhqmpgp-kh.html 本章要讲解给怎么在界面上加一个血条,老规矩,还是在 Cocos2d-x地

源码:git@github.com:baidang201/ARPG_Zhaoyun.git

/////////////////////////////////////////////////////////////////

转载请注明出处http://www.52php.cn/article/p-zfhqmpgp-kh.html

本章要讲解给怎么在界面上加一个血条,老规矩,还是在Cocos2d-x地图随精灵无限滚动与边缘检测----之游戏开发《赵云要格斗》(3)的基础上进行增加功能的。

在游戏开发中,血条是一个很重要的东西,这里的血条是通过两个图片来完成,一个是前景图(红色),一个是背景图(灰色),通过改变红色图在长度显示,灰色图不变就可实现血量的变化了。当然,这里为了让界面更加好看些,又为血条加了个血框和人物的小头像。

cocos2d-x版本:2.2.5

工程环境:windows7+VS2010

打开方式:将工程放在cocos2d-x安装目录下的project文件夹下用VS打开


先来看看效果吧:由于还没有引入怪物,所以我弄成攻击一次,血条少1或10两种来看看效果


目录:

一、自定义血条类

二、使用自定义血条类并进行美化

三、改变英雄血量



一、自定义血条类

本着后头血条要给怪物来用,所以设计了一个血条类。原理其实就是两个ccsprite对像,控制前景示的大小就可以改变血量了。

首先是资源,在Resources添加以下图片

红血条(前景):

灰血条(背景):

血条框架:

赵云左上角小头像:

头文件ProgressView.h:

[cpp] view plain copy
  1. #ifndef__PROGRESSVIEW_H__
  2. #define__PROGRESSVIEW_H__
  3. #include"cocos2d.h"
  4. usingnamespacecocos2d;
  5. classProgressView:publicCCNode
  6. {
  7. public:
  8. ProgressView();
  9. public:
  10. //设置血条背景
  11. voidsetBackgroundTexture(constchar*pName);
  12. //设置血条前景
  13. voidsetForegroundTexture(//设置总血量
  14. voidsetTotalProgress(floattotal);
  15. //设置当前血量
  16. voidsetCurrentProgress(floatprogress);
  17. //得到当前血量
  18. floatgetCurrentProgress()const;
  19. //得到总血量
  20. floatgetTotalProgress()private:
  21. //设置前景血条显示的长度
  22. voidsetForegroundTextureRect(constCCRect&rect);
  23. CCSprite*m_progressBackground;//背景血条
  24. CCSprite*m_progressForeground;//前景血条
  25. floatm_totalProgress;//总血量
  26. floatm_currentProgress;//当前血量
  27. floatm_scale;//放大倍数
  28. };
  29. #endif

实现文件 ProgressView.cpp:

    #include"ProgressView.h"
  1. ProgressView::ProgressView()
  2. :m_progressBackground(NULL)
  3. ,m_progressForeground(NULL)
  4. ,m_totalProgress(0.0f)
  5. {
  6. }
  7. voidProgressView::setBackgroundTexture(char*pName)
  8. m_progressBackground=CCSprite::create(pName);
  9. this->addChild(m_progressBackground);
  10. }
  11. voidProgressView::setForegroundTexture( m_progressForeground=CCSprite::create(pName);
  12. m_progressForeground->setAnchorPoint(ccp(0.0f,0.5f));//设置锚点
  13. m_progressForeground->setPosition(ccp(-m_progressForeground->getContentSize().width*0.5f,0));
  14. this->addChild(m_progressForeground);
  15. voidProgressView::setTotalProgress(floattotal)
  16. if(m_progressForeground==NULL){return;}
  17. m_scale=m_progressForeground->getContentSize().width/total;
  18. m_totalProgress=total;
  19. voidProgressView::setCurrentProgress(floatprogress)
  20. return;}
  21. if(progress<0.0f){progress=0.0f;}
  22. if(progress>m_totalProgress){progress=m_totalProgress;}
  23. m_currentProgress=progress;
  24. floatrectWidth=progress*m_scale;
  25. constCCPointfrom=m_progressForeground->getTextureRect().origin;
  26. constCCRectrect=CCRectMake(from.x,from.y,rectWidth,m_progressForeground->getContentSize().height);
  27. setForegroundTextureRect(rect);
  28. voidProgressView::setForegroundTextureRect(constCCRect&rect)
  29. m_progressForeground->setTextureRect(rect);
  30. floatProgressView::getCurrentProgress()const
  31. returnm_currentProgress;
  32. floatProgressView::getTotalProgress()const
  33. returnm_totalProgress;
  34. }

好了,这个血条类就定义好了,编译下没报错,可以移值了。


二、使用自定义血条类并进行美化

首先然要用到的地方,就是HelloWorldScene.h中添加头文件#include "ProgressView.h"

然后定义成员变量:

    private:
  1. HRocker*rocker;//摇杆,第一篇摇杆文章中定义的
  2. Hero*hero;///精灵,第一篇摇杆文章中定义的
  3. ControlButton*btn;//按钮控件变量,第二篇自定义按钮定义的
  4. Map*mymap;//地图,第三篇定义的
  5. ProgressView*m_pProgressView;//血条

然后就在init()函数中初始化:

    //设置英雄的血条
  1. m_pProgressView=newProgressView();
  2. m_pProgressView->setPosition(ccp(150,450));
  3. m_pProgressView->setScale(2.2f);
  4. m_pProgressView->setBackgroundTexture("xue_back.png");
  5. m_pProgressView->setForegroundTexture("xue_fore.png");
  6. m_pProgressView->setTotalProgress(100.0f);
  7. m_pProgressView->setCurrentProgress(100.0f);
  8. this->addChild(m_pProgressView,2);
效果:

半血

感觉好丑啊,想想再给血条加个框,再加个小头像

将上面改为:

    m_pProgressView->setCurrentProgress(50.0f);
  1. //下面两个是为了让血条更好好看
  2. CCSprite*xuekuang=CCSprite::create("kuang.png");//添加血条的框架
  3. xuekuang->setPosition(ccp(m_pProgressView->getPositionX(),m_pProgressView->getPositionY()));
  4. CCSprite*touxiang=CCSprite::create("touxiang.png");//添加英雄的左上角的小头像
  5. touxiang->setPosition(ccp(m_pProgressView->getPositionX()-120,153); font-weight:bold; background-color:inherit">this->addChild(touxiang,2);
  6. this->addChild(xuekuang,2);
  7. 下面再来看看效果:

    事实再次证明,美工是多么重要啊!这样子明显好看多了,这时血条有了。

    三、改变英雄血量

    其实这里改变血量很简单了,

    m_pProgressView->setCurrentProgress(改动); 这一句就可以了,那我们要怎么来验证了,我想到了一个方法,攻击一次,血条让它自己少1(初始是100);

    void HelloWorld::update(float delta)函数中改动:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    void HelloWorld::update(float delta)
    {
     
           
    	//判断是否按下摇杆及其类型
    	switch(rocker->rocketDirection)
    	{
    	case 1:
            //CCLog("move %f   %f", hero->getPosition().x, hero->getPosition().y);
            hero->SetAnimationAdv("run_animation.plist","run_animation.png", "run_", 2, 8, rocker->rocketRun);
            if(hero->getPosition().x+2 + hero->GetHeroSprite()->getContentSize().width/2 < visibleSize.width)
            {
                if( mymap->JudgeMapNotEnd(visibleSize, true))
                {
                    if(
                            hero->JudgePositona(visibleSize) //hero  in middle
                       )
                    {
                        //下面是移动地图
                        mymap->MoveMap(hero,visibleSize, true);
                        break;
                    }
                }
                //精灵没到达窗口中间位置或者地图已经移动到边缘了,精灵才可以移动,否则只播放动画
                hero->setPosition(ccp(hero->getPosition().x+2,hero->getPosition().y)); //向右走
                CCLog("move right");
            }        
    		break;
    	case  2:
            //CCLog("move  %f   %f", rocker->rocketRun);
            if(hero->getPosition().y+2 + hero->GetHeroSprite()->getContentSize().height/2 > visibleSize.height)
            {
                break;
            }
            hero->setPosition(ccp(hero->getPosition().x, hero->getPosition().y+2));   //向上走
    		break;
    	case 3:
            //CCLog("move  %f   %f", rocker->rocketRun);
            if(hero->getPosition().x-2 - hero->GetHeroSprite()->getContentSize().width/2 > 0)
            {
                if( mymap->JudgeMapNotEnd(visibleSize, false))
                {
                    if(
                            hero->JudgePositona(visibleSize) //hero  in middle
                       )
                    {
                        //下面是移动地图
                        mymap->MoveMap(hero, false);
                        break;
                    }
                }
     
           
                hero->setPosition(ccp(hero->getPosition().x-2,hero->getPosition().y));   //向左走
                CCLog("move left");
            }        
    		break;
    	case 4:
            //CCLog("move  %f   %f", rocker->rocketRun);
            if(hero->getPosition().y-2 - hero->GetHeroSprite()->getContentSize().height/2 < 0)
            {
                break;
            }
            hero->setPosition(ccp(hero->getPosition().x,hero->getPosition().y-2));   //向下走
    		break;
    	default:
    		hero->StopAnimation();//停止所有动画和运动
    		break;
     
           
        }
    	if(btn->isTouch)
    	{
    		if(hero->IsAttack)//英雄没在攻击
    			return;
    		hero->AttackAnimation("attack1_animation.plist","attack1_animation.png","attack_",6,rocker->rocketRun);
    		m_pProgressView->setCurrentProgress(m_pProgressView->getCurrentProgress()-10); //更改血量
    	}
    }

     
    
    每次减少1:

    每次减少10:

    (编辑:李大同)

    【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读