グラフィックスの表示

更新 : 2007 年 11 月

このレッスンでは、Visual Basic のグラフィックス メソッドを使用してフォームに描画する方法を説明します。

前のレッスンでは、PictureBox コントロールを使用して、フォーム上に画像を表示する方法を説明しました。既に画像がある場合はそれで十分ですが、フォーム上に直接何かを描画する必要が生じる場合があります。たとえば、2 つのフィールドを区切る線や、重要なラベルを強調する円を描画する必要がある場合などが考えられます。

Visual Basic では、グラフィックス メソッドを使用することで、フォームやコントロールにほとんど何でも描画できます。

グラフィックスの基本

描画を始める前に、いくつかのことを知っておく必要があります。コンピュータの画面は、何千個ものピクセルと呼ばれる小さなドットで構成されています。プログラムは、各ピクセルの色を定義することによって、画面に何を表示するかを制御します。もちろん、その処理の大半は、フォームやコントロールを定義するコードによって自動的に行われます。

フォームを、描画やペイントを行うキャンバスと想定してください。実際のキャンバスと同様、フォームにも寸法があります。実際のキャンバスはインチやセンチメートルなどの単位で計測しますが、フォームはピクセル単位で計測します。座標というシステムによって各ピクセルの位置が決定されます。つまり、X 座標で左から右方向の寸法を計測し、Y 座標で上から下方向の寸法を計測します。

座標の始点は、フォームの左上端です。このため、左から 10 ピクセル、上から 10 ピクセルの位置に 1 つのドットを描画する場合は、X 座標と Y 座標を 10, 10 と表します。

ピクセルは、グラフィックスの幅と高さを表現するときにも使用します。幅 100 ピクセル、高さ 100 ピクセルで、左上端が左から 10 ピクセル、上から 10 ピクセルの位置にある四角形を定義するには、座標を 10, 10, 100, 100 と表します。

画面上に描画する操作は、ペイントと呼ばれます。フォームおよびコントロールには、再描画の必要が生じたときに発生する Paint イベントが定義されています。たとえば、フォームが最初に表示されるときや、他のウィンドウの下に隠れてしまったときなどです。グラフィックスを表示するためのコードは、通常 Paint イベント ハンドラに記述します。

直線の描画

フォーム上に線を描画するには、座標および色という 2 つの事項を定義する必要があります。前述したとおり、X 座標と Y 座標はピクセルで表されます。線には、座標の組み合わせが 2 つあります。つまり、始点と、その後に記述される終点です。

紙に線を描くときにペンを使用するのと同じように、Visual Basic でも Pen オブジェクトを使用してフォーム上に描画します。Pen オブジェクトは、線の外観 (この場合は色) を定義します。次の手順では、フォーム上に横線、縦線、および斜めの線を描画します。

やってみよう

線を描画するには

  1. [ファイル] メニューの [新規作成] をポイントし、[プロジェクト] をクリックします。

  2. [新しいプロジェクト] ダイアログ ボックスの [テンプレート] ペインで、[Windows アプリケーション] をクリックします。

  3. [プロジェクト名] ボックスに「Lines」と入力し、[OK] をクリックします。

    新しい Windows フォーム プロジェクトが開きます。

  4. フォームをダブルクリックしてコード エディタを開き、[イベント] ボックスの一覧の [Paint] をクリックします。

  5. Form1_Paint イベント ハンドラに次のコードを追加します。

    ' Draw a 400 pixel black line 25 pixels from the top of the form.
    e.Graphics.DrawLine(Pens.Black, 0, 25, 400, 25)
    ' Draw a 500 pixel red line 100 pixels from the left of the form.
    e.Graphics.DrawLine(Pens.Red, 100, 0, 100, 500)
    ' Draw a diagonal blue line from the upper left to the lower right.
    e.Graphics.DrawLine(Pens.Blue, 0, 0, Me.Width, Me.Height)
    
  6. F5 キーを押してプログラムを実行します。フォームに 3 本の線が表示されます。

次の手順

このレッスンでは、グラフィックスの基本と、線を描画する方法を説明しました。次のレッスンでは、四角形や円などの形を描画する方法を説明します。

次のレッスン : 「フォームへの図形の描画

参照

処理手順

イメージの表示 : PictureBox コントロールの使用

その他の技術情報

ピクチャの描画 : グラフィックスを使用する

Visual Basic ガイド ツアー