C# PictureBoxの使い方完全ガイド|画像表示・サイズ調整・読み込みを初心者向けに解説

はじめに

C# PictureBoxは、Windowsフォームアプリで画像を表示するときに最もよく使われるコントロールの1つです。jpg、png、bmpなどの画像をフォーム上に表示したり、サイズを調整したり、ボタンクリックで画像を読み込んだり、URL上の画像を表示したりできます。

初心者がつまずきやすいポイントは、「画像が表示されない」「サイズが合わない」「ファイルを削除できない」「画像を差し替えるとメモリが増える」といった部分です。この記事では、C# PictureBoxの基本的な使い方から、画像表示、サイズ調整、ファイル選択、URL読み込み、画像の解放、イベント処理、よくあるエラー対策まで順番に解説します。

1. C#のPictureBoxとは?できることと使う場面

1-1. PictureBoxはWindowsフォームで画像を表示するためのコントロール

PictureBoxは、C#のWindowsフォームアプリで画像を表示するためのコントロールです。フォーム上に画像表示エリアを作り、その中に画像ファイルやBitmapオブジェクトなどを表示できます。Microsoft Learnでも、PictureBoxは通常、ビットマップ、メタファイル、アイコン、JPEG、GIF、PNGファイルからのグラフィックス表示に使うと説明されています。

たとえば、プロフィール画像、商品画像、プレビュー画像、画像ビューア、サムネイル一覧などを作るときにPictureBoxを使います。ボタンやテキストボックスと同じようにフォームに配置できるため、初心者でも扱いやすいのが特徴です。

1-2. PictureBoxで表示できる主な画像形式

PictureBoxでよく扱う画像形式は、次のようなものです。

形式用途
jpg / jpeg写真画像
png透明部分を含む画像、UI素材
bmpWindows系のビットマップ画像
gif簡単なアニメーションや軽量画像
icoアイコン画像

System.Drawing.Image.FromFileのドキュメントでは、BMP、GIF、JPEG、PNG、TIFFなどがマネージドGDI+の組み込みエンコーダー・デコーダーとして挙げられています。

1-3. PictureBoxを使う代表的な用途

PictureBoxは、単に画像を表示するだけでなく、さまざまな用途に使えます。

用途
画像ビューア選択した画像を大きく表示する
サムネイル表示複数画像を小さく一覧表示する
プレビュー機能印刷前、アップロード前の画像確認
画像クリック処理画像をクリックして詳細を表示する
描画処理Paintイベントで文字や図形を重ねる
カメラ・スキャン画像表示取得した画像を画面に表示する

画像を「見せる」目的であればPictureBoxが向いています。一方で、本格的な画像加工やピクセル単位の編集を行う場合は、BitmapやGraphicsを組み合わせて使うことが多くなります。

1-4. PictureBoxとImage・Bitmapの違い

PictureBox、Image、Bitmapは似た場面で出てきますが、役割が違います。

種類役割
PictureBox画像をフォーム上に表示するコントロール
Image画像を表す抽象クラス
Bitmapピクセルデータを持つ具体的な画像クラス

ImageはBitmapやMetafileなどの基底となる抽象クラスで、Bitmapはピクセルデータによって定義される画像を扱うためのクラスです。

簡単に言うと、PictureBoxは「画像を置く場所」、ImageやBitmapは「表示する画像データ」です。

2. Visual StudioでPictureBoxを配置する基本手順

2-1. Windowsフォームアプリを作成する

Visual Studioを起動し、「新しいプロジェクトの作成」から「Windows フォーム アプリ」を選びます。C#で作成する場合は、言語がC#になっていることを確認してください。

プロジェクトを作成すると、Form1という画面が表示されます。この画面にPictureBoxを配置して、画像表示用のアプリを作っていきます。

2-2. ツールボックスからPictureBoxをフォームに追加する

フォームデザイナーを開いた状態で、左側の「ツールボックス」から「PictureBox」を探します。見つからない場合は、ツールボックス内の検索欄に「PictureBox」と入力すると見つけやすくなります。

