今回は「Shooting Game Builderのチュートリアルのすすめかた」その4をお届けします。
前回（その3）では「Shooting Game Builder」では、画像を設定する際に必要な「ストライプ」の作りかたについてお届けしました。
今回は、前回の記事でつくった「ストライプ」に画像を登録していきます。
画像を読み込んでみよう
前回の記事では「MYSHIP」という名前のストライプをつくりました。
今回はこのストライプを使って作業をしていきます。
手順
1.前回の記事でつくったストライプ「MYSHIP」をダブルクリックします。
2.すると「スプライト編集」というウインドウが開きます。
3.「イメージファイル」の欄の右側にある「…」をクリックします。
4.すると、「OPEN FILE」というウインドウが開き、画像ファイルを選べるようになります。
今回のチュートリアルで使う画像は、Steamの「Shooting Game Builder」フォルダから「samples」フォルダにすすみ、その中にある「resources」フォルダを開くとあります。
★画像のある場所については、こちらの記事でくわしく解説しています↓
5.今回開くのは「img_myship.bmp」という画像です。
背景がピンク色になっている画像です。この「img_myship.bmp」を選択し、開きます。
6.すると、今開いた画像が「スプライト編集」のプレビューウインドウに表示されます。
これで自機などが描かれた画像を読み込むことができました。
……が、この画像、このまま使おうとすると、ちょっと問題が出てきます。
というのも、画像をこの状態のままゲームに使うと、自機や弾のまわりに背景のピンク色も一緒に表示されてしまうんですね。たとえば、こんな感じ↓
これではせっかくのデザインもカッコ悪く見えてしまいますね。
ですので、このピンク色が表示されないようにするためには、画像の背景を透明にする（背景にある色を透明色扱いにする）必要があります。
というわけで、さっそくやってみましょう。
背景の色を透明色扱いにしてみよう
1.「カラーキー（ARGB）」の右にある▲マークをクリックします。
2.すると、プレビューウインドウのまわりに黄色い点線が表示されます。
3.透明色扱いにしたい色をクリックします。
今回は背景のピンク色を透明色扱いにしたいので、背景のピンク色の部分をクリックします。
4.すると、ピンク色の部分が透明色扱いになり、背景が透明な状態になりました。
今の手順を動画にするとこんな感じです↓
このように「Shooting Game Builder」では、背景が透明でない画像の場合でも、「背景が透明なPNG画像（透過PNG）」と同じような状態にできるわけですね。
この方法の注意点としては、自機や弾などに「透明色扱いにしたい色」と同じ色を使っていると、その色を使っている部分も透明になってしまう点です。
透明色扱いにしたい色を、たとえば自機のコクピットに使っていたりすると、そこも透明色扱いになってしまいます。ですので、こうした形式で画像を自作する場合は、ふだん使わないような色を背景にするのがおすすめです。
さて、これで使用する画像の画像の読み込みができました。
次回からは、パターンリストの作成など画像の各種設定をしていきます。
次回からは画像の各種設定をしていきます
今回は「Shooting Game Builder チュートリアルのすすめかた」の第4回ということで、スプライトで画像を読み込む方法をお届けしました。
次回からは、パターンリストの作成など画像の各種設定をしていきます。
