cocos2d-js学习笔记之项目目录

Paste_Image.png

项目目录结构

目录	介绍
frameworks	包含cocos2d-html5引擎、cocos2d-x引擎和各个平台的项目文件
-cocos2d-html5	cocos2d-html5引擎
-cocos2d-x	cocos2d-x引擎
-runtime-src	各个平台的项目文件(android、ios、win)
res	项目资源文件夹
-HelloWorld.png	资源图片
-loading.js	页面启动加载效果的js
src	项目代码文件夹
-app.js	项目代码
-resource.js	资源的全局变量定义
index.html	HTML5 基于web应用程序的入口点
main.js	游戏入口文件，包含游戏初始化代码及启动代码
project.json	工程配置文件

index.html

包含游戏场景的canvas

引入引擎初始化和加载的引擎脚本 CCBoot.js

引入游戏加载效果js loading.js

引入游戏启动的入口脚本 main.js

打包成web，在ios的微信中页面图片、文字显示模糊

main.js

//表示是否开启高清显示
cc.view.enableRetina(cc.sys.os === cc.sys.OS_IOS ? true : false);
//表示设置屏幕适配
cc.view.setDesignResolutionSize(960, 640, cc.ResolutionPolicy.SHOW_ALL);

屏幕适配的方案

cc.ResolutionPolicy.SHOW_ALL 表示显示所有，但会出现黑边

cc.ResolutionPolicy.NO_BORDER 表示没有黑白，游戏部分会显示不全，部分被切割在屏幕

cc.ResolutionPolicy.EXACT_FIT 表示拉伸，图像变形

cc.ResolutionPolicy.FIXED_HEIGHT 表示固定高度

cc.ResolutionPolicy.FIXED_WIDTH 表示固定宽度

推荐方案：
竖屏游戏使用cc.ResolutionPolicy.FIXED_WIDTH
横屏游戏使用cc.ResolutionPolicy.FIXED_HEIGHT

project.json

{   
 "project_type": "javascript",   
 "debugMode" : 1,  
 "showFPS" : true, 
 "frameRate" : 60,
 "noCache" : false,    
 "id" : "gameCanvas",  
 "renderMode" : 0,    
 "engineDir":"frameworks/cocos2d-html5",    
 "modules" : ["myCocos2d"],   
 "jsList" : [        
       "src/resource.js",        
       "src/app.js"    
]}

project_type 表示项目类型

debugMode 0:表示不显示任何调试信息 1: 在调试端打印信息

showFPS 设为true 表示在左下角显示绘制函数调用次数、渲染时间和帧率

id 表示index.html中canvas元素id

renderMode 表示渲染模式 0:表示自动选择 1: 强制使用canvas 2: 强制使用webGL

modules 模块设置

jsList 表示脚本列表

自定义模块：
打开frameworks>cocos2d-html5>moduleConfig.json里面添加自定义的模块