７章：チュートリアル6:ピクチャの描画 : グラフィックスを使用するの作成

作成2013.02.28

参照元情報
　ピクチャの描画 : グラフィックスを使用するは（Visual Basic ガイドツアー）
「ピクチャの描画 : グラフィックスを使用する」にジャンプする
　作成方法の詳細は上記を参照願います。
チュートリアル6:ピクチャの描画 : グラフィックスを使用するの完成ファイル
　ピクチャの描画 : グラフィックスを使用するの解説とおりに作業を実施すると、プロジェクトファイル群が完成しますが、実用的に不十分な部分があるため、若干の修正を加えて作成しました。
　完成ファイルは以下からダウンロードできます。
　ダウンロード後は解凍してから使用してください。
　 [ 6:ピクチャの描画 : グラフィックスを使用する]をダウンロードする。
　解凍すると「Graphics」フォルダーがあります。
注（１）「Graphics」フォルダーの「Graphics.sln」ファイルをダブルクリックすると「Microsoft Visual Basic 2010 Express」が起動します。
注（２）メニューの「ウインド」＿「ウインドレイアウトのリセット」で標準に戻ります。
注（３）「ソリューションエクスプローラ」ウインドウ内の「Form1.vb」をダブルクリックすると「デザイン」が表示されます。
注（４）メニューの「表示」＿「コード」を選択するとコードが表示されます。
注（５）「Graphics.sln」の動作確認は「デバッグ」＿「デバッグ開始」で実行します。デバッグ機能を用いて動作確認を行います。
Graphicsの実行
（１）「Microsoft Visual Basic 2010 Express」のデバッグ機能を使用します。
（２）「デバッグ」＿「デバッグ開始」を選択します。
（３）空白の画面が表示されます。
（４）メニューの「TEST項目」＿「直線描画」を選択します。
（５）直線が表示されます。
（６）メニューの「TEST項目」＿「円と四角」を選択します。
（７）円と四角が表示されます。
（８）メニューの「TEST項目」＿「文字描画」を選択します。
（９）文字が表示されます。
（１０）メニューの「TEST項目」＿「画像描画」を選択します。
（１１）画像が表示されます。
（１２）クローズボックスでプログラムを終了します。
新規プロジェクトの作成
（１）新規プロジェクト
　新規プロジェクトを作成すると「デザイナー」にはForm1が自動生成されます。

（２） Formコード
Public Class Form1
End Class
が自動生成されます。

（３）パーツレイアウト
　Form1にMenuStripをツールボックスから設定します。

（４）リソース（画像）の追加方法
a.ソリューションエクスプローラで、[My Project] ノードをダブルクリックしてプロジェクトデザイナを開きます。
b.プロジェクトデザイナの [リソース] タブをクリックし、[リソースの追加] をクリックして [既存のファイルの追加] をクリックします。
c.[既存のファイルをリソースに追加] ダイアログボックスで、任意のイメージファイルを表示して選択し、[開く] をクリックします。

Public Class Form1の全コード

