Cocos Code IDEを使ってLua言語でスプライトを表示してみます。
ここでは新規プロジェクトを作成して、スプライトを画面に表示します。
初期状態で作成されるサンプルゲームをまっさらにする所から始めます。
実行環境、IDE | Cocos2d-xバージョン | 言語 |
---|---|---|
Cocos Code IDE Mac OS X 1.0.0-RC1 | Cocos2d-x V3.2 | Lua言語 |
準備
適当なプロジェクト名で新規プロジェクトを作成します。
- [File]メニューから[New]->[Cocos Lua Project]を選択。
- Project Name:は何でもかまいません。ここではCocosTestを入力しました。
- [next]をクリック
- Orientation:portraitを選択
- [Finish]をクリック
縦画面でプロジェクトを作成しました。横画面が好きな人は横画面でもかまいません。
まずは実行してみましょう。
(上部にある[Debug Mac]ボタンか[Run Mac]ボタン)
サンプルゲームが表示されたと思います。
ただし、縦画面の場合、縦横の比率がおかしいと思います。
そこで、main.luaファイルのsetDesignResolutionSizeの480と320を入れ替えます。
26行目
cc.Director:getInstance():getOpenGLView():setDesignResolutionSize(320, 480, 0)
実行して、縦横の比率が正しいことを確認してください。
次に単機能のテストを行いたいため、ここではGameScene.luaの内容をごそっと削除して、何もない状態にしてしまいます。
require "Cocos2d"
require "Cocos2dConstants"
local GameScene = class("GameScene",function()
return cc.Scene:create()
end)
function GameScene:ctor()
self.visibleSize = cc.Director:getInstance():getVisibleSize()
self.origin = cc.Director:getInstance():getVisibleOrigin()
self.schedulerID = nil
end
-- ここにテスト用コードを記述
function GameScene.create()
local scene = GameScene.new()
return scene
end
-- ここまで
return GameScene
playBgMusic関数を削除してしまったので、main.luaの31行目をコメントアウトします。
31行目
-- gameScene:playBgMusic() -- playBgMusic関数を削除してしまったのでコメントアウト
実行してみてエラーがでなければ、準備ができました。
真っ黒な画面とデバッグ情報だけが表示されたと思います。
画像を準備する
image.pngのファイル名で画像を用意し、resディレクトリに配置します。画面内に収まれば画像サイズは適当で。ここでは128x128で作りました。
スプライトを表示するコードを書く
GameScene.luaファイルのGameScene.create()を以下のように書き換えます。
function GameScene.create()
local scene = GameScene.new()
local sprite = cc.Sprite:create("image.png")
sprite:setPosition(100, 100)
scene:addChild(sprite)
return scene
end
実行して(100, 100)の位置にimage.pngが画面に表示されたらOKです。
Cocos2d-xでは原点である(0, 0)の座標位置は画面左上ではなく左下になります。
シミュレーターを起動したままスプライトの表示座標を変えてみましょう。
中略・・・
sprite:setPosition(100, 200) -- Y座標を200に変更
ファイルを保存すると同時にスプライトが上へ移動したはずです。
Cocos Code IDEとLuaを使うと、変更がすぐに反映されるので開発効率も向上するはずです。
(一部コードを修正しました。)