PictureBoxをフォーム上にドラッグ&ドロップすると、画像表示用の枠が追加されます。

2-3. Name・Size・Locationなど基本プロパティを設定する

PictureBoxを配置したら、プロパティウィンドウで基本設定を行います。

プロパティ説明
Nameコードから使う名前pictureBox1
Size幅と高さ300, 200
Locationフォーム上の位置20, 20
BorderStyle枠線の有無FixedSingle
SizeMode画像の表示方法Zoom

特に重要なのはNameとSizeModeです。コードで画像を設定するときは、pictureBox1.ImageのようにNameを使います。

2-4. デザイナーで画像を設定する方法

コードを書かずに画像を設定することもできます。PictureBoxを選択し、プロパティウィンドウの「Image」から画像ファイルを指定します。

固定画像を表示するだけなら、この方法が簡単です。ただし、実行中にユーザーが画像を選ぶ場合や、ボタンで画像を切り替える場合は、C#コードで設定する方法を使います。

2-5. 実行して画像が表示されるか確認する

画像を設定したら、Visual Studioの開始ボタンを押して実行します。フォーム上のPictureBoxに画像が表示されれば成功です。

画像が大きすぎて切れる場合は、PictureBoxのSizeModeをZoomまたはStretchImageに変更してください。SizeModeは画像のクリッピングや配置を制御するプロパティです。

3. C#コードでPictureBoxに画像を表示する方法

3-1. Imageプロパティに画像を設定する基本コード

PictureBoxに画像を表示する基本は、Imageプロパティに画像を代入することです。

C#
pictureBox1.Image = Image.FromFile(@"C:\Images\sample.jpg");

この1行で、指定した画像ファイルをPictureBoxに表示できます。Imageプロパティは、PictureBoxに表示する画像を設定するための代表的なプロパティです。

3-2. Image.FromFileでローカル画像を読み込む

ローカルPCにある画像ファイルを読み込む場合は、Image.FromFileを使います。

C#
using System;
using System.Drawing;
using System.Windows.Forms;

private void Form1_Load(object sender, EventArgs e)
{
pictureBox1.Image = Image.FromFile(@"C:\Images\photo.png");
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;
}

Image.FromFileは指定したファイルからImageを作成します。ただし、作成したImageが破棄されるまでファイルがロックされたままになる点に注意が必要です。

3-3. Bitmapを使って画像を表示する

Bitmapを使って画像を表示することもできます。

C#
Bitmap bitmap = new Bitmap(@"C:\Images\sample.bmp");
pictureBox1.Image = bitmap;

Bitmapはピクセルデータを持つ画像クラスなので、画像編集や描画処理と組み合わせる場面でよく使います。たとえば、画像の上に線を描く、文字を重ねる、ピクセル単位で加工する場合などです。

3-4. プロジェクトのリソース画像を表示する

プロジェクトに追加したリソース画像を表示する場合は、Properties.Resourcesを使います。

C#
pictureBox1.Image = Properties.Resources.sampleImage;
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

リソース画像はアプリに埋め込まれるため、画像ファイルのパスを気にせず使えるのがメリットです。アイコン画像や固定のロゴ画像などに向いています。

画像を後でDisposeする設計にする場合は、共有リソースを直接代入するのではなく、コピーして使うと安全です。

C#
pictureBox1.Image = new Bitmap(Properties.Resources.sampleImage);

3-5. 画像を差し替える・再表示する方法

画像を差し替えるときは、古い画像を解放してから新しい画像を設定します。

C#
private void ChangeImage(string path)
{
Image oldImage = pictureBox1.Image;

pictureBox1.Image = Image.FromFile(path);
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

oldImage?.Dispose();
}

ただし、この書き方では新しく読み込んだファイルがImageの破棄までロックされます。ファイルロックを避けたい場合は、後述する安全な読み込み方を使いましょう。

4. PictureBoxの画像サイズを調整する方法

4-1. SizeModeプロパティの基本

PictureBoxの画像サイズ調整では、SizeModeプロパティが重要です。SizeModeにより、画像をそのまま表示するのか、引き伸ばすのか、中央表示するのか、比率を保って拡大縮小するのかを指定できます。