Public Class Form1
    Dim M As Integer = 1

    Private Sub Form1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles MyBase.Paint
        e.Graphics.Clear(Color.White)
        Select Case M
            Case 2
                Case 2
                ' Draw a  black line 
                e.Graphics.DrawLine(Pens.Black, 0, 50, 400, 50)
                ' Draw a  red line 
                e.Graphics.DrawLine(Pens.Red, 100, 0, 100, 500)
                ' Draw a  blue line
                e.Graphics.DrawLine(Pens.Blue, 0, 0, Me.Width, Me.Height)
                ' Draw a  black line 
                e.Graphics.DrawLine(Pens.Black, 0, 50, 400, 50)
                ' Draw a  red line 
                e.Graphics.DrawLine(Pens.Red, 100, 0, 100, 500)
                ' Draw a  blue line .
                e.Graphics.DrawLine(Pens.Blue, 0, 0, Me.Width, Me.Height)
            Case 3
                ' Draw a  green rectangle.
                e.Graphics.DrawRectangle(Pens.Green, 10, 50, 200, 150)
                ' Draw a blue square
                e.Graphics.DrawRectangle(Pens.Blue, 30, 50, 150, 150)
                ' Draw a  red circle.
                e.Graphics.DrawEllipse(Pens.Red, 10, 150, 150, 250)
                ' Draw ayellow oval.
                e.Graphics.DrawEllipse(Pens.Yellow, 20, 50, 250, 125)
                ' Fill the circle with the same color as its border.
                e.Graphics.FillEllipse(Brushes.Red, 0, 50, 150, 150)
                ' Fill the square with a different color.
                e.Graphics.FillRectangle(Brushes.Aquamarine, 31, 51, 148, 148)
            Case 4
                ' Create a font object.
                Dim aFont As New System.Drawing.Font("Arial", 22, FontStyle.Bold)
                ' Display the text with the DrawString method.
                e.Graphics.DrawString("Graphics are fun!", aFont, Brushes.Black, 20, 50)

                ' Rotate the text 45 degrees.
                e.Graphics.RotateTransform(45)
                e.Graphics.DrawString("And exciting too!", aFont, Brushes.Red, 100, 0)
            Case 5
                e.Graphics.RotateTransform(45)
                e.Graphics.DrawImage(My.Resources.Image1, 200, -100)
            Case Else
        End Select
    End Sub

    Private Sub ToolStripMenuItem2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ToolStripMenuItem2.Click
        Me.Invalidate()
        M = 2
    End Sub

    Private Sub ToolStripMenuItem3_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ToolStripMenuItem3.Click
        Me.Invalidate()
        M = 3
    End Sub

 
    Private Sub ToolStripMenuItem4_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ToolStripMenuItem4.Click
        Me.Invalidate()
        M = 4
    End Sub

    Private Sub ToolStripMenuItem5_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ToolStripMenuItem5.Click
        Me.Invalidate()
        M = 5
    End Sub
End Class

Playersクラスのコード

Public Class Players
    Inherits Persons

    Private numberValue As Integer
    Private positionValue As String
    Public Property Number() As Integer
        Get
            Number = numberValue
        End Get
        Set(ByVal value As Integer)
            numberValue = value
        End Set
    End Property
    Public Property Position() As String
        Get
            Position = positionValue
        End Get
        Set(ByVal value As String)
            positionValue = value
        End Set
    End Property
End Class

変数設定の解説
```
    Dim M As Integer = 1
```
（１） Dim M As Integer = 1は描画モード選択用の整数の設定です。

