おにぎりエンジン:CollisionSet.htmlの使い方

CollisionSet.htmlとは

・CollisionSet.htmlは、おにぎりエンジンをダウンロードすると同封されています。
・スプライトクラスなどのコリジョン設定の作成を支援するツールです。
・コリジョン設定は接触判定に使用する設定です。(参考:基本的な使い方「接触判定をする その2」

・CollisionSet.htmlを開くとこんな感じの画面が表示されます。

▲上に戻る


1 まず画像を読み込む

・ファイルを選択をクリックして画像を選択肢、読込ボタンを押すと画像を読み込みます。
・うまく読み込めない場合は、もう一度、読込ボタンを押してください。

▲上に戻る


2 コリジョン設定をする(四角の場合)

・四角のコリジョン設定をする場合は、ツールを四角にして、コリジョン設定したい箇所をドラッグすると、コリジョン設定の数値が表示されます。

▲上に戻る


3 コリジョン設定をする(多角形の場合)

・多角形のコリジョン設定をする場合は、ツールを点設置にして、クリックで順番に点を設置していきます。

・それからツールを点閉じるに変更すると、点が閉じられてコリジョン設定の数値が表示されます。

▲上に戻る


4 チップ適用する

・このままだと画像全体のコリジョン設定になってしまっていますので、チップサイズを適用する必要があります。

・チップサイズを入力して、適用を押すと、チップ適用されたコリジョン設定の数値が表示されます。

・基本的にこのチップ適用したコリジョン設定の数値を、スプライトなどのcolパラメータに設定します。

//game.js
var love = new OeSprite("img/chip.png",10,10,70,70,4);
love.col = [36,62,7,39,13,19,31,27,44,15,59,40];

▲上に戻る


5 コリジョン設定を保存する

・これをコピーしてメモ帳などに貼り付けて、テキストデータとして保存しておきます。

▲上に戻る


6 コリジョン設定を読み込む


クリックで画像を拡大

・まずは画像を選択して、読み込んでおきます。
・そしてメモ帳などを使って保存しておいたテキストデータをコピーして、読み込みボタンの左にあるテキストボックスに貼り付けます。


クリックで画像を拡大

・テキストボックスの右にある読み込みボタンを押すと、コリジョン設定が読み込まれます。
・チップの設定やチップ適用したデータは読み込まれないので注意してください。

▲上に戻る


ジェリーゼリーツールおにぎりエンジン > CollisionSet.htmlの使い方