Cocos2d-html5之SkewTo&SkewBy

Cocos2d-html5测试用版本：2.2.1。

SkewTo：将 cc.Node 对象倾斜到一个特定的角度。

SkewBy：将 cc.Node 对象倾斜一个特定的角度。

使用cc.SkewTo.create(duration, deltaAngleX, deltaAngleY)和cc.SkewBy.create(duration, deltaAngleX, deltaAngleY)来创建动作。

duration
运动周期，单位为s。
deltaAngleX
水平倾斜角度
deltaAngleY
垂直倾斜角度，如果省略，则取deltaAngleY的值。

请看下列代码：

var GameScene = cc.Scene.extend({

enemy1: null, // 敌人1

enemy2: null, // 敌人2

enemy3:null, // 敌人3

layer: null, // 布景

winSize: null, // 游戏运行窗口尺寸

onEnter: function () {

this._super();

this.initData();

},

initData: function () {

// 获取尺寸

this.winSize = cc.Director.getInstance().getWinSize();

// 添加布景

this.layer = cc.LayerColor.create(cc.c4(200, 200, 200, 255), this.winSize.width, this.winSize.height);

this.addChild(this.layer);

// 创建动作

var actionTo = cc.SkewTo.create(2, 20, 20);

var actionBy = cc.SkewBy.create(2, 180, 360);

var actionByBack = actionBy.reverse();

// 添加敌人1

this.enemy1 = cc.Sprite.create(s_enemy_1);

this.enemy1.setPosition(cc.p(300, 300));

this.layer.addChild(this.enemy1);

this.enemy1.runAction(actionTo);

// 添加敌人2

this.enemy2 = cc.Sprite.create(s_enemy_2);

this.enemy2.setPosition(cc.p(100, 100));

this.layer.addChild(this.enemy2);

this.enemy2.runAction(cc.Sequence.create(actionBy, actionByBack));

// 添加敌人3

this.enemy3 = cc.Sprite.create(s_enemy_3);

this.enemy3.setPosition(cc.p(200, 200));

this.layer.addChild(this.enemy3);

this.enemy3.runAction(cc.SkewBy.create(2, 60, 60));

}

});

以下是运行结果截图：

#cyg { font: 14px "微软雅黑"; line-height: 1.6em; } #cyg h2 { margin: 1.33em 0 1em 0; font-size: 16px; } #cyg h3 { margin: 1.33em 0 1em 0; font-size: 14px; } #cyg p { margin: 1em 0; } #cyg_code { overflow-y: hidden; margin: 1em 0; padding-left: 40px; border: 2px solid rgb(200, 200, 200); background: rgb(231, 229, 220); font: 12px courier,arial,sans-serif; list-style: decimal; } #cyg_code li { min-height: 20px; line-height: 20px; padding: 0 1em; border-left: 3px solid rgb(108, 226, 108); background: rgb(240, 240, 240); white-space: pre; } #cyg_code li:nth-child(even) { background: rgb(230, 230, 230); } #cyg_code strong { font-weight: normal; color: rgb(153, 129, 255); } #cyg_code em { font-style: normal; color: rgb(117, 113, 94); } #cyg_code b { font-weight: normal; color: rgb(124, 174, 24); } #cyg_code cite { font-style: normal; color: rgb(198, 93, 8); } #cyg_code span { color: rgb(249, 38, 76); } #cyg_code ins { text-decoration: none; color: rgb(19, 153, 179); }