首页 > 代码库 > CCPlace,CCFlip*,CCToggleVisibility,CCMoveTo*,CCJumpTo*,CCScale*,CCRotate*,CCSkew*,fade,CCCardinalSp*
CCPlace,CCFlip*,CCToggleVisibility,CCMoveTo*,CCJumpTo*,CCScale*,CCRotate*,CCSkew*,fade,CCCardinalSp*
1 CCAction动作
CCAction作为一个基类,其实质是一个接口(即抽象类),由它派生的实现类(如运动和转动等)才是我们实际使用的动作。CCAction的绝大多数实现类都派生自CCFiniteTimeAction。由CCFiniteTimeAction派生出的两个主要类分别是瞬时动作(CCActionInstant)和持续性动作(CCActionInterval)。
2 CCActionInstant瞬时动作
A 总述
瞬时动作是指能立刻完成的动作,是CCFiniteTimeAction中动作持续
时间为0的特例。更准确地说,这类动作是在下一帧会立刻执行并完成的
动作,如设定位置、设定缩放等。这些动作原本可以通过简单地对CCNode
赋值完成,但是把它们包装为动作后,可以方便地与其他动作类组合为复杂
动作。
B 组成
C详解
//设置位置 CCPlace * place = CCPlace::create(ccp(300,200)); //设置x反转 CCAction *flipy =CCFlipY::create(true); //设置y反转 CCAction *flipx = CCFlipX::create(true); CCShow * show = CCShow::create(); CCDelayTime *dt = CCDelayTime::create(2.0f); CCHide * hide = CCHide::create(); //显示或隐藏 CCSequence *seq = CCSequence::create(show, dt, hide, dt, show, NULL); CCToggleVisibility * togglev = CCToggleVisibility::create(); //触发显示或隐藏 CCSequence *seq = CCSequence::create(togglev, dt, togglev, dt,togglev,NULL); |
3 CCPlace案例
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); addChild(man); CCDelayTime *dt =CCDelayTime::create(0.4);
//将图像显示到指定的位置 CCPlace *place = CCPlace::create(ccp(50,160)); man->runAction(place);
returntrue; }
运行结果: |
4CCFlipX沿着Y轴反转
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); addChild(man); //这是延时 CCDelayTime *dt =CCDelayTime::create(2.0f);
//将图像显示到指定的位置 CCPlace *place =CCPlace::create(ccp(50,160)); CCFlipY *flip =CCFlipY::create(true);
//这里是一个动作序列 CCSequence *seq =CCSequence::create(place,dt,flip,NULL); man->runAction(seq);
returntrue; } 运行结果: |
5 CCToggleVisibility
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160)); addChild(man); //这是延时 CCDelayTime *dt =CCDelayTime::create(1.0f);
CCPlace *place = CCPlace::create(ccp(50, 160));
//让sprite显示 CCToggleVisibility *tv =CCToggleVisibility::create(); CCSequence *seq =CCSequence::create(place,dt,tv,dt,tv,NULL); man->runAction(seq);
returntrue; } |
CCActionInterval延时动作
A总述
持续性动作是在持续的一段时间里逐渐完成的动作,也就是要跨多个帧循环来完成,如精灵从一个点连续地移动到另一个点,每一帧内移动一点,我们看到的是帧循环的累积效应。
与瞬时动作相比,持续性动作的种类更丰富。由于这些动作将持续一段时间,所以大多数的持续性动作都会带有一个用于控制动作执行时间的实型参数duration。
每一种持续性动作通常都存在两个不同的变种动作,分别具有To和By后缀:后缀为To的动作描述了节点属性的绝对变化。例如CCMoveTo将对象移动到一个特定的位置;而后缀By的动作则属性值相对的变化,如CCMoveBy将对象移动一段相对位移。
B 组成
C详解
CCMoveTo * to = CCMoveTo::create(2, ccp(300, 160)); CCMoveBy * by = CCMoveBy::create(2, ccp(300, 160)); CCMoveBy * by2 = CCMoveBy::create(2, ccp(200,0)); //第一个参数为,动作持续的时间,第二个参数为,To目标坐标点,By为偏移坐标 |
CCJumpTo * to = CCJumpTo::create(2, ccp(300, 160), 50, 1); CCJumpBy * by = CCJumpBy::create(2, ccp(200, 0), 50, 1); CCJumpBy * by2 = CCJumpBy::create(2, ccp(0, 0), 50, 1); //第二个参考为 表示跳跃的终点或距离,第三个参数为 表示最大高度,第四个参数为表示跳跃次数 |
6CCMoveToCCMoveBy
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160)); addChild(man); //这是延时 CCDelayTime *dt =CCDelayTime::create(1.0f);
//3秒中将位置移动到ccp(300,160) CCMoveTo *to =CCMoveTo::create(2,ccp(300,160)); //通过moveby方式得到的,后面的是一个相对偏移量 //CCMoveBy * by = CCMoveBy::create(2, ccp(200, 0)); man->runAction(to);
returntrue; } 运行结果: |
7CCJumpToCCJumpBy
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//2秒钟,跳到(400,160),跳的高度是100,跳3次 CCJumpTo *to =CCJumpTo::create(2,ccp(400, 160), 100, 3); //下面的by同样是相对的偏移位置 CCJumpBy*by =CCJumpBy::create(2,ccp(300,0),100,3);
man->runAction(by); addChild(man); returntrue; } |
8 Bezier详解
每一条贝塞尔曲线都包含一个起点和一个终点。在一条曲线中,起点和终点都各自包含一个控制点,而控制点到端点的连线称作控制线。控制线决定了从端点发出的曲线的形状,包含角度和长度两个参数:角度决定了它所控制的曲线的方向,即这段曲线在这一控制点的切线方向;长度控制曲线的曲率。控制线越长,它所控制的曲线离控制线越近。
ccBezierConfig bc; bc.controlPoint_1 = ccp(200,300); bc.controlPoint_2 = ccp(300, 20); bc.endPosition = ccp(400, 160); CCBezierTo * to = CCBezierTo::create(2, bc); |
案例:
在头文件中添加draw()函数的声明 voiddraw(); |
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//开始的位置100,160 ccBezierConfigc; //控制点 (200,300)这是一个实际的位置点 c.controlPoint_1 = ccp(200, 300); c.controlPoint_2 = ccp(300,20); c.endPosition = ccp(400,160);
CCBezierTo *to =CCBezierTo::create(2,c); man->runAction(to); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { //第一个参数为起始点 //第二个参数为控制点 //第三个参数为控制点 //第四个为终止点 //第五个为段 ccDrawCubicBezier( ccp(100, 160), ccp(200, 300), ccp(300, 20), ccp(400, 160), 100); } |
运行结果: |
通过by的方式要达到上面的效果的代码是: |
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//开始的位置100,160 ccBezierConfigc; //下面的是偏移(100,160)的距离,所有点都是相对起始点的 c.controlPoint_1 = ccp(100, 140); c.controlPoint_2 = ccp(200,-140); c.endPosition = ccp(300,0);
CCBezierBy *by =CCBezierBy::create(2,c); man->runAction(by); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { //第一个参数为起始点 //第二个参数为控制点 //第三个参数为控制点 //第四个为终止点 //第五个为段 ccDrawCubicBezier( ccp(100, 160), ccp(200, 300), ccp(300, 20), ccp(400, 160), 100); } |
放大倍数
CCScaleTo * to = CCScaleTo::create(2, 3); //2秒钟放大3被 CCScaleBy * by = CCScaleBy::create(2, 3); |
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//属性相关的,将图片放大 CCScaleTo *to =CCScaleTo::create(2, 2); CCScaleBy *by =CCScaleBy::create(2, 2);
man->runAction(by); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { //第一个参数为起始点 //第二个参数为控制点 //第三个参数为控制点 //第四个为终止点 //第五个为段 ccDrawCubicBezier( ccp(100, 160), ccp(200, 300), ccp(300, 20), ccp(400, 160), 100); } |
CCRotateTo * to = CCRotateTo::create(2, 30); //2秒钟顺时针旋转30度 CCRotateBy * by = CCRotateBy::create(2, 30); |
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//表示2秒钟逆时针旋转30度 CCRotateTo *to = CCRotateTo::create(2, -30); CCRotateBy *by = CCRotateBy::create(2, -30);
man->runAction(by); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { //第一个参数为起始点 //第二个参数为控制点 //第三个参数为控制点 //第四个为终止点 //第五个为段 ccDrawCubicBezier( ccp(100, 160), ccp(200, 300), ccp(300, 20), ccp(400, 160), 100); } |
运行结果: |
CCSkewTo * to = CCSkewTo::create(2, 20, 40); CCSkewBy * by = CCSkewBy::create(2, 20, 40); |
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//2秒,x上扭曲20度,y上30 CCSkewTo *to =CCSkewTo::create(2, 20, 30); CCSkewBy *by =CCSkewBy::create(2, 20, 30);
man->runAction(by); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { //第一个参数为起始点 //第二个参数为控制点 //第三个参数为控制点 //第四个为终止点 //第五个为段 ccDrawCubicBezier( ccp(100, 160), ccp(200, 300), ccp(300, 20), ccp(400, 160), 100); } |
运行结果: |
CCTintTo * to = CCTintTo::create(2, 123, 123, 123); CCTintBy * by = CCTintBy::create(2, 23, 45, 90); |
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//第一个参数表示的是时间,后面3个分别表示的是RGB颜色 //下面会使图片由亮色变成暗色 CCTintTo *to =CCTintTo::create(2, 123, 123, 122); CCTintTo *by =CCTintTo::create(2, 123, 123, 122);
man->runAction(to); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { //第一个参数为起始点 //第二个参数为控制点 //第三个参数为控制点 //第四个为终止点 //第五个为段 ccDrawCubicBezier( ccp(100, 160), ccp(200, 300), ccp(300, 20), ccp(400, 160), 100); } |
运行结果: |
CCFadeIn CCFadeOut淡入淡出
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//渐近显示 CCFadeIn *in =CCFadeIn::create(2); //渐出显示 CCFadeOut *out = CCFadeOut::create(2);
man->runAction(in); addChild(man); returntrue; } |
CCFadeTo 渐进到某个透明度上去
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//第一个表示时间,第二个参数为透明度 CCFadeTo * in =CCFadeTo::create(2, 120);
man->runAction(in); addChild(man); returntrue; } |
9 CCCardinalSplineTo详解
CCPointArray * array = CCPointArray::create(5); array->addControlPoint(ccp(100,160)); array->addControlPoint(ccp(200, 160)); array->addControlPoint(ccp(200, 250)); array->addControlPoint(ccp(300, 250)); array->addControlPoint(ccp(300, 160)); array->addControlPoint(ccp(450, 160)); CCCardinalSplineTo * to = CCCardinalSplineTo::create(2, array,1); |
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//下面表示6个点 CCPointArray *array =CCPointArray::create(6); //一下表示每个点的坐标 array->addControlPoint(ccp(100,160)); array->addControlPoint(ccp(200, 160)); array->addControlPoint(ccp(200, 250)); array->addControlPoint(ccp(300, 250)); array->addControlPoint(ccp(300, 160)); array->addControlPoint(ccp(450, 160));
//array->addControlPoint(ccp(0,0)); //100 160 //array->addControlPoint(ccp(100, 0)); //array->addControlPoint(ccp(100, 90)); //array->addControlPoint(ccp(200, 90)); //array->addControlPoint(ccp(200, 0)); //array->addControlPoint(ccp(450, 0));
CCCardinalSplineTo *to =CCCardinalSplineTo::create(5, array, 1); CCCardinalSplineTo *toRev = (CCCardinalSplineTo *)to->reverse(); CCSequence *seq =CCSequence::create(to,toRev,NULL);
//CCCardinalSplineBy * by = CCCardinalSplineBy::create(5, array, 1); //CCCardinalSplineBy * byRev = (CCCardinalSplineBy *)by->reverse(); //CCSequence * seq = CCSequence::create(by, byRev, NULL);
//man->runAction(to); man->runAction(seq); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { CCPointArray *array =CCPointArray::create(6);
array->addControlPoint(ccp(100, 160)); array->addControlPoint(ccp(200, 160)); array->addControlPoint(ccp(200, 250)); array->addControlPoint(ccp(300, 250)); array->addControlPoint(ccp(300, 160)); array->addControlPoint(ccp(450, 160));
ccDrawCardinalSpline(array, 1, 100); } 运行结果: |
CCPointArray * array = CCPointArray::create(5); //下面的坐标是相对位置的坐标 array->addControlPoint(ccp(0, 0)); array->addControlPoint(ccp(100, 0)); array->addControlPoint(ccp(100, 90)); array->addControlPoint(ccp(200, 90)); array->addControlPoint(ccp(200, 0)); array->addControlPoint(ccp(350, 0)); CCCardinalSplineBy * by = CCCardinalSplineBy::create(2, array, 1); |
通过这种方式实现有来有去
CCCardinalSplineBy * byRev = (CCCardinalSplineBy *)by->reverse(); CCSequence * seq = CCSequence::create(by, byRev, NULL); CCBlink * blink = CCBlink::create(2,10); CCSpawn * spa = CCSpawn::create(seq,blink,NULL); |
CCBlink CCSpawn
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//5秒钟闪烁10次 CCBlink *blink =CCBlink::create(5, 10);
man->runAction(blink); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { CCPointArray *array =CCPointArray::create(6);
array->addControlPoint(ccp(100, 160)); array->addControlPoint(ccp(200, 160)); array->addControlPoint(ccp(200, 250)); array->addControlPoint(ccp(300, 250)); array->addControlPoint(ccp(300, 160)); array->addControlPoint(ccp(450, 160));
ccDrawCardinalSpline(array, 1, 100); } |
CCSpawn让两个动作同时进行
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
CCPointArray * array =CCPointArray::create(6); array->addControlPoint(ccp(100,160)); array->addControlPoint(ccp(200, 160)); array->addControlPoint(ccp(200, 250)); array->addControlPoint(ccp(300, 250)); array->addControlPoint(ccp(300, 160)); array->addControlPoint(ccp(450, 160));
CCCardinalSplineTo *to =CCCardinalSplineTo::create(5, array, 1); //5秒钟闪烁10次 CCBlink *blink =CCBlink::create(5, 2); //通过spawn的方式实现两个动过同时进行 CCSpawn *spawn =CCSpawn::create(to,blink ,NULL);
man->runAction(spawn); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { CCPointArray *array =CCPointArray::create(6);
array->addControlPoint(ccp(100, 160)); array->addControlPoint(ccp(200, 160)); array->addControlPoint(ccp(200, 250)); array->addControlPoint(ccp(300, 250)); array->addControlPoint(ccp(300, 160)); array->addControlPoint(ccp(450, 160));
ccDrawCardinalSpline(array, 1, 100); } |
CCRepeat CCRepeatForever (关于跳转)
#include"T13Action.h" #include"AppMacros.h"
CCScene *T13Action::scene() { CCScene *scene =CCScene::create(); T13Action *layer =T13Action::create(); scene->addChild(layer); returnscene; }
boolT13Action::init() { TBack::init();
CCSprite *man =CCSprite::create("man.png"); CCSprite *woman =CCSprite::create("woman.png"); man->setPosition(ccp(100, 160));
//2秒内条1次 CCJumpBy *by =CCJumpBy::create(2,ccp(0,0),100,1); //重复10个2秒 CCRepeat *repeat =CCRepeat::create(by,10);
//man->runAction(CCRepeatForever::create(by)); man->runAction(repeat); addChild(man); returntrue; }
//原生绘图,每一帧都会绘图 voidT13Action::draw() { CCPointArray *array =CCPointArray::create(6);
array->addControlPoint(ccp(100, 160)); array->addControlPoint(ccp(200, 160)); array->addControlPoint(ccp(200, 250)); array->addControlPoint(ccp(300, 250)); array->addControlPoint(ccp(300, 160)); array->addControlPoint(ccp(450, 160));
ccDrawCardinalSpline(array, 1, 100); } |
CCPlace,CCFlip*,CCToggleVisibility,CCMoveTo*,CCJumpTo*,CCScale*,CCRotate*,CCSkew*,fade,CCCardinalSp*