とりあえず動くようにするまで
基本的にここに書いてあるものは変更を網羅してるわけではなく自分が行った修正について記述.
元のコード自体も間違っている可能性もあるし,その他変更もあると思うのでその点は注意.
index.html
v3.0-beta では index.html で記述する,最初に読み込むスクリプトとして CCBoot.js と自分の js ファイル( template では main.js )呼ぶようにする.
たしか 2.2.x では main.js 決め打ちだったはずなのでまあそのまま main.js でもいい.
<script src="cocos2d.js"></script>
<script src="../CCBoot.js"></script>
<script src="main.js"></script>
cocos2d.js -> project.json
v2.2.x で cocos2d.js に記述していた設定( document.ccConfig に入れていたもの)は project.json に書くように変更.
基本的に変数に入れていたものをそのまま project.json に json 形式になるように書き写せば良い.
下記は特に変更が必要だったもの.
v2.2.x (cocos2d.js) | v3.0beta (project.json) | 説明(あれば) |
---|---|---|
COCOS2D_DEBUG | debugMode | |
tag | id | |
appFiles | jsList | |
chipmunk, box2d | modules | modules に chipmunk とか box2d とか追加する(他の) |
main.js
cc.Application や cc.AppControl はなくなったらしい(参考) ので cc.game を使う.
var cocos2dApp = cc.Application.extend({
});
var myApp = new cocos2dApp(MyScene);
cc.game.onStart = function(){
cc.director.runScene(new MyScene());
};
cc.game.run();
あと getInstance()
してるものは基本的に先頭小文字になってる (参考)
(しれっと書いてるけど シーン表示するときは runScene()
を使うらしい)
cc.Director.replaceScene(new MyScene());
cc.director.runScene(new MyScene());
ここらへんの修正で自分のプロジェクトはとりあえず最初のシーン表示までいった.
キー入力・マウス入力
ここ によると cc.eventManager
に全部まとまったらしい.
とりあえず キー入力・マウス入力を有効にするために下記の記述がある場合は削除.標準で動くらしい.
this.setKeyboardEnabled(true);
this.setMouseEnabled(true);
this.setTouchEnabled(true);
イベントの登録は onMouseUp()
などを cc.Layer
のオブジェクトに登録などではなく cc.eventManager.addListener
を使うらしい.
キー入力については beta では後述する点について注意.
例
var MyLayer = cc.Layer.extend({
onEnter: function() {
},
/** @override */
onMouseUp: function(evt) {
},
/** @override */
onKeyUp: function(evt) {
}
});
var MyLayer = cc.Layer.extend({
onEnter: function() {
cc.eventManager.addListener(cc.EventListener.create({
event: cc.EventListener.MOUSE,
onMouseUp: function(evt) {
}
}), this);
cc.eventManager.addListener(cc.EventListener.create({
event: cc.EventListener.KEYBOARD,
onKeyReleased: function(key) {
}
}), this);
},
});
v3.0beta におけるキー入力のバグ
キー入力は このコミット の修正がないとイベントを拾ってくれない.
(チケット もあるけど何も書いてないに等しい)
キー入力を扱ってる場合は v3.0beta の次のものを待つか自分でそのコミットの修正を適用しないと動かないと思う.
sys について
モバイルかどうかについて自分のところでは下記のように書いてあったのが動かなかったが cc.sys.isMobile
になったらしい.
var platform = cc.Application.getInstance().getTargetPlatform();
if (platform === cc.TARGET_PLATFORM.MOBILE_BROWSER) {
}
if (cc.sys.isMobile) {
}
ほかにも sys.localStorage
のような sys に入ってるものは cc.sys.localStorage
のように cc.sys
になっている.
色について
自分のところでは cc.c3b()
を使っていたが参考ページのように cc.color
に変更になっている.
他にも cc.c4f()
を使っていたが, これの場合は 0 〜 1 の実数だったものが 0 〜 255 の整数に変わってるので書き換え時に注意.
LabelTTF について
cc.LabelTTF.create()
は内部で new に書き換わっているので new を使ったものに書き換えてもいいししなくてもいい.
cc.LabelTTF.create = function (text, fontName, fontSize, dimensions, hAlignment, vAlignment) {
return new cc.LabelTTF(text, fontName, fontSize, dimensions, hAlignment, vAlignment);
};
また, Mac で開発しててデプロイを別サーバにするなどしている場合に多分ハマるものとして,ディレクトリ名が小文字になっているためアクセス時に HTTP ステータスが 404 になる可能性があるのでなんとかして書き換える必要があるかも.
リソースの読み込みについて
テンプレートの resource.js については多分変更されてない.
v2.2.x でも v3.0 でも main.js で呼んでると思う.
tmx の場合に中で image タグで png ファイルなどが設定されている場合は v3.0beta にすると下記のようなエラーが発生するかもしれない.
Uncaught Please load the resource first: xxx.tmx
これは resouce.js で tmx と png の順番が問題で, png よりも tmx ファイルを読み込む必要がある.これは resource.js を見る限りだと罠っぽい.
また,音声ファイルなどでは 下記のように type を指定している場合はその type が変更になっているようなので注意.
var g_resources = [
//bgm
{type:"bgm",src:"res/sound/music.m4a"}
];
var g_resources = [
//bgm
{type:"m4a",src:"res/sound/music.m4a"}
];
とりあえずソースを検索して出るものは以下のもの.
cocos2d/audio/CCAudio.js
1029:cc.loader.register(["mp3", "ogg", "wav", "mp4", "m4a"], cc._audioLoader);
cocos2d/core/platform/CCLoaders.js
31:cc.loader.register(["txt", "xml", "vsh", "fsh", "atlas"], cc._txtLoader);
38:cc.loader.register(["json", "ExportJson"], cc._jsonLoader);
50:cc.loader.register(["png", "jpg", "bmp","jpeg","gif"], cc._imgLoader);
61:cc.loader.register(["serverImg"], cc._serverImgLoader);
72:cc.loader.register(["plist"], cc._plistLoader);
122:cc.loader.register(["font", "eot", "ttf", "woff", "svg"], cc._fontLoader);
cocos2d/labels/CCLabelBMFont.js
1140:cc.loader.register(["fnt"], cc._fntLoader);
cocos2d/tilemap/CCTMXXMLParser.js
916:cc.loader.register(["tmx", "tsx"], cc._txtLoader);
extensions/ccb-reader/CCBReader.js
1124:cc.loader.register(["ccbi"], cc._binaryLoader);
width とか height とかについて
たとえば getBoudingBox()
などで幅や高さを得る場合は cc.Rect が返ってくるはず.
この cc.Rect が getWidth()
や getHeight()
では取得できなくなってる様子. たぶんこれに該当すると思うだけどこれみてわかるか!
とりあえず以上.
参考文献
このリンク先がだいたい 404 なんだよなぁ…
Upgrade guide from Cocos2d-html5 v2.2.x to Cocos2d-JS v3.0 beta | Documents | Cocos2d-x