C#
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

初心者におすすめなのはZoomです。画像の縦横比を保ったまま、PictureBoxの枠内に収めて表示できます。

4-2. Normal・StretchImage・AutoSize・CenterImage・Zoomの違い

PictureBoxSizeModeには、主に次の5種類があります。

SizeMode表示方法
Normal左上にそのまま表示。大きい画像は切れる
StretchImagePictureBoxのサイズに合わせて引き伸ばす
AutoSizePictureBox自体を画像サイズに合わせる
CenterImage中央に表示。大きい画像は切れる
Zoom縦横比を保って拡大縮小する

Microsoft Learnでは、Normalは左上配置で大きい場合はクリップ、StretchImageはPictureBoxサイズに合わせて伸縮、AutoSizeはPictureBoxを画像サイズに合わせる、CenterImageは中央配置、Zoomは縦横比を維持して拡大縮小すると説明されています。

4-3. 画像を枠内に収めたい場合はZoomを使う

画像全体を切らずに表示したい場合は、Zoomを使います。

C#
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

Zoomは縦横比を保つため、写真やイラストの見た目が崩れません。画像ビューアやプレビュー画面では、基本的にZoomを選ぶとよいでしょう。

4-4. 画像をPictureBoxいっぱいに引き伸ばす方法

PictureBox全体を画像で埋めたい場合は、StretchImageを使います。

C#
pictureBox1.SizeMode = PictureBoxSizeMode.StretchImage;

ただし、画像とPictureBoxの縦横比が違う場合、画像が横長や縦長に歪みます。見た目を重視するならZoom、枠を完全に埋めることを重視するならStretchImageと覚えると分かりやすいです。

4-5. アスペクト比を保ったまま表示するコツ

アスペクト比を保つには、次の設定が基本です。

C#
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;
pictureBox1.BorderStyle = BorderStyle.FixedSingle;

Zoomを使えば画像の比率は維持されます。ただし、画像とPictureBoxの比率が違う場合は上下または左右に余白ができます。余白が出ても画像が歪まない方を優先するのが、写真表示では一般的です。

4-6. PictureBox自体のサイズを変更する方法

PictureBox自体のサイズは、SizeまたはClientSizeで変更できます。

C#
pictureBox1.Size = new Size(400, 300);

実行中に表示領域のサイズを変えたい場合は、ClientSizeを使う方法もあります。PictureBoxの表示領域は実行時にClientSizeで変更できると説明されています。

C#
pictureBox1.ClientSize = new Size(400, 300);

5. ファイル選択ダイアログから画像を読み込む方法

5-1. OpenFileDialogを使う基本手順

ユーザーに画像ファイルを選ばせるには、OpenFileDialogを使います。手順は次の通りです。

  1. OpenFileDialogを作成する

  2. 選択できる拡張子を指定する

  3. ダイアログを表示する

  4. 選択されたファイルパスを取得する

  5. PictureBoxに画像を表示する

5-2. jpg・png・bmpなど画像ファイルだけを選択できるようにする

画像ファイルだけ選べるようにするには、Filterを設定します。

C#
openFileDialog1.Filter = "画像ファイル|*.jpg;*.jpeg;*.png;*.bmp;*.gif|すべてのファイル|*.*";

これにより、ユーザーが画像以外のファイルを選んでしまう可能性を減らせます。

5-3. 選択した画像をPictureBoxに表示するサンプルコード

ボタンをクリックして画像を選び、PictureBoxに表示するサンプルです。

C#
private void buttonOpen_Click(object sender, EventArgs e)
{
using (OpenFileDialog dialog = new OpenFileDialog())
{
dialog.Title = "画像ファイルを選択してください";
dialog.Filter = "画像ファイル|*.jpg;*.jpeg;*.png;*.bmp;*.gif|すべてのファイル|*.*";

if (dialog.ShowDialog() == DialogResult.OK)
{
Image oldImage = pictureBox1.Image;

pictureBox1.Image = Image.FromFile(dialog.FileName);
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

oldImage?.Dispose();
}
}
}

