HSP講座2-図形の描画

前回はmes命令で文字の描画をしましたが、
今回は色々な図形の描画をします。

とりあえず前回と同様に、”HSPスクリプトエディタ”を起動してください。

えっと・・・
まずは四角形の描画をしてみましょう。次の1行を書いて、実行（F5）してください。

 boxf 100,100,300,200

出てきたウィンドウの中心よりやや左上に長方形が出てきたでしょうか？
boxfは長方形の領域を塗りつぶす命令です。多分boxf のfは"full"のf だと思います。

で、次の 100,100,300,200 は何を示しているのかというと、
長方形を描く位置を指定しています。
つまり今回の場合、XY座標で(100, 100)の点から(300, 200)の点までの長方形領域を塗りつぶします。

分かりにくいと思うので写真とりました↓


分かるでしょうか？みにくいと思うので、クリックしてみてください。

図のように、ウィンドウ中の左上の点が原点です。
そこから、右方向がX方向、下方向がY方向です。
ちなみに、ウィンドウのサイズは、Xが640で、Yが480です。
この座標の中で、（100, 100）と(300, 200)の点は、・・・だいたい図に示した当たりの位置ではないでしょうか？

多分、いろいろ値を代えて試してみると分かると思います。


それでは、次に円を描いてみましょう。今さっきのプログラムの次の行に付け加えて次のようにしてみてください。（太い部分は新たに付け加えたところです）

 boxf 100,100,300,200
 circle 100,100,300,200

これで実行してみてください。円が描かれるはず・・・あれ？
なぜか長方形しか描画されません。・・・あ。
分かった人もいるかもしれませんが、長方形も円も色が同じ事が問題なんですね。
そこで色を変更してみましょう。今さっきのプログラムを次のように付け加えてください。

 boxf 100,100,300,200
 color 255,0,0
 circle 100,100,300,200

これで実行すると、長方形の上に円が重なって描画される様子がわかると思います。
このcolor命令は、これから描かれる物の色を指定します。
色は、赤,緑,青の輝度（0～255の数値）でcolorの後に指定します。
つまり、今回の 255, 0, 0 は、赤色を示します。ちなみに黒は 0, 0, 0 で、白は 255, 255, 255 です。
この色は、次に再びcolor命令があるまで有効です。

このcolor命令を使えばあらゆるものの色、前回表示した文字の色や長方形の色も指定することが出来ます。

そんで、最後に直線を描いてみましょう。プログラムを次のようにしてください。

 boxf 100,100,300,200
 color 255,0,0
 circle 100,100,300,200
 color 0,255,0
 line 100,100,300,200

実行すると長方形と円の上に重なって、緑の線が描画されます。
line命令が直線を描く命令です。後の数値は、今までと同じ雰囲気です。




今日は、合計4つの命令を紹介してきましたが、全て
命令  数値1, 数値2, 数値3, 数値4
のような形をしていたのが分かると思います。(color命令だけ数値が3つ)

全てのHSPの命令はそんな感じです。
この命令の後についてくる数値をパラメータといって、命令を内容を細かく指定する役割があります。
（”直線を引け”では詳細が分からないので”(100, 100)から(300, 200)の点まで直線を引け”と言う風に）

ときどき、このパラメータは数値でない時があります。その例が前やったmes命令です。
しかも、mes命令のパラメータは文章が1つだけでした。
このように、命令によってパラメータの数も種類も違います。
命令  "文章",数値
のような命令もあります。


パラメータと言う言葉は今後出てくると思うので、覚えておいて下さい。


次回は、プログラムの非常に重要な要素である変数を紹介したいと思います。
ちょっとづつゲームに近づいていきます。