Cocos2d-X中使用ProgressTimer实现一些简单的效果

我在上一篇博客中介绍了ProgressTimer的用法,这篇博客决定写一些使用Progress实现一些简单的效果,

程序实例:ProgressTimer实现效果1

首先在工程目录下的Resource文件夹中添加两张图片

       

然后定义一个Progress类

在Progress.h中添加下面的代码

#ifndef _Progress_H_
#define _Progress_H_

#include "cocos2d.h"
USING_NS_CC;

class Progress : public CCLayer
{
public:
    static CCScene* scene();

    bool init();

    CREATE_FUNC(Progress);

    void scheduleFunc(float dt);
};

#endif


在Progress.cpp中添加下面代码

#include "Progress.h"


CCScene* Progress::scene()
{
    CCScene* scene = CCScene::create();

    Progress* layer = Progress::create();

    scene->addChild(layer);

    return scene;
}

bool Progress::init()
{
    CCLayer::init();

    CCSize winSize = CCDirector::sharedDirector()->getWinSize();

    CCPoint center = ccp(winSize.width / 2, winSize.height / 2);

    CCSprite* bg = CCSprite::create("2.png");
    CCSprite* sprite = CCSprite::create("1.png");

    bg->setPosition(center);

    addChild(bg);

    CCProgressTimer* progress = CCProgressTimer::create(sprite);

    progress->setPosition(center);

    addChild(progress);

    //设置进度条的模式
    //kCCProgressTimerTypeBar表示条形模式
    progress->setType(kCCProgressTimerTypeBar);

    //设置进度条变化的方向
    //ccp(0,1)表示沿着y轴变化
    progress->setBarChangeRate(ccp(0,1));

    //设置进度条的起始位置
    //ccp(0,0)表示下面
    progress->setMidpoint(ccp(0,0));

    //设置进度条的ID
    progress->setTag(100);

    //创建一个定时器
    schedule(schedule_selector(Progress::scheduleFunc), 0.1f);

    return true;
}

void Progress::scheduleFunc(float dt)
{
    //通过进度条的ID得到进度条
    CCProgressTimer* progress = (CCProgressTimer*)getChildByTag(100);

   //设置progress的进度,每调用一次进度加一
    progress->setPercentage(progress->getPercentage() + 1);
    
     //当进度大于或者等于100时
    if(progress->getPercentage() >= 100)
    {
          //终止定时器
        unscheduleAllSelectors();
    }
}

执行结果:



程序实例:ProgressTimer实现效果1

首先在工程目录下的Resource文件夹中添加两张图片





在Progress.cpp中添加下面的代码

#include "Progress.h"


CCScene* Progress::scene()
{
    CCScene* scene = CCScene::create();

    Progress* layer = Progress::create();

    scene->addChild(layer);

    return scene;
}

bool Progress::init()
{
    CCLayer::init();
    
    //设置背景颜色为白色
    CCLayerColor* layer = CCLayerColor::create(ccc4(255, 255, 255, 255));   
    addChild(layer);    


    CCSize winSize = CCDirector::sharedDirector()->getWinSize();

    CCPoint center = ccp(winSize.width / 2, winSize.height / 2);

    CCSprite* bg = CCSprite::create("4.png");
    CCSprite* sprite = CCSprite::create("3.png");

    bg->setPosition(center);

    addChild(bg);

    CCProgressTimer* progress = CCProgressTimer::create(sprite);

    progress->setPosition(center);

    addChild(progress);

    //设置进度条的ID
    progress->setTag(100);

    //创建一个定时器
    schedule(schedule_selector(Progress::scheduleFunc), 0.1f);

    return true;
}

void Progress::scheduleFunc(float dt)
{
    //通过进度条的ID得到进度条
    CCProgressTimer* progress = (CCProgressTimer*)getChildByTag(100);

   //设置progress的进度,每调用一次进度加一
    progress->setPercentage(progress->getPercentage() + 1);
    
     //当进度大于或者等于100时
    if(progress->getPercentage() >= 100)
    {
          //终止定时器
        unscheduleAllSelectors();
    }
}


执行结果:




  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
Cocos2d-x实现流光效果可以使用shader来进行渲染。首先,我们需要创建一个自定义的shader,并将其应用于需要实现流光效果的节点上。 在使用Cocos2d-x的过程,我们可以使用GLSL语言编写shader代码。在实现流光效果的shader,我们可以通过改变像素的颜色和透明度来创建流动的效果。 首先,我们定义一个uniform变量time,用于控制流光的移动速度。然后,在片段着色器,通过改变颜色和透明度的计算公式来实现流动的效果。我们可以使用sin函数或者其他数学函数来计算出每个像素点的颜色和透明度,然后将其应用到节点上。 在节点的渲染流程,我们将这个自定义的shader应用到节点上,然后传入时间参数,即更新uniform变量time的值。随着时间的增加,我们就可以看到节点上的流光效果在不断地移动。 为了实现更加逼真的流光效果,我们可以尝试给流光添加一些额外的效果,比如模糊、叠加等。通过调整shader代码的计算公式和传入的参数,我们可以根据自己的需求来调整流光效果的强度和样式。 总结起来,在Cocos2d-x实现流光效果需要创建一个自定义的shader,并将其应用于需要实现效果的节点上。通过改变颜色和透明度的计算公式、传入时间参数等,我们可以实现一个流光效果,使节点看起来具有流动的动画效果

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值