このコードで、選択した画像をPictureBoxに表示できます。ただし、Image.FromFileを使っているため、読み込んだ画像ファイルはImageが破棄されるまでロックされます。

5-4. 画像を読み込めないときのエラー処理

画像ファイルが壊れている、対応していない形式である、パスが存在しないなどの場合は例外が発生します。安全に処理するにはtry-catchを使います。

C#
try
{
pictureBox1.Image = Image.FromFile(filePath);
}
catch (Exception ex)
{
MessageBox.Show("画像を読み込めませんでした。\n" + ex.Message);
}

Image.FromFileでは、ファイルが存在しない場合や有効な画像形式でない場合に例外が発生する可能性があります。

5-5. 画像ファイルのパスを取得して再利用する方法

選択した画像ファイルのパスは、変数に保存しておくと再利用できます。

C#
private string currentImagePath = "";

private void buttonOpen_Click(object sender, EventArgs e)
{
using (OpenFileDialog dialog = new OpenFileDialog())
{
dialog.Filter = "画像ファイル|*.jpg;*.jpeg;*.png;*.bmp;*.gif";

if (dialog.ShowDialog() == DialogResult.OK)
{
currentImagePath = dialog.FileName;
pictureBox1.Image = Image.FromFile(currentImagePath);
}
}
}

後で同じ画像を再読み込みしたい場合や、画像パスを設定ファイルに保存したい場合に便利です。

6. URLや外部画像をPictureBoxに読み込む方法

6-1. ImageLocationプロパティを使う方法

PictureBoxには、画像のパスまたはURLを指定できるImageLocationプロパティがあります。Microsoft Learnでも、ImageLocationはPictureBoxに表示する画像のパスまたはURLを取得・設定するプロパティと説明されています。

C#
pictureBox1.ImageLocation = "https://example.com/sample.png";
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

ローカルファイルだけでなくWeb上の画像を指定できるため、簡単な画像取得には便利です。

6-2. Loadメソッドで画像を読み込む方法

Loadメソッドを使うと、指定したパスまたはURLから画像を同期的に読み込めます。

C#
pictureBox1.Load("https://example.com/sample.jpg");

同期読み込みでは、画像の取得が終わるまで画面操作が止まったように見えることがあります。大きな画像やネットワーク上の画像では、次のLoadAsyncを検討しましょう。

6-3. LoadAsyncで非同期に画像を読み込む方法

LoadAsyncを使うと、画像を非同期に読み込めます。

C#
pictureBox1.WaitOnLoad = false;
pictureBox1.LoadAsync("https://example.com/sample.jpg");

LoadAsyncでは、WaitOnLoadfalseに設定することで非同期読み込みを行い、読み込み状況はLoadProgressChanged、完了はLoadCompletedで扱えます。

6-4. 読み込み中の画像・エラー時の画像を設定する

画像読み込み中に表示する画像は、InitialImageで設定できます。InitialImageは、メイン画像の読み込み時にPictureBoxに表示される画像です。

C#
pictureBox1.InitialImage = Properties.Resources.loading;
pictureBox1.ErrorImage = Properties.Resources.error;
pictureBox1.WaitOnLoad = false;
pictureBox1.LoadAsync("https://example.com/sample.jpg");

Web画像を表示する場合は、通信失敗やURL間違いに備えてErrorImageも設定しておくと親切です。

6-5. Web画像を表示するときの注意点

Web画像を扱うときは、次の点に注意します。

注意点内容
URLの有効性画像URLが直接画像を返すか確認する
通信エラーネットワーク切断や404に備える
表示速度大きな画像は読み込みに時間がかかる
著作権外部画像を無断使用しない
UI停止同期読み込みでは画面が固まることがある

読み込み完了を検知したい場合はLoadCompletedイベントを使います。このイベントは、非同期の画像読み込みが完了、取り消し、または例外発生したときに発生します。

7. PictureBoxの画像をクリア・削除・解放する方法

7-1. PictureBox.Imageをnullにして画像を消す

PictureBoxの画像を消すだけなら、Imagenullを代入します。

C#
pictureBox1.Image = null;

