下腹オプティマイザ

主にIT関係の雑記帳です。全然関係ないことも書くかもしれないです。

【Tiled】マップデータを作る話【cocos2d-x】

 

こんにちは、クマガイです。

 

東京は雨が降りっぱなしですね、個人的にはあまり雨は好きじゃないです。

夜に用事があるので止んでくれないかしら。

 

今回はcocos2d-xで使うためのマップデータ(.tmx形式)を作っていきます。 cocos2d-x側ではTileMap(http://www.cocos2d-x.org/wiki/TileMap)クラスを使ってマップを表示するのですが、こちらについては次回以降の記事で解説していと思います。

 

cocos2d-xで使用するためのtmxデータを作ることが目的ですので最低限でいきます。 マップデータの作成にはTiledというフリーのオープンソースソフトウェアを使用します。 Tiled自体はGPLライセンスなのですが、作成されたマップデータ自体には影響しませんので ライセンスは気にせず使用できます。

 

f:id:kurogomapurin11:20140607153217p:plain

 

まずはダウンロード、使用するOS用の物を適宜ダウンロードします。(私はMacなのでMac用を) dmgのzipファイルになっていますので回答してdmgを開きます。

 

f:id:kurogomapurin11:20140607155444p:plain

 Tiledのアプリケーション本体をMacのApplicationsフォルダへコピー (上の画像ではショートカット経由でコピー) ApplicationsからTiledを起動します。

 

f:id:kurogomapurin11:20140607160740p:plain

 

作成するMapのフォーマットを指定します。 xml形式、種類は正四角形でいきます。 したらば、このような画面になりますので、まずはマップに使うタイルの画像を追加します。 32*32でフォーマットを指定しましたので320*320の画像を作成して10*10個のタイルを使用します。 テスト用なのでデタラメな下のような画像を使います。

 f:id:kurogomapurin11:20140607160358p:plain

 

単純にここから切り取ってマップを形成するのであまり気にしなくてもそれっぽくはなります。 ではタイルセットを追加します。

f:id:kurogomapurin11:20140607160512p:plain

 

f:id:kurogomapurin11:20140607160540p:plain

参照から先ほどの画像を選択して追加します。 追加できたらあとはマップにまぶしていくだけです。 できたマップはこんな感じ

 

 

f:id:kurogomapurin11:20140607160617p:plain

 

f:id:kurogomapurin11:20140607160654p:plain

あとは左上からエクスポートするだけ 


とりあえずテスト用の.tmxファイルができたのでこれをcocos2d-x側のTileMapクラスで使用します。 これについてはまた今度です。

 

ではでは 


お腹すいた


6/8訂正:意図しない文字列が記事にはいっていたので入っていたので削除しました。