子供のプログラミング　BASIC!を使ってみよう ７

BASIC!MLの詳しい導入手順と初めての使い方はこちらの記事を参照してください。英語版のマニュアルはこちらにあります。

前回の宿題の解答例

問題

前回の宿題の記事はこちらになります。

下のような日本の国旗を緑の背景で描いてみてください。大きさとかバランスは好みで良いです。

BASIC!のマニュアル　グラフィックス命令抜粋　その２

グラフィックス設定命令

Gr.set.antialias {{<lexp>}{,<paint_nexp>}}

アンチエイリアスをオンにするかオフにするかを設定します。lexpが０ならオフに、lexpが０以外ならオンになります。１ピクセル幅の線を引きたい場合は、オフにする必要があります。パラメーター無しでこの命令を使用すると、設定が切り替わります。（オンならオフに、オフならオンに）

アンチエイリアスとは：コンピューターでは画像をピクセルという点の集まりで表現します。その時、斜めの線を描画した時などにギザギザに見えてしまいます。それを軽減する手法がアンチエイリアスです。BASIC!では標準でオンになっています。

Gr.set.stroke {{<nexp>}{,<paint_nexp>}

線の幅を指定します。nexpを０指定すると、アンチエイリアスがオフの場合一番細い線（１ピクセル幅）を引くことができます。アンチエイリアスがオンの場合は、２ｘ２ピクセルで線が引かれます。

Gr.orientation <nexp>

スクリーンの向きを制御できます。指定するnexpの値により以下の様になります。
－１　：　センサーにより自動
０　　：　横方向に固定
１　　：　縦方向に固定
２　　：　逆横方向に固定
３　　：　逆縦方向に固定

Gr.statusbar {<height_nvar>} {, showing_lvar}

ステイタスバーの情報が返されます。height_nvarにはステイタスバーの高さが、showing_lvarにはGr.openでステイタスバー無しを指定していれば０、有りを指定していれば０が返されます。

Gr.screen width, height{, density }

スクリーンの幅と高さが返されます。densityはオプションでスクリーンのdpiが返されますが、通常不要です。スクリーンのオリエンテーションを変更した場合は、この値は正しくありません。

Gr.scale x_factor, y_factor

全ての描画コマンドを、x_factorとy_factorの倍率で描画します。使われている端末の画面の大小に関わらず、同じ画面を表示するために使います。プログラムを高さ480、幅800のスクリーンサイズで作成した時に、使っている端末の高さが960、幅1600の場合は、Gr.scale 2,2　と記述する事で正しく表示されます。

Gr.cls

グラフィックスクリーンのクリアーします。描画した内容は全て削除されます。Gr.colorやGr.textで指定した設定は全てリセットされます。クリアーした結果を表示するにはGr.render命令が必要です。

Gr.close

グラフィックモードを終了します。プログラムは終了しません。グラフィックスクリーンが消されて、テキストスクリーンが表示されます。

Gr.front flag

グラフィックスクリーン、テキストスクリーンのどちらを最前面に表示する（ユーザーに見せる）か指定します。flag=０であれば、テキストスクリーンが最前面になり、flagが０以外であればグラフィックスクリーンが最前面に表示されます。

Gr.brightness <nexp>

グラフィックスクリーンの明るさを設定します。nexpが０．０１が一番暗く、１．０が一番明るくなります。

グラフィックスオブジェクト作成命令

前の記事で、四角と円を描く命令を紹介しました。ここでは、それ以外の命令を紹介します。

Gr.point <obj_nvar>, x, y

xとyで指定した座標に点を描画します。obj_nvarにはオブジェクトリストのオブジェクトナンバーが返されます。点のサイズはGr.set.strokeとGr.set.antialiasの設定によります。Gr.modifyのパラメーターはxとyです。

点を描くプログラム例:

実行結果:

Gr.line <obj_nvar>, x1, y1, x2, y2

座標(x１、ｙ１)から座標(x２、ｙ２)へ線が引かれます。obj_nvarにはオブジェクトリストのオブジェクトナンバーが返されます。線の太さはGr.set.strokeとGr.set.antialiasの設定によります。Gr.modifyのパラメーターはｘ１、ｘ２、ｙ１、ｙ２です。

線を引くプログラム例：

実行結果：

Gr.oval <obj_nvar>, left, top, right, bottom

楕円形を描画します。obj_nvarにはオブジェクトリストのオブジェクトナンバーが返されます。塗りつぶすかどうかは、GR.colorのスタイルで指定します。Gr.modifyのパラメーターはleft,、top、 right、 bottomｘです。

楕円形を描くプログラム例：

実行結果：

Gr.arc <obj_nvar>, left, top, right, bottom, start_angle, sweep_angle, fill_mode

円弧状の形を描画します。obj_nvarにはオブジェクトリストのオブジェクトナンバーが返されます。left,top,right,bottomで指定された4角の中心から、start_angleで指定した角度でsweep_angleの度数分円弧を描きます。

円弧を描くプログラム例①（start_angleを変更、sweep_angleは一定）：

実行結果（分かりやすいように青で四角も描画してあります。）：

円弧を描くプログラム例②（start_angleは一定、sweep_angleを変更）：

実行結果（分かりやすいように青で四角も描画してあります。）：

グラフィックステキスト命令

gr.text.draw命令が唯一のテキストを描画する命令です。その他のtext命令は描画しようとするテキストの属性を決めたり、確認する命令です。

Gr.text.draw <object_number_nvar>, <x_nexp>, <y_nexp>, <text_object_sexp>

ディスプレイリストに、テキストオブジェクトを挿入します。x_nexpとy_nexpの座標を起点にtext_object_sexpで指定したテキストが描画されます。この命令前に、以下の命令でテキストの属性を指定します。

Gr.text.align {{<type_nexp>}{,<paint_nexp>}}

Gr.text.draw命令で指定したｘ、ｙの位置にテキストを描画しますが、その時左寄せ(type_nexp=0)、真ん中(type_nexp=1)、右寄せ(type_nexp=2)に描画するか指定します。

文字を、左寄せ、センター、右寄せで描画する例：

実行結果：

Gr.text.bold {{<lexp>}{,<paint_nexp>}}

描画するテキストを太字にすることができます。lexpが０で太字オフ、０以外で太字オンになります。lexpを指定しないと、太字オンならオフに、オフならオンに切り替わります。

Gr.text.size {{<size_nexp>}{,<paint_nexp>}}

描画するテキストの大きさをピクセルで指定します。

Gr.text.skew {{<skew_nexp>}{,<paint_nexp>}}

描画するテキストをイタリック体（斜字体）にします。一般的なイタリック体に近い指定は、skew_nexpを－０．２５に指定します。

Gr.text.strike {{<lexp>}{,<paint_nexp>}}

描画するテキストに打消し線を追加します。lexpが０なら打ち消し線無し、０以外なら打ち消し線有です。指定しない場合は、オンオフが切り替わります。

Gr.text.underline {{<lexp>}{,<paint_nexp>}}

描画するテキストに下線をつけることができます。lexpが０なら下線無し、０以外なら下線有りです。指定しない場合は、オンオフが切り替わります。

太字、イタリック体、打消し、下線のプログラム例：

実行例：

グラフィック命令その２は以上です。ここまででグラフィックスクリーンに様々な図形と文字を描画することができます。サンプルプログラム例を参考にご自分で色々試してみてください。次の記事では、描画した図形とビットマップを動かす命令について紹介します。