夏までにiPhone アプリつくってみっか!

趣味でiPhone/Androidアプリを開発し、日々勉強した事を書いています。オープンワールド系レースゲームをUnityで開発中です。

【cocos2d, Tiled】Tiled 0.9.1のサンプルデータで画面が変に。tsxファイルありのタイルマップは要注意

つぎのアプリではタイルマップを使ってみようと思い、しばらく放置していたTiledを0.8.1から最新版の0.9.1にアップグレードし、早速タイルマップを表示するプログラムを組んでみました。

マップのデータを用意していないので、とりあえずTiledのexamplesフォルダーに入っている砂漠のデータを使用。
プログラムを実行してみると……

f:id:takujidev:20130907232532p:plain


何かやたらとサボテン?があるんですけど。

以前もこのサンプルデータを使って実験した事があり、そのときはもっと乾いた砂漠だったので、とりあえずTiledのバージョン0.8.1をもう一度ダウンロードしたところ、このバージョン0.8.1のサンプルデータでは以前どおりの砂漠が表示されます。
また、0.8.1と0.9.1ではサンプルデータのファイル構成が違っていることに気がつきます。

バージョン0.8.1ではシンプルにタイルマップのdesert.tmxとテクスチャのtmw_desert_spacing.pngだけなのに対し、バージョン0.9.1のサンプルではdesert.tsxというファイルが追加になっています。
どうやらバージョン0.9.0で追加された地形(terrain)機能のデータがこのtsxファイルに入っているようです。

ファイルを開くとこうなっています。

<?xml version="1.0" encoding="UTF-8"?>
<tileset name="Desert" tilewidth="32" tileheight="32" spacing="1" margin="1">
 <image source="tmw_desert_spacing.png" width="265" height="199"/>
 <terraintypes>
  <terrain name="Desert" tile="29"/>
  <terrain name="Brick" tile="9"/>
  <terrain name="Cobblestone" tile="33"/>
  <terrain name="Dirt" tile="14"/>
 </terraintypes>
 <tile id="0" terrain="0,0,0,1"/>
 <tile id="1" terrain="0,0,1,1"/>
 <tile id="2" terrain="0,0,1,0"/>
 <tile id="3" terrain="3,3,3,0"/>
 <tile id="4" terrain="3,3,0,3"/>
 <tile id="5" terrain="0,0,0,3"/>
 <tile id="6" terrain="0,0,3,3"/>
 <tile id="7" terrain="0,0,3,0"/>
 <tile id="8" terrain="0,1,0,1"/>
 <tile id="9" terrain="1,1,1,1"/>
 <tile id="10" terrain="1,0,1,0"/>
 <tile id="11" terrain="3,0,3,3"/>
 <tile id="12" terrain="0,3,3,3"/>
 <tile id="13" terrain="0,3,0,3"/>
 <tile id="14" terrain="3,3,3,3"/>
 <tile id="15" terrain="3,0,3,0"/>
 <tile id="16" terrain="0,1,0,0"/>
 <tile id="17" terrain="1,1,0,0"/>
 <tile id="18" terrain="1,0,0,0"/>
 <tile id="19" terrain="1,1,1,0"/>
 <tile id="20" terrain="1,1,0,1"/>
 <tile id="21" terrain="0,3,0,0"/>
 <tile id="22" terrain="3,3,0,0"/>
 <tile id="23" terrain="3,0,0,0"/>
 <tile id="24" terrain="0,0,0,2"/>
 <tile id="25" terrain="0,0,2,2"/>
 <tile id="26" terrain="0,0,2,0"/>
 <tile id="27" terrain="1,0,1,1"/>
 <tile id="28" terrain="0,1,1,1"/>
 <tile id="29" terrain="0,0,0,0"/>
 <tile id="30" terrain="0,0,0,0" probability="0.5"/>
 <tile id="31" terrain="0,0,0,0" probability="0.5"/>
 <tile id="32" terrain="0,2,0,2"/>
 <tile id="33" terrain="2,2,2,2"/>
 <tile id="34" terrain="2,0,2,0"/>
 <tile id="35" terrain="2,2,2,0"/>
 <tile id="36" terrain="2,2,0,2"/>
 <tile id="37" terrain="0,0,0,0" probability="0.5"/>
 <tile id="38" terrain="0,0,0,0" probability="0.5"/>
 <tile id="39" terrain="0,0,0,0" probability="0.5"/>
 <tile id="40" terrain="0,2,0,0"/>
 <tile id="41" terrain="2,2,0,0"/>
 <tile id="42" terrain="2,0,0,0"/>
 <tile id="43" terrain="2,0,2,2"/>
 <tile id="44" terrain="0,2,2,2"/>
 <tile id="45" terrain="0,0,0,0" probability="0"/>
 <tile id="46" terrain="0,0,0,0" probability="0.5"/>
 <tile id="47" terrain="0,0,0,0" probability="0.5"/>
</tileset>

この地形機能を使うとひとまとめのタイルを上手いこと並べてくれるので便利なのですが、このままでは使えそうにありません。

f:id:takujidev:20130907234742p:plain

テクスチャーのでーたは上のようになっています。
砂漠が一面サボテンになっているのは一つ隣のサボテンのテクスチャーを読んでいるのが原因と思われます。
そこでググってみると、こういう情報こういう情報(cocos2d-x)が出てきました。
tmxファイルの中にfirstgid="1"という設定があり、テクスチャの番号は1から始まる事をcocos2dに伝えているのですが、どうやらこれを無視して0から始まっていると思っているようです。
前述の2個目のリンクに書かれている内容からするとtmxふぁいるではなくtsxファイルかfirstgidの値を読み込もうとして失敗しているらしいです。
そういう事なので、とりあえず、tsxファイルにもfirstgid="1"を入れてみます。

2行目を次のように修正しました。

<tileset firstgid="1" name="Desert" tilewidth="32" tileheight="32" spacing="1" margin="1">

その結果、再び荒れ果てた砂漠を拝むことに成功しました。
f:id:takujidev:20130908000025j:plain