無料で利用できるマップチップツール Tilesetter Lite を使って、ひとつのマップチップ画像からオートタイル用の様々な隣接パターンに対応したマップチップ群を生成します。


パート1では、同じオートタイルと隣接しない辺の部分に、デフォルトの白い破線が描画されたので、その白い破線の代わりに、草のドット絵を割り当ててオートタイル用のマップチップ群を作成します。
※ 2024 年 10 月 20 日の記事ですが、前回の記事と同じ 2024 年 10 月 19 日に公開しました。
前回の記事
前回は、Tilesetter Lite で1つのマップチップ画像から、オートタイル用のマップチップ群の画像ファイルを作成しました。
この状態では、マップチップの上下左右の端に合成するマップチップ画像を設定しなかったため、デフォルトの白い破線が描画されました。
端に組み合わせる画像の追加
草のドット絵(下図の右下)のマップチップを画像編集ソフトで範囲選択して Ctrl + C でクリップボードにコピーします。
※ Paint.NET で 16 × 16 ピクセルの右上のマップチップ画像を範囲選択してからコピーしました。

オートタイルに影響しない空いている適当なマスをクリックで選択して、 Ctrl + V でコピーした草のマップチップ画像を貼り付けます。
その後、オートタイルの白い破線があるマスをクリックすると右側のエリアに選択したマスの情報が表示されます。
Composition の中の Source の Image リストに白い破線の他に先ほど張り付けた草の画像も表示されるので、草の画像を選択します。

これで、選択したタイルの白い破線、例では下側の辺の破線、を組み合わせているマップチップの画像が草のマップチップに置き換わりました。

この白い破線から草の画像への置き換えを、上下左右、全ての白い破線を持つマスを選択して行います。
※同じ位置の画像は一括で置き換わるので、4回の置き換えで済みました。

白い破線から草に置き換えたオートタイル画像をファイルに保存する
編集が済んだら、前回と同じく、オートタイルの画像をファイルに保存します。
画像ファイルに保存する範囲のマスをマウスのドラッグで指定します。

範囲指定した後に、その場所で右クリックして表示されるメニュー「Export」→「Image」を選択します。

出力先を選択して「保存」ボタンを押すと、画像ファイルとして選択範囲が保存されます。

確認
白い破線を草に置き換えたオートタイル用のマップチップの画像ファイルが出力されました。


まとめ
今回は、無料で利用できるマップチップツール Tilesetter Lite を使って、ひとつのマップチップ画像からオートタイル用の様々な隣接パターンに対応したマップチップ群を生成しました。
パート1では、同じオートタイルと隣接しない辺の部分に、デフォルトの白い破線が描画されたので、その白い破線の代わりに、草のドット絵を割り当ててオートタイル用のマップチップ群を作成しました。
参照サイト Thank You!
記事一覧 → Compota-Soft-Press
コメント