Private Sub Form1_Paintの解説

    Private Sub Form1_Paint(ByVal sender As System.Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles MyBase.Paint
        e.Graphics.Clear(Color.White)
        Select Case M
            Case 2
                ' Draw a  black line 
                e.Graphics.DrawLine(Pens.Black, 0, 50, 400, 50)
                ' Draw a  red line 
                e.Graphics.DrawLine(Pens.Red, 100, 0, 100, 500)
                ' Draw a  blue line
                e.Graphics.DrawLine(Pens.Blue, 0, 0, Me.Width, Me.Height)
                ' Draw a  black line 
                e.Graphics.DrawLine(Pens.Black, 0, 50, 400, 50)
                ' Draw a  red line 
                e.Graphics.DrawLine(Pens.Red, 100, 0, 100, 500)
                ' Draw a blue line .
                e.Graphics.DrawLine(Pens.Blue, 0, 0, Me.Width, Me.Height)
            Case 3
                ' Draw a  green rectangle.
                e.Graphics.DrawRectangle(Pens.Green, 10, 50, 200, 150)
                ' Draw a blue square
                e.Graphics.DrawRectangle(Pens.Blue, 30, 50, 150, 150)
                ' Draw a  red circle.
                e.Graphics.DrawEllipse(Pens.Red, 10, 150, 150, 250)
                ' Draw ayellow oval.
                e.Graphics.DrawEllipse(Pens.Yellow, 20, 50, 250, 125)
                ' Fill the circle with the same color as its border.
                e.Graphics.FillEllipse(Brushes.Red, 0, 50, 150, 150)
                ' Fill the square with a different color.
                e.Graphics.FillRectangle(Brushes.Aquamarine, 31, 51, 148, 148)
            Case 4
                ' Create a font object.
                Dim aFont As New System.Drawing.Font("Arial", 22, FontStyle.Bold)
                ' Display the text with the DrawString method.
                e.Graphics.DrawString("Graphics are fun!", aFont, Brushes.Black, 20, 50)

                ' Rotate the text 45 degrees.
                e.Graphics.RotateTransform(45)
                e.Graphics.DrawString("And exciting too!", aFont, Brushes.Red, 100, 0)
            Case 5
                e.Graphics.RotateTransform(45)
                e.Graphics.DrawImage(My.Resources.Image1, 200, -100)
            Case Else
        End Select
    End Sub

（１） Private Sub Form1_PaintはMyBase.Paintイベントが発生したとき、システムから呼び出されます。
（２）MyBase.Paintイベントはウインドウが生成されたとき、ウインドウのサイズが変化したとき発生します。
（３）メニュークリック時は、MyBase.Paintイベントは発生しません。ニュークリック時は Me.Invalidate()で再描画が必要なことを知らせる必要があります。
（４）引数にByVal e As System.Windows.Forms.PaintEventArgsが設定されます。（特別な引数です）
（５）描画にあたってはe.Graphicsに付帯したメソッドを使用する必要があります。
（６） e.Graphics.Clear(Color.White)はウインドウ全体を白にします。
（７）Select Case Mは変数Mの値で制御を変更します。
（８）Case 2はM=2時実行されます。
（９）e.Graphics.DrawLine(Pens.Black, 0, 50, 400, 50)は黒の線を座標（0,50)から(400,50)まで引きます。
（１０）Case 3はM=3時実行されます。
（１１）e.Graphics.DrawRectangle(Pens.Green, 10, 50, 200, 150)は緑の四角の線を描きます。
（１２）e.Graphics.DrawEllipse(Pens.Red, 10, 150, 150, 250)は赤の楕円の線を描きます。
（１３） e.Graphics.FillEllipse(Brushes.Red, 0, 50, 150, 150)は赤の楕円の塗りつぶしを描きます。
（１４） e.Graphics.FillRectangle(Brushes.Aquamarine, 31, 51, 148, 148)は水色の四角の塗りつぶしを描きます。
（１５）Case 4はM=4時実行されます。
（１５）Dim aFont As New System.Drawing.Font("Arial", 22, FontStyle.Bold)は文字フォントを生成します。
（１５）e.Graphics.DrawString("Graphics are fun!", aFont, Brushes.Black, 20, 50)は黒の文字を描きます。
（１６） e.Graphics.RotateTransform(45)は座標を45°回転します。
（１７） e.Graphics.DrawString("And exciting too!", aFont, Brushes.Red, 100, 0)は赤の文字を描きます。
（１８）Case5はM=5時実行されます。
（１９）e.Graphics.DrawImage(My.Resources.Image1, 200, -100)はリソース画像Image1を描きます。

Private Sub ToolStripMenuItem2_Clickの解説
```
    Private Sub ToolStripMenuItem2_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles ToolStripMenuItem2.Click
        Me.Invalidate()
        M = 2
    End Sub
```
（１）Private Sub ToolStripMenuItem2_Clickはメニューの「TEST項目」＿「直線描画」が選択されるとよびされます。
（２）Me.Invalidate()で再描画を要求します。
（３）M = 2で直線描画を要求します。

感想：ウインドウ内のグラフィック描画はシステムから呼び出された関数内で実行する必要があります。そして引数で渡された変数で描画関数を使用しないとうまく描画できません。
　また、再描画を行うにはグローバル関数Invalidate()を実行する必要があります。これは、グラフィカル・ユーザインターフェイス・プログラミングにおいて共通した性質のようです。
　描画をサブルーチンで行う場合は、引数を用いてサブルーチンに渡す必要があります。サブルーチンは Private Sub Form1_Paintルーチンから呼び出す必要があります。
　全体的には容易に作成できましたが、リソース画像の設定画面を表示するのに苦労しました。（まだ、基本操作になれていないようです。）

８章：チュートリアル7:テキストファイルからデータを読み取るの作成に行く。

トップページに戻る。