Delphi でコンピュータグラフィックス (CG) を描くにはどのようにしたらよいのでしょうか? それをこれから学習するのですが、実は皆は CG そのものにはすでに1年次の情報処理でふれています。「ペイント」による描画がそれです。プログラミングによるものではありませんが、このような描画ツールによって作成された画像も CG の一つです。それでは、「ペイント」を使って何か描いてみましょう。
拡大してみると、(小さいときには) 滑らかに見えた線が"ギザギザ"していることが分かりますね。このことから推測されるように、描画領域は小さな升目 (正方形) から構成されているのです (ここの"拡大"はその升目の大きさを拡大するという処理を行っています。だから"ギザギザ"が現れた訳です。一方、升目の大きさは変えずに、どんなに拡大しても滑らかな線となるような処理手法もあります)。
この小さな升目 (正方形) のことを、「画素」または「ピクセル (pixel)」と呼びます。つまり描画の単位という意味です。コンピュータはピクセル単位で画面表示を管理しています。容易に理解できるように、CG を描くとは、要するに画面上の各ピクセルを塗りつぶす事、つまり表示色を指定する事に他なりません。もし横一行のピクセルの表示色を黒、それ以外を白と指定するとそれは白地の背景に横方向に引かれた黒の直線となる訳です。各ピクセルの表示色のデータがあれば、原理的にどの様な画像でも描くことができます。パソコンの性能は目まぐるしく進化して来ましたが、この原理は昔から変わっていません。余談ですが、社会情報学部の第一期生達は、ピクセルの表示色のデータを市販のテキストから入手し、パソコン画面上に様々な画像 (風景画等) を表示させて喜んでいたものです。
ピクセル単位で画像を描くのに最も適しているコンポーネントは、イメージと呼ばれるコンポーネントです。これはコンポーネントパレットの Additional にあります。これを使って、右のように、ボタンを押すと (10, 20) の場所に点を描くプログラムを作りましょう。
まずは、コンポーネントを配置してください。
コンポーネント | Name プロパティ |
---|---|
「描画」ボタン | ButtonDraw |
イメージ | ImageField |
配置できたら、ImageField の Height プロパティと Width プロパティを 100 にしてください。
では、実際に点を描くためにはどうしたらいいのでしょうか。上で説明した事から、(10,20) という位置にある画素 (ピクセル) の表示色を背景色 (ここでは白色です) と異なる色に指定すれば良いことはすぐに分かると思います。
Image コンポーネントにはCanvas (キャンバス) というプロパティがあります。Canvasとは油絵を描く画布が本来の意味ですが、要するに CG を描く描画領域のことです。そして Canvas プロパティには Pixels プロパティが存在し、これがピクセルに対応します。下は、描画領域上の座標 (x,y) にあるピクセルが Canvas.Pixels[x, y] に対応していることを模式的に示したものです。
この Pixels プロパティに適当な色を指定してやれば、つまり代入してやればよいのです。今、表示するピクセル (点) の色を青色としましょう。すると描画ボタンクリックのイベントハンドラは次のようになります。
procedure TForm1.ButtonDrawClick(Sender: TObject); begin ImageField.Canvas.Pixels[10, 20] := clBlue; end;