これで画面上の画像は消えます。ただし、古い画像オブジェクトがすぐに解放されるとは限らないため、画像を頻繁に差し替えるアプリではDisposeも行いましょう。

7-2. Disposeで画像リソースを解放する

古い画像を解放する基本コードは次の通りです。

C#
Image oldImage = pictureBox1.Image;
pictureBox1.Image = null;
oldImage?.Dispose();

Disposeを呼ぶことで、画像が使用しているリソースを解放できます。特に大きな画像を扱う場合や、何度も画像を読み込む場合は重要です。

7-3. Image.FromFile使用時にファイルがロックされる原因

Image.FromFileで読み込んだ画像ファイルは、そのImageが破棄されるまでロックされます。Microsoft Learnにも、ファイルはImageが破棄されるまでロックされたままになると明記されています。

そのため、次のような問題が起きることがあります。

問題原因
画像ファイルを削除できないPictureBoxが画像を保持している
同じファイルを上書き保存できないImage.FromFileでロックされている
差し替え後もファイルが使用中になる古いImageをDisposeしていない

7-4. ファイルロックを防ぐ安全な読み込み方

ファイルロックを避けたい場合は、ファイルを一度ストリームで読み込み、Bitmapとしてコピーします。

C#
private Image LoadImageWithoutLock(string path)
{
using (var stream = new System.IO.FileStream(path, System.IO.FileMode.Open, System.IO.FileAccess.Read))
using (var temp = Image.FromStream(stream))
{
return new Bitmap(temp);
}
}

Image.FromStreamはImageの存続中にストリームを開いておく必要があるため、すぐに閉じたい場合はnew Bitmap(temp)でコピーを作るのがポイントです。

使う側は次のように書きます。

C#
private void SetPicture(string path)
{
Image oldImage = pictureBox1.Image;

pictureBox1.Image = LoadImageWithoutLock(path);
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

oldImage?.Dispose();
}

7-5. メモリリークを防ぐ画像差し替えの書き方

画像を何度も切り替える場合は、古いImageを必ず解放します。

C#
private void ReplaceImage(Image newImage)
{
Image oldImage = pictureBox1.Image;

pictureBox1.Image = newImage;
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

oldImage?.Dispose();
}

このように、差し替え前の画像を変数に退避し、新しい画像を設定してから古い画像をDisposeすると安全です。

8. PictureBoxでよく使うイベントと実装例

8-1. Clickイベントで画像クリック処理を行う

画像がクリックされたときに処理を行うには、Clickイベントを使います。

C#
private void pictureBox1_Click(object sender, EventArgs e)
{
MessageBox.Show("画像がクリックされました");
}

画像ビューアで拡大表示したり、サムネイルをクリックして詳細画像を表示したりする場合に便利です。

8-2. MouseMoveイベントでマウス座標を取得する

PictureBox上のマウス座標を取得するには、MouseMoveイベントを使います。

C#
private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
{
label1.Text = $"X: {e.X}, Y: {e.Y}";
}

画像上の座標を表示したい場合や、画像編集ツールのような処理を作る場合に使えます。

8-3. Paintイベントで画像の上に文字や図形を描画する

PictureBox上に文字や図形を重ねたい場合は、Paintイベントを使います。

C#
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
e.Graphics.DrawString(
"Sample",
new Font("Arial", 20),
Brushes.Red,
new PointF(10, 10)
);

e.Graphics.DrawRectangle(
Pens.Blue,
new Rectangle(50, 50, 100, 80)
);
}

画像認識結果の枠表示、注釈テキスト、選択範囲の描画などに使えます。

8-4. SizeChangedイベントでリサイズ時の処理を行う

PictureBoxのサイズが変わったときに処理したい場合は、SizeChangedイベントを使います。

C#
private void pictureBox1_SizeChanged(object sender, EventArgs e)
{
pictureBox1.Invalidate();
}

Invalidateを呼ぶと再描画されるため、Paintイベントで描画している図形や文字を更新したいときに便利です。

8-5. LoadCompletedイベントで読み込み完了を検知する

