[cocos2d-js] - 01

使用cocos的 run命令在真实android设备上运行apk时,如果报 adb more than one devices 可以使用下面的命令来解决问题:

1.找到android sdk 下面的 adb 所在目录 .(一般是: %install_directory%/Android/android-sdk/platform-tools/adb)

2.运行下面命令:

adb kill-server

使用cocos工具编译apk

cocos compile -p android -m release

使用cocos 在真实android设备上运行apk

cocos run -p android

没有指定 -m 时,默认是 debug.

新创建的cocos2d-js项目目录结构:

main.js : 负责启动游戏场景, 无论是Web浏览器运行还是原始平台运行,都是通过该文件启动游戏场景的。

编译和启动游戏:

// 在项目目录下打开终端并执行
// -p指示目标平台,包括web,ios,mac,android,win32,每次编译请选择其中之一
cocos compile -p web|ios|mac|android|win32

// 除此之外,还可以选择编译模式:-m debug|release
// Web平台还可以添加--advanced来使用Closure Compiler的高级混淆功能对代码进行混淆
cocos compile -p android -m release
cocos compile -p web -m release --advanced

// 将compile命令替换为run即可在模拟器或真机上运行游戏
cocos run -p web
cocos run -p ios

cocos2d-js工程中,所有js文件都要在 project.json文件中进行注册。

cocos2d-js 事件处理机制:

  事件处理机制中有三个角色:

  1.事件:   cc.EventTouch(触摸事件) ,  cc.EventMouse(鼠标事件) ,  cc.EventCustom(自定义事件) , cc.EventKeyboard(键盘事件) ,  cc.EventAcceleration(加速事件).

  2.事件源: 是cocos2d-js中的精灵,层,菜单等节点对象

  3.事件处理器: 是事件监听器类 cc.EventListener , 它包含不同类型的监听器:

      1>.  cc.EventListener.ACCELERATION  加速事件监听器

      2>.  cc.EventListener.CUSTOM  自定义事件监听器

      3>.  cc.EventListener.KEYBOARD 键盘事件监听器

      4>.  cc.EventListener.MOUSE  鼠标事件监听器

      5>.  cc.EventListener.TOUCH_ALL_AT_ONCE 多点触摸事件监听器

      6>.  cc.EventListener.TOUCH_ONE_BY_ONE  单点触摸事件监听器

  事件管理器:  事件 和 监听器之间需要在程序中建立关系, 关系的建立是由 事件管理器负责: cc.EventManager

    cc.EventManager 的 addListener函数,用来注册事件监听器:

      cc.EventManager.addListener(listener, nodeOrPriority);

@listener ,是要注册的事件监听器对象

     @nodeOrPriority , 可以是一个node对象,或者一个表示优先级的数值.

