日本語プログラミング言語「なでしこ」 > マニュアル > 入門編

なでしこマニュアル入門編 - 絵を描こう

なでしこを使うと円や四角など絵を描くことができます。

1.四角

なでしこには、四角や円を描画するための命令が用意されてます。
何か絵を描いてみます。
四角(20,20,200,200)
これ↑を実行すると、画面に四角形が描画されます。
四角(X1,Y1,X2,Y2)』の書式で使います。
真っ黒な四角です。カラフルにしたいですね。
以下のように『塗り色は青色』と書くと、四角形の塗り色が青色になります。
赤色にしたいときは、『塗り色は赤色』と書きます。

塗り色は青色
四角(20,20,200,200)

画面の座標は、左上が(0,0)で、右下が(640,400)となってます。
数学のグラフ座標とは違うので注意が必要です。
  なでしこフォームの座標

2.円

円も四角と同じように、左上と右下の座標を指定します。

塗り色は、赤色。
円(10,10,200,200)
実行すると赤色の円が描かれます。

3.四角と円を組み合わせて「日の丸」を描く

さっきの円は、赤色で国旗の日の丸みたいですね。
いやいや、日の丸と言うのは、厳密な定義があるんです。
これに沿って作らなくては本物とは言えません。
日の丸
の定義
・縦横比は横10:縦7
・日章の直径は、縦の5分の3とする。
・日章の中心は旗面の中心より、横の100分の1旗竿の側に近寄る
・旗の地色は白、日章は紅色。
これに沿って作ると以下のようになります。
# 描画位置を決める
X = 10
Y = 10
# 旗(四角)の大きさを計算(横:縦 = 10:7)
W = 300
H = 210
# 旗を描く
塗り色は、白色。
四角(X, Y, X+W, Y+H)

# 円の大きさを計算
CW = H * 3 / 5 # 幅(縦の3/5)
CX = X + (W - CW) / 2 # 描画位置
CX = CX - (W / 100) # 1/100旗笹に寄る
CY = Y + (H - CW) / 2
# 円を描く
塗り色は、赤色。
円(CX, CY, CX+CW, CY+CW)
 実行したところ
四角の中に円を描くだけなのに、正確に描こうとすると、
意外と複雑なんですね。
ところで、『X = 10』というのが出てきますが、
『Xは10』と書くのと同じなんですか?
そうです。XとかYとか、これが変数で、
『X = 10』と『Xは10』は同じ意味になります。
あと、「*」とか「/」がよく出てきますが、これは、何ですか?
「*」は「×」と同じ意味、「/」は「÷」の意味です。
以前出てきたのですが、ヒダリちゃん、忘れてしまいましたか?
忘れた人は、こちらで復習してください。

4.線

線を描くときは以下のように描きます。

線(10,10,100,100)

実行すると左上から右下へと線が描かれます。
線の色を変えたいときはどうするんですか?
色を変えるときは、『線色は赤色』のように描きます。
線色は赤色
線(10,10,100,100)
ここまで覚えればお絵かきができそうですね。
先生、ここでちょっと時間をもらって、何かプログラムで
絵を描いてみていいですか?
はい。じゃぁ、これからお絵かきタイムということで。

5.多角形

「ま〜る、さんかく、しか〜く♪」・・・というのはセットですよね。
今、円と四角は覚えたんですけど、三角形はどうやって描くんですか?
三角形を描くには、『多角形』という命令を使います。
これは、三角形だけでなく、座標を任意の数だけ指定することで、
多角形を描画することができます。
以下のプログラムは、画面にを描画します。
塗り色は黄色
「86,74
127,10
164,67
234,68
185,123
215,196
129,151
56,196
75,121
14,71」で多角形。
上とまったく同じプログラムなんですけど、座標は1行に一個でなくても、
ず〜っとカンマで区切って以下のように書いてもOKです。
塗り色は黄色
「86,74,127,10,164,67,234,68,185,123,215,196,129,151,56,196,75,121,14,71」で多角形。

5.プログラムで作った絵画展?

多角形を使って、いろんな絵を描いてみましょう!
なでしこの<sample\ツール>フォルダの中に「多角形描画ツール.nako」という
お絵かきプログラムがありますので、これで何か面白い絵を描いてみて下さい。
これで描いた絵はプログラムとして出力できるので便利ですよ。
は〜い。
塗り色は16308094
「240,68,200,99,180,206,186,257,205,288,261,317,353,321,403,280,406,210,382,112,325,79」で多角形。
塗り色は15687463
「177,192,207,147,210,119,224,128,233,103,245,124,258,98,269,111,276,92,294,111,318,95,
333,110,341,99,366,128,386,179,408,201,413,148,405,115,386,80,351,54,303,37,246,37,187,53,
150,85,163,137,166,175」
で多角形。
「159,85,137,57,100,35,45,30,57,65,129,90,153,89」で多角形。
「373,76,395,44,421,21,462,14,509,11,526,18,517,48,461,67,407,74」で多角形。
塗り色は255
「396,69,386,59,385,48,398,45,414,47,410,64」で多角形。
塗り色は0
「247,215,235,204,232,179,244,173,257,182,257,204」で多角形。
「329,205,322,177,324,162,340,157,348,169,348,192」で多角形。
塗り色は16711680
「268,283,287,291,312,292,324,272」で多角形。
塗り色は16744448
「284,221,282,242,290,241」で多角形。
 実行したところ

→次へ

→戻る