LoadAsyncで画像を読み込んだ場合、読み込み完了はLoadCompletedで検知できます。

C#
private void pictureBox1_LoadCompleted(object sender, System.ComponentModel.AsyncCompletedEventArgs e)
{
if (e.Error != null)
{
MessageBox.Show("画像の読み込みに失敗しました: " + e.Error.Message);
return;
}

if (e.Cancelled)
{
MessageBox.Show("画像の読み込みがキャンセルされました");
return;
}

MessageBox.Show("画像の読み込みが完了しました");
}

LoadCompletedでは、エラーやキャンセル情報も確認できます。非同期読み込み時の例外はイベント引数のErrorプロパティで扱えます。

9. PictureBoxでよくあるエラーと解決策

9-1. 画像が表示されないときの確認ポイント

画像が表示されない場合は、次の点を確認します。

確認項目内容
パスファイルパスが正しいか
拡張子対応している画像形式か
ファイル存在実際にファイルが存在するか
SizeMode画像が切れて見えていないか
PictureBoxサイズ幅・高さが0になっていないか
例外try-catchでエラー内容を確認したか

まずはFile.Existsでパスを確認すると原因を絞り込みやすくなります。

C#
if (!System.IO.File.Exists(path))
{
MessageBox.Show("ファイルが見つかりません");
return;
}

9-2. パスが正しいのに画像を読み込めない場合

パスが正しいのに読み込めない場合は、画像ファイルが壊れている、形式が対応していない、拡張子と中身が一致していない可能性があります。

C#
try
{
pictureBox1.Image = Image.FromFile(path);
}
catch (OutOfMemoryException)
{
MessageBox.Show("有効な画像形式ではない可能性があります");
}
catch (Exception ex)
{
MessageBox.Show(ex.Message);
}

Image.FromFileでは、有効な画像形式でない場合やGDI+がピクセル形式をサポートしていない場合にOutOfMemoryExceptionが発生することがあります。

9-3. サイズが合わず画像が切れる場合

画像が切れる場合は、SizeModeNormalまたはCenterImageになっている可能性があります。画像全体を表示したい場合はZoomに変更しましょう。

C#
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

Normalは左上に配置され、大きい画像はクリップされます。CenterImageも大きい画像では外側が切れるため、全体表示にはZoomが適しています。

9-4. 画像が粗く見える・ぼやける場合

画像がぼやける場合は、画像の解像度が低い、StretchImageで無理に引き伸ばしている、元画像と表示サイズの差が大きいなどが原因です。

対策は次の通りです。

原因対策
小さい画像を拡大している高解像度画像を使う
StretchImageで歪んでいるZoomに変更する
サムネイルを拡大している元画像を読み込む
描画品質が低いPaintイベントで補間モードを設定する

Paintイベントで独自描画する場合は、InterpolationModeを設定すると縮小・拡大時の品質を調整できます。

9-5. 使用中のファイルとして削除できない場合

画像ファイルを削除しようとして「使用中」と表示される場合は、Image.FromFileで読み込んだImageがまだ生きています。

C#
Image oldImage = pictureBox1.Image;
pictureBox1.Image = null;
oldImage?.Dispose();

ファイルロックを根本的に避けたい場合は、FileStreamnew Bitmap(temp)を使って画像をコピーしてから表示する方法を使いましょう。

9-6. 大きな画像でアプリが重くなる場合

高解像度の画像をそのまま大量に読み込むと、メモリ使用量が増えてアプリが重くなります。

対策としては、次のような方法があります。

対策内容
サムネイルを作る一覧表示では小さい画像を使う
不要画像をDispose差し替え時に古い画像を解放する
非同期読み込みWeb画像や大きな画像ではLoadAsyncを使う
読み込み数を制限画面に見える分だけ読み込む
キャッシュ管理必要な画像だけ保持する

画像ビューアやサムネイル一覧を作る場合は、表示用の縮小画像と元画像を分けて管理すると効率的です。

10. 初心者向けPictureBoxサンプルコード集

10-1. 画像を表示する最小コード

C#
pictureBox1.Image = Image.FromFile(@"C:\Images\sample.jpg");
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