//创建时间监听器
var listener = cc.EventListener.create({
    event:cc.EventListener.TOUCH_ONE_BY_ONE,
    swallowTouches: true,           //设置是否吞没事件,在 onTouchBegan 方法返回 true 时吞掉事件,不再向下传递  onTouchBegan:function(touch,event) {     // ..... return false;   } }); 

//注册事件监听器 cc.eventManager.addListener(listener , this.getChildByTag(SpriteTags.kBoxA_Tag));

多分辨率屏幕适配

横竖屏设置

  android:  在 runtime-src/proj.android/AndroidManifest.xml 文件的设置:

android:screenOrientation="landscape"     //landscape为横屏,  portrait 为竖屏

  ios: 在xcode 中设置:

精灵:

  精灵是游戏中非常重要的概念,围绕精灵的还有很多概念,如精灵帧,缓存,动作,动画等。

  1.精灵的创建:

    1>. 根据图片资源创建精灵:

//根据图片资源路径
var sp1 = new cc.Sprite("res/background.png");

      裁剪资源图片的指定区域:

var sp2 = new cc.Sprite("res/tree.png",cc.rect(604,38,302,295));

    2>.从纹理图集的精灵帧名创建:

var sp = new cc.Sprite("#background.png");

// note:  这种方式与图片资源路径方式创建的精灵的参数都是一个字符串,为了区分,在精灵帧名前加上 # 号

    3>.根据精灵帧创建:

//先从精灵缓存获取精灵帧对象,再由精灵帧对象创建精灵
var spriteFrame = cc.spriteFrameCache.getSpriteFrame("background.png");

var sp = new cc.Sprite(spriteFrame);

    4>.根据纹理创建:

//1.首先创建纹理对象, 再通过纹理来创建精灵
var texture = cc.textureCache.addImage("background.png");
var sp = new cc.Sprite(texture);

//可以选择纹理的指定区域来创建精灵
var sp2 = new cc.Sprite(texture, cc.rect(0,0,480,320));

  创建精灵时,应该选择这四种方式的哪一种?

  在具体场景中创建精灵时,应该选择最方便,并且性能最好的方式来创建精灵。  纹理图集和精灵缓存就是优化性能的创建精灵的方式。

  纹理图集(texture atlas),也称为精灵表(sprite sheet), 它是将许多小的精灵图片组合到一张大图里,创建精灵时,根据图集的特定区域来创建精灵。

  在cocos2d中主流使用 Zwoptex 或者 TexturePacker 工具来创建纹理图集。  这些工具会产生一个 大的纹理图集,以及一个 plist 文件。 plist文件里包含了精灵名和它的坐标。

  精灵缓存:

  精灵缓存是缓存中的一种, cocos2d中缓存的种类有: 纹理缓存(TextureCache), 精灵帧缓存(SpriteFrameCache) , 动画缓存(AnimationCache)。

  创建各种缓存的目的基本上是为了优化性能。

精灵缓存使用实例:

//首先获取精灵帧缓存, 然后向精灵帧缓存中添加精灵帧 ,最后使用精灵帧名创建精灵
var frameCache  = cc.spriteFrameCache;
frameCache.addSpriteFrames("res/SpriteSheet.plist","res/SpriteSheet.png");
var mountain1 = new cc.sprite("#mountain1.png");

//创建精灵的另外一种方式, 主要用于精灵动画上
var frameCache  = cc.spriteFrameCache;
frameCache.addSpriteFrames("res/SpriteSheet.plist","res/SpriteSheet.png");

var heroSprite = frameCache.getSpriteFrame("helo1.png");

 场景和层

一般是在层的构造函数中对界面的控件进行创建和初始化。

  层的生命周期函数:

  1. ctor 构造函数, 初始化层时调用

  2. onEnter() , 进入层时调用

  3. onEnterTransitionDidFinish() 进入层而且过度动画结束时调用

  4. onExit() ,退出层时调用

  5. onExitTransitionDidStart() , 退出层而且开始过渡动画时调用

在重写层的生命周期函数时,一定要调用父类函数语句:this._super().

场景过渡动画

  场景过渡动画是由TransitionScene类和它的子类展示的。 TransitionScene类的直接子类有11个,有些子类还有子类,全部过渡动画有30多个。 过渡动画的使用方式都是类似的:

cc.director.pushScene(new cc.TransitionFadeTR(1.0, new SettingScene()));

//过渡动画类的构造函数有两个参数, 第一个是动画持续时间,第二个是场景对象
时间: 2024-11-04 12:50:49

[cocos2d-js] - 01的相关文章

cocos2d js ClippingNode 制作标题闪亮特效

1.效果图: 之前在<Android 高仿 IOS7 IPhone 解锁 Slide To Unlock>中制作了文字上闪亮移动的效果,这次我们来看下怎样在cocos2d js 中做出类似的效果. 顺便给我公司的游戏打下广告.https://itunes.apple.com/cn/app/kuang-zhan-san-guo/id691116157? mt=8 2.效果原理 很easy.就是一张白色两边羽化的图片在标题上从左往右移动.可是普通的移动会穿帮.我们须要以标题作为模板来截取白色的图片

cocos2d JS 函数类型相互转换(字符串、整形、浮点形、布尔值)

工作忙好些天了,近段时间抽点空分享一下自己学习JS的一点笔记心得做点记录,大神勿喷,谢谢! p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC" } span.s1 { font: 18.0px Helvetica } 1.字符串的转化 1 var found = false; 2 console.log(found.toString()); //输出 false 3 4 var num1 = 10; 5

cocos2d JS 本地缓存存储登陆记住账号密码-&gt;相当于C++中的UserDefault

在cocos-js 3.0以上的版本中,当我们用到本地存储的时候,发现以前用到的UserDefault在JS中并没有导出,而是换成了LocalStorage. 在LocalStorage.h文件中我们查看了一下源码,使用方法就是设置Key-Value的方式 存储数据:cc.sys.localStorage.setItem("key","value") 获取数据:cc.sys.localStorage.getItem("key") 移除数据:cc.

datatables.js(01) 列格式化 与 列的事件加载

datatables.js 对列进行格式化: aoColumns 的 defaultContent columnDefs 的 "defaultContent": "<input id='delrow' class='btn btn-primary' type='text'></input>" --动态填充数据 "mRender": function (data, type, full) { return "<

cocos2d.js

1.节点是Cocos2d最基础的东西 2.坐标与普通数学坐标一致 3.children属性表示节点的孩子,父节点位置变化,它包含的子节点也会跟着变化,以整体的形势移动 4.层(layer), 新建层:var layer = new cc.Layer(); 把层添加到舞台上:scene.addChild(layer); 再把子节点添加到这个层上:layer.addChild(child); 5.实现纯色背景:LayerColor 6.实现渐变的层:LayerGradient 7.Sprite加载背

html5 cocos2d js Access-Control-Allow-Origin

1.No 'Access-Control-Allow-Origin' header is present on the requested 近期在接html5的渠道,遇到了跨域的问题,使用 js 的 ajax post 或者get 方法,仅仅要目标URL略微有点不同,就会有跨域问题,浏览器会由于安全问题自己主动拦截. 这个问题事实上不是client能解决的,最好是目标URL的server代码是你能够控制的.最方便的解决方式是在你訪问的server端页面加代码.比方你如今的地址是 http://a

cocos2d JS 艺术字特殊符号的显示

this.setSocreAtion(score, this.tfMoneyList[index],mun); //传入分数与对象,调用下面的函数 setSocreAtion : function (num,artNumWidget) { num = parseInt(num);//转化为 int var number = num; if(num==0)return; //判断为0直接return,不执行下面的代码 if (num<0){ num = "/"+ num; }els

cocos2d js ScrollView的使用方法

游戏中非常多须要用到ScrollView的情况,也就是须要滚动一片区域. 这里有两种实现方法,一种是使用cocos studio的方式,另外一种是手写代码.先看第一种 第一种记得在设置滚动区域时选取裁剪项. var size = cc.winSize; //读取json文件 var root = ccs.uiReader.widgetFromJsonFile(res.listJson); this.addChild(root); //获取在cocos studio里面设定好的scrollView

cocos2d JS 基础语法运算符

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC" } 简单且逼格高的运算符 var a = 12; console.log(-a); //输出 -12 - -> 取反 var b = a++; console.log(b); //输出 12 - -> 先赋值b,a再++ b = ++a; console.log(b); //输出 14 - -> ++a赋值b,a先++后赋值 var a

cocos2d JS 基础语法间的函数方法相互调用

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC" } 1.函数嵌套函数 1 function calcuate(opr, a, b) { // 定义函数,opr - -> 符号,a,b - -> 数值 2 3 //定义 + 函数 4 function add(a, b){ 5 return a + b; 6 } 7 8 //定义 - 函数 9 function sub(a, b){ 10 r