[Tips][PictureBox] 図形や文字を描画する

PictureBoxコントロールに図形や文字を描画するにはGraphicsオブジェクトを使用します。

はじめに PictureBoxコントロールのCreateGraphicsメソッドでGraphicsオブジェクトを作成します。

次に、作成したGraphicsオブジェクトを使用して図形や文字を描画します。

(GraphicsオブジェクトのDrawLine, DrawEllipse,DrawStringといったメソッドを使用)

最後にリソースを解放します。

下記はPictureBoxに図形や文字を描画する例です。

[図形を描画]ボタンをクリックすると描画を行います。

VBの例

' [描画]ボタンクリック時の処理
Private Sub btnDraw_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnDraw.Click
    Dim objPen = New Pen(System.Drawing.Color.Blue, 2)
    Dim objFont = New Font("MS Pゴシック", 15)
    Dim objGrp As Graphics = PictureBox1.CreateGraphics

    ' 直線を引く
    objGrp.DrawLine(objPen, 20, 20, 200, 200)
    ' 楕円を描く
    objGrp.DrawEllipse(objPen, 10, 10, 190, 190)
    ' 楕円を描く
    objGrp.DrawString("描画テスト", objFont, Brushes.Red, 80, 100)

    ' リソースを解放する
    objPen.Dispose()
    objFont.Dispose()
    objGrp.Dispose()
End Sub

C#の例

// [描画]ボタンクリック時の処理
private void btnDraw_Click(object sender, EventArgs e)
{
    Pen objPen = new Pen(System.Drawing.Color.Blue, 2);
    Font objFont = new Font("MS Pゴシック", 15);
    Graphics objGrp = pictureBox1.CreateGraphics();

    // 直線を引く
    objGrp.DrawLine(objPen, 20, 20, 200, 200);
    // 楕円を描く
    objGrp.DrawEllipse(objPen, 10, 10, 190, 190);
    // 文字を描画する
    objGrp.DrawString("描画テスト", objFont, Brushes.Red, 80, 100);

    // リソースを解放する
    objPen.Dispose();
    objFont.Dispose();
    objGrp.Dispose();
}

[Tips][PictureBox] PictureBoxに表示されたイメージを消去する