まずはこの2行を覚えれば、C# PictureBoxで画像表示ができます。

10-2. ボタンクリックで画像を読み込むコード

C#
private void button1_Click(object sender, EventArgs e)
{
using (OpenFileDialog dialog = new OpenFileDialog())
{
dialog.Filter = "画像ファイル|*.jpg;*.jpeg;*.png;*.bmp;*.gif";

if (dialog.ShowDialog() == DialogResult.OK)
{
Image oldImage = pictureBox1.Image;
pictureBox1.Image = Image.FromFile(dialog.FileName);
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;
oldImage?.Dispose();
}
}
}

画像選択機能を作りたい場合の基本形です。

10-3. 画像をZoom表示するコード

C#
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

画像全体を表示したい場合は、基本的にZoomを使います。

10-4. 画像をクリアするコード

C#
private void buttonClear_Click(object sender, EventArgs e)
{
Image oldImage = pictureBox1.Image;
pictureBox1.Image = null;
oldImage?.Dispose();
}

表示を消すだけでなく、古い画像リソースも解放します。

10-5. 複数画像を切り替えて表示するコード

C#
private string[] imagePaths =
{
@"C:\Images\image1.jpg",
@"C:\Images\image2.jpg",
@"C:\Images\image3.jpg"
};

private int currentIndex = 0;

private void buttonNext_Click(object sender, EventArgs e)
{
currentIndex++;

if (currentIndex >= imagePaths.Length)
{
currentIndex = 0;
}

Image oldImage = pictureBox1.Image;
pictureBox1.Image = Image.FromFile(imagePaths[currentIndex]);
pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;
oldImage?.Dispose();
}

簡単な画像ビューアを作るときの基本になります。

11. PictureBoxを使うときの実践的なコツ

11-1. 画像ビューアを作る場合の基本設計

画像ビューアを作る場合は、次のように役割を分けると作りやすくなります。

部品役割
PictureBox現在の画像を表示する
Button前へ・次へ・開く・削除など
Labelファイル名や画像サイズを表示する
ListBox画像一覧を表示する
Panelスクロールや配置調整に使う

PictureBoxは表示専用、画像のパスや一覧管理は別の変数やコレクションで行うと、コードが整理しやすくなります。

11-2. サムネイル表示にPictureBoxを使う方法

複数のPictureBoxを配置すれば、サムネイル一覧を作れます。

C#
PictureBox thumb = new PictureBox();
thumb.Size = new Size(120, 90);
thumb.SizeMode = PictureBoxSizeMode.Zoom;
thumb.Image = Image.FromFile(path);
thumb.BorderStyle = BorderStyle.FixedSingle;
thumb.Click += Thumb_Click;

flowLayoutPanel1.Controls.Add(thumb);

サムネイルをたくさん表示する場合は、元画像をそのまま読み込むと重くなるため、縮小画像を作って表示するのがおすすめです。

11-3. Panelと組み合わせてスクロール表示する方法

大きな画像をスクロール表示したい場合は、Panelの中にPictureBoxを配置します。

C#
panel1.AutoScroll = true;

pictureBox1.SizeMode = PictureBoxSizeMode.AutoSize;
pictureBox1.Image = Image.FromFile(@"C:\Images\large.jpg");

panel1.Controls.Add(pictureBox1);

AutoSizeを使うとPictureBoxが画像サイズに合わせて大きくなります。PanelのAutoScrollを有効にすれば、大きな画像をスクロールして確認できます。

11-4. 画像編集や描画処理ではBitmapとの使い分けが重要

PictureBoxは表示用のコントロールです。画像を加工したい場合は、BitmapやGraphicsを使って画像データ側を編集します。

C#
Bitmap bmp = new Bitmap(300, 200);

using (Graphics g = Graphics.FromImage(bmp))
{
g.Clear(Color.White);
g.DrawString("Hello", new Font("Arial", 24), Brushes.Black, 10, 10);
}

pictureBox1.Image = bmp;

このように、Bitmapに描画した結果をPictureBoxに表示すると、画像生成や編集処理を分かりやすく実装できます。

