Softrime Lab

学習記事一覧 · ファイル

【学習】WinForms PictureBoxで画像を表示する方法まとめ（C#サンプル付き）

WinFormsアプリでは、画像を表示するために PictureBox を使います。この記事では、C#のWinFormsでPictureBoxに画像を表示する方法を、サンプルコード付きで解説します。

解説する内容

  • 設計時に画像を設定する（最も簡単）
  • ローカルリソースとプロジェクトリソースの違い
  • 実行時に画像を読み込む（Image.FromFile）
  • ユーザーに画像を選ばせる（OpenFileDialog）
  • Image と ImageLocation の違い
  • 画像が表示されないときのチェックポイント

前提

この記事のサンプルは、CardArraySample ソリューション下に適切な名前のプロジェクト（例：ImageViewer、PictureBoxDemo など）を作成して試してください。既存の CardArraySample ソリューションを開き、ソリューションエクスプローラーで 追加 → 新しいプロジェクト から Windows Forms アプリを追加します。

PictureBoxに画像を表示する3つの基本方法

PictureBoxにはいくつかの画像設定方法がありますが、実際のアプリでよく使う方法は次の3つです。

  1. 設計時に画像を設定する
  2. 実行時に画像を読み込む
  3. ユーザーに画像を選択させる

この3つを理解しておけば、ほとんどのアプリで対応できます。

方法1 設計時に画像を設定する（最も簡単）

最も簡単なのは、デザイン画面で画像を設定する方法です。

手順

  1. PictureBoxをフォームに配置する
  2. プロパティウィンドウを開く
  3. Image プロパティを探す
  4. 右側の ... ボタンをクリック
  5. 画像ファイルを選択

ローカルリソースとプロジェクトリソースの違い

Image プロパティの ... ボタンを押すと「リソースの選択」ダイアログが開きます。ここには2つの選択肢があります。

種類 保存先 スコープ 用途
ローカルリソース Form1.resx などフォーム専用 そのフォーム内のみ そのフォームだけで使う画像
プロジェクトリソース Properties\Resources.resx プロジェクト全体 複数フォームで共有する画像、ロゴ、アイコン
  • ローカルリソース: そのフォーム専用。他のフォームからは参照できない
  • プロジェクトリソース: 複数のフォームやコントロールから参照可能。コードから Properties.Resources.リソース名 でアクセスできる
// プロジェクトリソースの場合、コードからも参照可能
pictureBox1.Image = Properties.Resources.画像名;

どちらを使うか迷ったら、そのフォームだけで使うならローカル、複数で共有するならプロジェクトを選ぶとよいです。

どちらもビルド時に EXE に埋め込まれるため、画像ファイルを別途配布する必要はありません。

表示サイズの調整

画像サイズを自動調整したい場合は、次を設定します。

SizeMode = Zoom

主な設定値

設定 説明
Normal 元のサイズ
StretchImage PictureBoxサイズに引き伸ばす
Zoom 縦横比を保ったまま拡大縮小
CenterImage 中央表示

授業では Zoom を使うことが多いです。

方法2 実行時に画像を読み込む

プログラム実行中に画像を変更する場合は、Image.FromFile() を使います。

サンプル

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

このコードは

  1. ファイルから画像を読み込む
  2. PictureBoxに表示する

という処理になります。

ボタンで画像を変更する例

private void button1_Click(object sender, EventArgs e)
{
    pictureBox1.Image = Image.FromFile(@"C:\Images\dog.jpg");
}

ボタンを押すと画像が切り替わります。

方法3 ユーザーに画像を選ばせる

アプリによっては、ユーザーが画像を選択する場合があります。その場合は OpenFileDialog を使います。

サンプル

using (OpenFileDialog dialog = new OpenFileDialog())
{
    dialog.Filter = "画像ファイル|*.jpg;*.jpeg;*.png;*.bmp|すべてのファイル|*.*";
    if (dialog.ShowDialog() == DialogResult.OK)
    {
        pictureBox1.Image?.Dispose();
        pictureBox1.Image = Image.FromFile(dialog.FileName);
    }
}

処理の流れ

ファイル選択ダイアログを開く
        ↓
ユーザーが画像を選択
        ↓
選択された画像を表示

画像ビューアなどのアプリでよく使う方法です。

Image と ImageLocation の違い

PictureBoxには似たプロパティがあります。

プロパティ 用途
Image Imageオブジェクトを直接設定
ImageLocation 画像ファイルの場所を指定

例

pictureBox1.ImageLocation = @"C:\Images\cat.jpg";

実務では Image + Image.FromFile() を使うことが多いです。

画像が表示されないときのチェックポイント

PictureBoxを使うと、初心者の方は「画像が表示されない」という問題によく遭遇します。次のポイントを確認してみてください。

1. 画像ファイルのパスが間違っている

最も多い原因です。

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

この場合、C:\Images と cat.jpg が実際に存在している必要があります。フォルダやファイル名が違うと表示されません。

2. ファイルがプロジェクトフォルダにない

相対パスを使う場合、画像がプロジェクトフォルダ内にあるかを確認してください。

プロジェクト
 ├ images
 │   └ cat.jpg
 └ Program.cs

この場合

pictureBox1.Image = Image.FromFile(@"images\cat.jpg");

と書きます。

3. PictureBoxのサイズが小さい

PictureBoxが小さいと、画像が見えない場合があります。この場合は SizeMode を設定します。

pictureBox1.SizeMode = PictureBoxSizeMode.Zoom;

これで画像が自動的に調整されます。

4. 画像ファイルがロックされる問題

Image.FromFile() はファイルをロックするという特徴があります。つまり、プログラム実行中は画像を編集できない状態になることがあります。

実務では次の方法を使うこともあります。

pictureBox1.Image = new Bitmap(@"C:\Images\cat.jpg");

こうするとファイルロックを避けられます。

5. よくある学習時のミス

授業でよくあるのは次のパターンです。

  • 画像の場所を間違える
  • 拡張子を間違える（png / jpg）
  • PictureBoxが小さい
  • Imageプロパティを設定していない

プログラムの問題ではなく、設定の問題であることが多いです。

まとめ

PictureBoxの画像表示は次の3つを覚えれば十分です。

方法 用途
設計時に設定 固定画像
Image.FromFile 実行時読み込み
OpenFileDialog ユーザー選択

まずは Image.FromFile() を理解することが重要です。

トラブルの多くは次の3つです。

  1. 画像パスが間違っている
  2. PictureBoxサイズの問題
  3. ファイルの場所が違う

まずはこの3つを確認してみましょう。

関連記事