【学習】WinFormsでPictureBoxに画像を設計時に登録する — いちばんシンプルなチュートリアル
このチュートリアルでは、コードを書かずに、フォーム上の PictureBox に画像を表示します。プロパティの設定だけで、設計時に画像を登録できます。
このチュートリアルでやること
- Windows フォーム アプリを作る
- PictureBox をフォームに置く
- プロパティ画面から画像を設定する
- 実行して表示を確認する
1. プロジェクトを作る
Visual Studio で次を作成します。
- テンプレート: Windows Forms アプリ (.NET Framework)
- ソリューション名: PictureBoxImageSample
- プロジェクト名: PictureBoxImageSample
作成します。
2. フォームを確認する
作成すると、白い画面が表示されます。
- Form1
この白い画面が、アプリの画面です。
3. PictureBox を配置する
画面左の ツールボックス から
- PictureBox
を探して、フォームにドラッグ＆ドロップします。
フォーム上に四角い枠が置かれます。PictureBox は画像を表示するためのコントロールです。
4. PictureBox の大きさを調整する
フォームに置いた pictureBox1 をクリックします。
そのままマウスで広げて、見やすいサイズにします。
例：
- 横 300
- 縦 200
くらいでも大丈夫です。
5. 画像を登録する
pictureBox1 を選択した状態で、右下の プロパティ を見ます。
設定する項目は Image です。Image の右側にある … ボタンを押します。
すると画像選択の画面が出ます。
手順は次のとおりです。
- ローカル リソース などの画面が出る
- インポート を押す
- 使いたい画像ファイルを選ぶ
- OK を押す
これで、PictureBox に画像が表示されます。
6. 画像の表示方法を調整する
画像が切れたり、はみ出したりすることがあります。その場合は、SizeMode を変更します。
おすすめの設定は SizeMode → Zoom です。
これで、画像の縦横比を保ちながら、PictureBox の中に収まるように表示されます。
7. 実行する
F5 キーまたは ▶ 実行ボタン を押します。
フォームが起動し、設定した画像が表示されれば成功です。
8. よく使う設定
PictureBox で最初によく触るのは次の項目です。
| 項目 | 説明 |
|---|---|
| Name | 例：pictureBoxMain |
| Image | 表示する画像を設定する項目です |
| SizeMode | 表示方法を決めます（下記参照） |
| BorderStyle | 枠線を付けたいなら FixedSingle などにすると見やすくなります |
SizeMode の主な値は次のとおりです。
| 値 | 説明 |
|---|---|
| Normal | 元の大きさで表示 |
| StretchImage | PictureBox の大きさに無理やり引き伸ばす |
| Zoom | 縦横比を保って表示 |
最初は Zoom が使いやすいです。
9. 完成イメージ
フォームを起動すると、
- フォームの中に
- PictureBox があり
- その中に画像が表示される
という状態になれば完成です。
まとめ
今回の目的は、「PictureBox に画像を表示する」をまず体験することです。コードは不要で、次の流れに慣れるのが大切です。
- WinForms プロジェクトを作る
- PictureBox を置く
- Image プロパティで画像を登録する
- SizeMode を Zoom にする
- 実行して確認する
次にやると良いこと
次の一歩としては、こういう順番が自然です。
- ボタンを押したら画像を変える
- 複数の PictureBox を置く
- クリックしたら何か処理する
ファイル操作と組み合わせる流れで学びたい場合は、設計時に画像を登録する（03） → OpenFileDialog で画像を開く（04） のチュートリアルに進んでください。FileSample ソリューション内で画像ビューアを完成させる流れです。