[ad code=2 align=left]
PictureBoxコントロールに表示されたイメージを消去するには、ImageプロパティにNothing(C#の場合はNull)を設定します。

下記はPictureBoxに表示されたイメージを消去する例です。

VBの例

' [画像を開く]ボタンクリック時の処理
Private Sub btnOpenImage_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnOpenImage.Click
    'フィルターの設定
    OpenFileDialog1.Filter = "画像ファイル|*.gif;*.jpg;*.png|すべてのファイル|*.*"

    'ファイル選択ダイアログを表示
    OpenFileDialog1.ShowDialog()
End Sub

' [開く]ボタンクリック時の処理
Private Sub OpenFileDialog1_FileOk(ByVal sender As System.Object, ByVal e As System.ComponentModel.CancelEventArgs) Handles OpenFileDialog1.FileOk
    'イメージの表示方法を設定(サイズ比率を維持したまま拡大/縮小)
    PictureBox1.SizeMode = PictureBoxSizeMode.Zoom

    'PictureBoxにイメージを読み込む
    PictureBox1.Image = Image.FromFile(OpenFileDialog1.FileName)
End Sub

' [画像を消去]ボタンクリック時の処理
Private Sub btnImageClear_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnImageClear.Click
    '★★★画像を消去する★★★
    PictureBox1.Image = Nothing
End Sub

C#の例

// [画像を開く]ボタンクリック時の処理
private void btnOpenImage_Click(object sender, EventArgs e)
{
    // フィルターの設定
    openFileDialog1.Filter = "画像ファイル|*.gif;*.jpg;*.png|すべてのファイル|*.*";

    // ファイル選択ダイアログを表示
    openFileDialog1.ShowDialog();
}

// [開く]ボタンクリック時の処理
private void openFileDialog1_FileOk(object sender, CancelEventArgs e)
{
    // イメージの表示方法を設定(サイズ比率を維持したまま拡大/縮小)
    pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

    // PictureBoxにイメージを読み込む
    pictureBox1.Image = Image.FromFile(openFileDialog1.FileName);
}

// [画像を消去]ボタンクリック時の処理
private void btnImageClear_Click(object sender, EventArgs e)
{
    // ★★★画像を消去する★★★
    pictureBox1.Image = null;
}

[Tips][PictureBox] クリップボードの画像を表示する

クリップボードの画像をPictureBoxに表示するには、クリップボードの画像をBMP形式にキャストして、Imageプロパティにセットします。

下記はグリップボードの画像をPictureBoxに表示する例です。
[クリップボードの画像を表示]ボタンがクリックされると、現在クリップボードにある画像をBMP形式に変換して表示します。

VBの例

' [クリップボードの画像を表示]ボタンクリック時の処理
Private Sub btnShowClipboard_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnShowClipboard.Click
    'イメージの表示方法を設定(サイズ比率を維持したまま拡大/縮小)
    PictureBox1.SizeMode = PictureBoxSizeMode.Zoom

    '★★★クリップボードの画像をPictureBoxに表示する★★★
    PictureBox1.Image = DirectCast(Clipboard.GetDataObject().GetData(DataFormats.Bitmap), Bitmap)
End Sub

C#の例

// [クリップボードの画像を表示]ボタンクリック時の処理
private void btnShowClipboard_Click(object sender, EventArgs e)
{
    // イメージの表示方法を設定(サイズ比率を維持したまま拡大/縮小)
    pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

    // ★★★クリップボードの画像をPictureBoxに表示する★★★
    pictureBox1.Image = (Bitmap)Clipboard.GetDataObject().GetData(DataFormats.Bitmap);
}

[Tips][PictureBox] 画像を保存する

PictureBoxに表示されている画像はImageプロパティSaveメソッドで保存することが可能です。

Saveメソッドの第1引数には保存ファイルパスを、第2引数には保存形式を指定します。

保存形式にはImageFormatクラスの値を指定します。

ImageFormatクラス
メンバ名 説明
BMP ビットマップ(BMP)形式
Emf 拡張メタファイル(EMF)形式
Exif Exif形式
Gif GIF形式
GUID このImageFormatオブジェクトを表すGuid構造体
Icon Windowsアイコンイメージ形式
Jpeg JPEG形式
MemoryBmp メモリ上のビットマップ形式
Png PNG形式
Tiff TIFF形式
Wmf Windowsメタファイル(WMF)形式

下記は、PictureBoxに表示されている画像を保存する例です。

[画像を開く]ボタンでPictureBoxに表示する画像を選択し、[画像を保存]ボタンでPictureBoxに表示されている画像を保存します。

画像の保存では、拡張子で画像の保存形式を決定しています。

サンプルの画面デザインは下記のようにしました。

VBの例

' [画像を開く]ボタンクリック時の処理
Private Sub btnOpenImage_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnOpenImage.Click
    'フィルターの設定
    OpenFileDialog1.Filter = "画像ファイル|*.gif;*.jpg;*.png|すべてのファイル|*.*"

    'ファイル選択ダイアログを表示
    OpenFileDialog1.ShowDialog()
End Sub

' [開く]ボタンクリック時の処理
Private Sub OpenFileDialog1_FileOk(ByVal sender As System.Object, ByVal e As System.ComponentModel.CancelEventArgs) Handles OpenFileDialog1.FileOk
    'イメージの表示方法を設定(サイズ比率を維持したまま拡大/縮小)
    PictureBox1.SizeMode = PictureBoxSizeMode.Zoom

    'PictureBoxにイメージを読み込む
    PictureBox1.Image = Image.FromFile(OpenFileDialog1.FileName)
End Sub

' [画像を保存]ボタンクリック時の処理
Private Sub btnSaveImage_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles btnSaveImage.Click
    'フィルターの設定
    SaveFileDialog1.Filter = "GIF形式|*.gif|JPEG形式|*.jpeg|PNG形式|*.png"

    'ファイル保存ダイアログを表示
    SaveFileDialog1.ShowDialog()
End Sub

' [保存]ボタンクリック時の処理
Private Sub SaveFileDialog1_FileOk(ByVal sender As System.Object, ByVal e As System.ComponentModel.CancelEventArgs) Handles SaveFileDialog1.FileOk
    Dim extension As String = IO.Path.GetExtension(SaveFileDialog1.FileName)

    Select Case extension.ToUpper
        Case ".GIF"
            '★★★PictureBoxのイメージをGIF形式で保存する★★★
            PictureBox1.Image.Save(SaveFileDialog1.FileName, Imaging.ImageFormat.Gif)
        Case ".JPEG"
            '★★★PictureBoxのイメージをJPEG形式で保存する★★★
            PictureBox1.Image.Save(SaveFileDialog1.FileName, Imaging.ImageFormat.Jpeg)
        Case ".PNG"
            '★★★PictureBoxのイメージをGIF形式で保存する★★★
            PictureBox1.Image.Save(SaveFileDialog1.FileName, Imaging.ImageFormat.Png)
    End Select
End Sub

C#の例

// [画像を開く]ボタンクリック時の処理
private void btnOpenImage_Click(object sender, EventArgs e)
{
    // フィルターの設定
    openFileDialog1.Filter = "画像ファイル|*.gif;*.jpg;*.png|すべてのファイル|*.*";

    // ファイル選択ダイアログを表示
    openFileDialog1.ShowDialog();
}

// [開く]ボタンクリック時の処理
private void openFileDialog1_FileOk(object sender, CancelEventArgs e)
{
    // イメージの表示方法を設定(サイズ比率を維持したまま拡大/縮小)
    pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

    // PictureBoxにイメージを読み込む
    pictureBox1.Image = Image.FromFile(openFileDialog1.FileName);
}

/// [画像を保存]ボタンクリック時の処理
private void btnSaveImage_Click(object sender, EventArgs e)
{
    // フィルターの設定
    saveFileDialog1.Filter = "GIF形式|*.gif|JPEG形式|*.jpeg|PNG形式|*.png";

    // ファイル保存ダイアログを表示
    saveFileDialog1.ShowDialog();
}

// [保存]ボタンクリック時の処理
private void saveFileDialog1_FileOk(object sender, CancelEventArgs e)
{
    string extension = System.IO.Path.GetExtension(saveFileDialog1.FileName);

    switch (extension.ToUpper())
    {
        case ".GIF":
            // ★★★PictureBoxのイメージをGIF形式で保存する★★★
            pictureBox1.Image.Save(saveFileDialog1.FileName, System.Drawing.Imaging.ImageFormat.Gif);
            break;
        case ".JPEG":
            // ★★★PictureBoxのイメージをJPEG形式で保存する★★★
            pictureBox1.Image.Save(saveFileDialog1.FileName, System.Drawing.Imaging.ImageFormat.Jpeg);
            break;
        case ".PNG":
            // ★★★PictureBoxのイメージをGIF形式で保存する★★★
            pictureBox1.Image.Save(saveFileDialog1.FileName, System.Drawing.Imaging.ImageFormat.Png);
            break;
    }
}

実行例は下記の通りです。