小生愛

实例1 : 创建一个带颜色的场景

实例2 : 创建层的二种方法

实例3 : 创建文字标签的三种方法

实例4 : 创建按钮的四种方法

实例5 : 创建精灵的方法

实例6 : 精灵的常用属性

实例7 : 创建并执行一个动作序列及回调函数

实例8 : 切换场景 切换场景方法库>>

// coco2D 实例一 创建一个带颜色的场景_________________________________________________________________________ var MyLayer = cc.LayerColor.extend({ init : function (){ // 必须调用父类的init()方法 很多Bug都是因为没调用父类的init()方法造成的 this._super(); // cc.c4 设置rgba颜色 // this.setColor 设置颜色 this.setColor(cc.c4(126, 126, 126)); } }); // 创建场景 var MyScene = cc.Scene.extend({ onEnter : function (){ // 调用父类的init() 方法 this._super(); // 创建层 var layer = new MyLayer(); // 初始化层 layer.init(); // 把层插入到场景里 this.addChild(layer); } }); // coco2D 实例二 创建层的二种方法_________________________________________________________________________ // 方法一 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 获取屏幕大小 var size = cc.Director.getInstance().getWinSize(); // 通过LayerColor创建层 // 这种方式可以设置背景颜色 // 使用的时候需要先实例化 var Layer = cc.LayerColor.extend({ init : function (){ // 调用父类的同名方法 this._super(); // 设置层的颜色 this.setColor(cc.c4(100, 0, 0)); } }); // 获得层的实例 var layer = new Layer(); // 初始化层 layer.init(); // 添加层到场景 this.addChild(layer); } }); // 方法二 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 获取屏幕大小 var size = cc.Director.getInstance().getWinSize(); // 通过create方法直接创建层 // 这种方式不需要实例化 // 跟LayerColor不同 该方式不能设置背景颜色 var layer = cc.Layer.create(); // 创建一个文字标签 // 参数1 : 文字 // 参数2 : 字体 // 参数3 : 大小 var label = cc.LabelTTF.create('Hello', 'Microsoft YaHei', 30); // 设置文字标签的位置 label.setPosition(cc.p(150, 150)); // 把文字标签插入到层里 layer.addChild(label); // 把层添加到场景 this.addChild(layer); } }); // coco2D 实例三 创建文字标签的三种方法_________________________________________________________________________ // 创建文字标签的三种方法 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 创建一个文字标签 // 参数1 : 文字 // 参数2 : 字体 // 参数3 : 大小 // 这种方式每创建一个文字 就要渲染一次 var label = cc.LabelTTF.create('Hello', 'Microsoft YaHei', 30); // 第二种创建文字的方法 // 参数1 : 要显示的文字 // 参数2 : .fnt文字文件 // 这种方式是推荐使用的方式 效率最高 只渲染一次 // var label = cc.LabelBMFont.create('Hello', xx.fnt); // 第三种创建文字的方法 // 参数1 : 要显示的文字 // 参数2 : .plist文字文件 // var label = cc.LabelAtlas.create('Hello', xx.plist); // 设置文字标签的位置 label.setPosition(cc.p(150, 150)); // 把文字标签添加到场景 this.addChild(label); } }); // coco2D 实例四 创建按钮的四种方法_________________________________________________________________________ // 创建文字按钮 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 设置文字按钮的字体 cc.MenuItemFont.setFontName("Arial"); // 创建按钮标签 // 参数1 : 显示的文本label // 参数2 : 触发的函数 // 参数3 : 触发的目标对象 var label = cc.MenuItemFont.create("Test2", function (){ console.log('这是回调方法'); }, this); // 创建按钮 var menu = cc.Menu.create(label); // 设置label标签位置 menu.setPosition(150, 150); // 把文字按钮添加到场景 this.addChild(menu); } }); // 根据精灵创建图片按钮 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 精灵1 // 可选参数cc.rect var spriteNormal = cc.Sprite.create(s_CloseNormal); // 精灵2 // 可选参数cc.rect var spriteDisabled = cc.Sprite.create(s_CloseNormal2); // 绘制按钮精灵 // 参数1 : 初始化时的按钮精灵 // 参数2 : 按下时的按钮精灵 // 参数3 : 回调函数 // 参数4 : 触发的目标对象 var menu = cc.MenuItemSprite.create(spriteNormal, spriteDisabled, function (){ console.log('回调函数'); }, this); // 根据按钮精灵创建按钮 menu = cc.Menu.create(menu); // 设置按钮精灵的位置 menu.setPosition(150, 150); // 添加到场景 this.addChild(menu); } }); // 根据图片创建图片按钮 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 参数1 : 正常显示状态的图片 // 参数2 : 按下时显示的图片 // 参数3 : 回调函数 // 参数4 : 触发的目标对象 // cc.MenuItemImage.create 与 cc.MenuItemSprite.create 不同 // cc.MenuItemImage.create 不能用cc.rect对图片进行裁切 // cc.MenuItemSprite.create 可以对图片进行裁切 var item = cc.MenuItemImage.create(s_CloseNormal, s_CloseNormal2, function (){ console.log('我是回调函数'); }, this); // 根据绘制的按钮创建按钮 menu = cc.Menu.create(item); // 设置按钮精灵的位置 menu.setPosition(150, 150); // 添加到场景 this.addChild(menu); } }); // 创建开关类按钮 // 根据精良创建图片按钮 然后根据这些按钮创建开关按钮 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 创建精灵 var spriteNormal = cc.Sprite.create(s_CloseNormal); // 创建精灵 var spriteDisabled = cc.Sprite.create(s_CloseNormal2); // 根据精灵 创建开关类按钮 // 可以添加很多精灵 var item = cc.MenuItemToggle.create(cc.MenuItemSprite.create(spriteNormal), cc.MenuItemSprite.create(spriteDisabled)); // 设置开关按钮的回调函数 item.setCallback(function (){ console.log('回调函数'); }, this); // 生成按钮 var menu = cc.Menu.create(item); // 设置按钮的位置 menu.setPosition(150, 150); // 添加到场景 this.addChild(menu); } }); // 创建开关类按钮 // 根据图片按钮创建开关类按钮 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 根据精灵 创建开关类按钮 // 可以添加很多精灵 var item = cc.MenuItemToggle.create(cc.MenuItemImage.create(s_CloseNormal), cc.MenuItemImage.create(s_CloseNormal2)); // 设置开关按钮的回调函数 item.setCallback(function (){ console.log('回调函数'); }, this); // 生成按钮 var menu = cc.Menu.create(item); // 设置按钮的位置 menu.setPosition(150, 150); // 添加到场景 this.addChild(menu); } }); // 创建开关类按钮 // 根据文字按钮创建开关类按钮 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 根据精灵 创建开关类按钮 // 可以添加很多精灵 var item = cc.MenuItemToggle.create(cc.MenuItemFont.create("Off"), cc.MenuItemFont.create("On")); // 设置开关按钮的回调函数 item.setCallback(function (){ console.log('回调函数'); }, this); // 生成按钮 var menu = cc.Menu.create(item); // 设置按钮的位置 menu.setPosition(150, 150); // 添加到场景 this.addChild(menu); } }); // coco2D 实例五 创建精灵的方法_________________________________________________________________________ // 创建精灵方法一 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 创建精灵 // cc.rect(截取图片大小) var sprite = cc.Sprite.create(s_CloseSelected, cc.rect(0, 0, 50, 50)); // 设置精灵的位置 sprite.setPosition(150, 150); // 添加到场景 this.addChild(sprite); } }); // 创建精灵方法二 var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); // 创建精灵 var Sprite = cc.Sprite.extend({ ctor : function (){ // 初始化父类 this._super(); // 给精灵添加图片 this.initWithFile(s_CloseSelected); } }); var sprite = new Sprite(); // 设置精灵的位置 sprite.setPosition(cc.p(150, 150)); // 添加到场景 this.addChild(sprite); } }); // coco2D 实例六 精灵的常用属性_________________________________________________________________________ var Scene = cc.Scene.extend({ onEnter : function (){ this._super(); var sprite = cc.Sprite.create(s_CloseSelected); // 设置精灵的位置 sprite.setPosition(150, 150); // 设置精灵的旋转角度 sprite.setRotation(45); // 设置精灵是否可见 sprite.setVisible(true); // 设置精灵透明度 为原始透明度的一半 sprite.setOpacity(125); // 放大2倍 sprite.setScale(2); // 添加到场景 this.addChild(sprite); } }); // coco2D 实例七 创建执行一个动作_________________________________________________________________________ var Scene = cc.Scene.extend({ onEnter : function (){ // 初始化父类方法 this._super(); // 创建精灵 var sprite = cc.Sprite.create(s_CloseNormal); // 设置精灵位置 sprite.setPosition(cc.p(150, 150)); // 添加到场景 this.addChild(sprite); // 创建一个动作 // 参数1 : 时间 // 参数2 : x, y坐标参数 var actionMove = cc.MoveTo.create(2, cc.p(150, 300)); // 创建第2个动作效果 var actionMove_2 = cc.MoveTo.create(2, cc.p(150, 100)); // 设置一个回调函数 移动执行完毕后回调 var actionMoveDone = cc.CallFunc.create(function (){ console.log('移动完成 回调这个函数!'); }, this); // 让子弹执行动作 // cc.Sequence.create 创建一个序列 按顺序执行这个序列 // 精灵.runAction 执行某个动作 或 动作序列 // 该例子执行了3个动作序列 // sprite.runAction(actionMove); sprite.runAction(cc.Sequence.create(actionMove, actionMove_2, actionMoveDone)); } }); // coco2D 实例八 切换场景_________________________________________________________________________ // 创建场景一 var Scene = cc.Scene.extend({ _isTrue : false, onEnter : function (){ // 初始化父类方法 this._super(); var layer = cc.Layer.extend({ init : function (){ this._super(); // 允许触摸 this.setTouchEnabled(true); }, // 添加触摸事件监听 onTouchesBegan : function (){ // 创建切换场景的动画效果 var scene = cc.TransitionJumpZoom.create(1, new Scene2()); // 用新创建的动画 切换场景 cc.Director.getInstance().replaceScene(scene); } }); layer = new layer(); layer.init(); // 创建文字标签 var label = cc.LabelTTF.create('场景一 点我切换场景', 'Microsoft YaHei', 30); // 设置标签位置 label.setPosition(150, 150); layer.addChild(label); this.addChild(layer); } }); // 创建场景二 var Scene2 = cc.Scene.extend({ onEnter : function (){ this._super(); var layer = cc.Layer.extend({ init : function (){ this._super(); // 允许触摸 this.setTouchEnabled(true); }, // 添加触摸事件监听 onTouchesBegan : function (){ // 创建切换场景的动画效果 var scene = cc.TransitionJumpZoom.create(1, new Scene()); // 用该动画 切换场景 cc.Director.getInstance().replaceScene(scene); } }); layer = new layer(); layer.init(); var label = cc.LabelTTF.create('场景二 点我切换场景', 'Microsoft YaHei', 30); label.setPosition(150, 150); layer.addChild(label); this.addChild(layer); cc.AudioEngine.getInstance().playMusic(s_audio, true); } });