11-5. PictureBoxで対応しにくい処理と代替方法

PictureBoxは便利ですが、すべての画像処理に向いているわけではありません。

やりたいことPictureBoxでの向き不向き代替
単純な画像表示向いているPictureBox
サムネイル表示小規模なら向いているFlowLayoutPanel併用
高速な大量画像表示不向き仮想化リスト、独自描画
本格的な画像編集表示だけなら可Bitmap、Graphics
クロスプラットフォームUIWinForms限定WPF、MAUI、Avaloniaなど

また、.NET 6以降のSystem.Drawing.CommonはWindowsのみサポートされる点にも注意が必要です。Windowsフォームアプリで使う分には自然ですが、クロスプラットフォームの画像処理アプリでは別ライブラリも検討しましょう。

12. C# PictureBoxに関するよくある質問

12-1. PictureBoxに複数の画像を表示できる?

PictureBoxのImageプロパティに設定できる画像は基本的に1つです。複数画像を表示したい場合は、次の方法があります。

方法内容
複数のPictureBoxを使うサムネイル一覧向け
1枚のBitmapに合成する複数画像をまとめて表示
Paintイベントで描画する画像や図形を重ねる

複数のPictureBoxで同じImageを使う場合は、それぞれに画像の複製を作る必要があります。同じイメージへ複数コントロールからアクセスすると例外が発生する可能性があるためです。

12-2. PictureBoxの画像を保存できる?

PictureBoxに表示している画像は、Image.Saveで保存できます。

C#
pictureBox1.Image.Save(@"C:\Images\saved.png", System.Drawing.Imaging.ImageFormat.Png);

ただし、pictureBox1.Imagenullの場合は保存できないため、事前に確認します。

C#
if (pictureBox1.Image != null)
{
pictureBox1.Image.Save(@"C:\Images\saved.png");
}

12-3. PictureBoxの背景色を透明にできる?

BackColorColor.Transparentを設定できます。

C#
pictureBox1.BackColor = Color.Transparent;

ただし、Windowsフォームの透明表現は完全な画像編集ソフトのレイヤー透明とは異なります。親コントロールの背景が見えるような動作になるため、複雑な重ね合わせでは期待通りに表示されないことがあります。

12-4. PictureBoxでGIFアニメーションは表示できる?

PictureBoxはGIF画像を表示できます。アニメーションGIFも表示できる場合がありますが、画像の読み込み方法や環境によって期待通りに動かないケースもあります。単純なGIF表示ならPictureBoxで十分ですが、細かい再生制御をしたい場合は別の方法を検討しましょう。

12-5. PictureBoxとWPFのImageコントロールの違いは?

PictureBoxはWindowsフォーム用の画像表示コントロールです。一方、WPFでは主にImageコントロールを使います。

項目PictureBoxWPF Image
対象Windows FormsWPF
表示方法SizeModeStretch
描画モデルGDI+系WPFの描画システム
初心者向けWinFormsでは扱いやすいXAMLに慣れが必要
UI表現シンプル柔軟なレイアウトや効果

WinFormsアプリならPictureBox、WPFアプリならImageコントロールを使うのが基本です。

まとめ

C# PictureBoxは、Windowsフォームアプリで画像を表示するための基本コントロールです。画像を表示するだけなら、pictureBox1.Image = Image.FromFile(path);で簡単に実装できます。画像のサイズ調整にはSizeModeを使い、初心者には縦横比を保って表示できるZoomがおすすめです。

ファイル選択から画像を読み込む場合はOpenFileDialog、URL画像を読み込む場合はImageLocationLoadAsyncを使います。画像を差し替えるときは、古いImageをDisposeしてメモリリークを防ぎましょう。特にImage.FromFileはImageが破棄されるまでファイルをロックするため、削除や上書きが必要なアプリでは、ストリームから読み込んでBitmapにコピーする方法が安全です。

まずは「PictureBoxを配置する」「Imageに画像を設定する」「SizeModeをZoomにする」「不要な画像をDisposeする」という4点を押さえれば、C# PictureBoxの基本は十分に使いこなせます。