どうも!リョクちゃです。
読者の皆さんはWindowsアプリケーションで、
パソコンに保存した画像を表示したくなる時はありませんか?
アプリケーションによっては、必要なときに画像を
表示したいといったときがあるのではないでしょうか?
そんな悩みを抱いている皆さんに向けて、
今回はPicturaBoxと呼ばれるコントロールを使って簡単に
自身のパソコンに保存されている写真=画像を表示する方法を紹介していきます。
ちなみに前回はこちら、
目次
準備編:フォームの作成
今回は以下のフォームを作成していきます。
メイン画面
No | コントロール | 名称 |
---|---|---|
1 | PictureBox | PictureBox1 |
2 | Label | Label1 |
3 | Label | Label2 |
4 | Button | Button1 |
実行環境
筆者の実行環境は、
- VisualStudio2019
- Windows 10 64bit
- .Net Framework 4.5.1
になります。
※ Windows7 8 8.1でも動作はできますが、画面デザインの表示が変わるかもしれません。
アプリケーションの目的
Button1を押すことで、PicturaBox1に表示したい画像のファイルを選択する
ダイアログが開き、選択した画像をPictureBox1に表示をするとともに表示した
画像の名前をLabel2に表示することができることを目的とする。
プログラム編
PictureBoxに画像を表示するには、
の2パターンが一般的にはあります。
今回は、前者のPictureBox.Imageを使用していきます。
表示する前にあらかじめPictureBoxに表示される画像は全体を表示するようにしたいので、
以下の設定を行います。
PictureBoxSizeModeには以下の種類があります。
今回は、Zoomを使用していきます。
No | Mode | 内容 |
---|---|---|
1 | Normal | 左上隅に配置されます。 |
2 | StretchImage | PictureBoxのサイズに合うように調整されます。 |
3 | AutoSize | 格納している画像ファイルと同じ大きさになります。(画素に依存) |
4 | CenterImage | PictureBoxが画像ファイルより大きい場合、画像は中央に表示されます。 |
5 | Zoom | 画像はサイズ比率を維持したままで拡大または縮小されます。 |
ファイルダイアログについては、こちらの記事で紹介しているのでご参考ください。
これらを踏まえて、コードを書いていったのが以下になります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
Public Class TestPictureBox Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click Dim ofd As New OpenFileDialog ' 各パラメータを設定していきます ' 最初に表示されるデフォルトのファイル名を設定 ofd.FileName = "default.JPG" ' 最初に表示されるデフォルトのフォルダ名を設定 ofd.InitialDirectory = "C:/" ' 読込むファイルの種類を設定 ofd.Filter = ".JPG" & "|" & "*.JPG" ' ファイルダイアログのタイトルを設定 ofd.Title = "読込みたい画像ファイルを選択してください。" ' ファイルダイアログを閉じる前に現在のフォルダを復元するかしないか ofd.RestoreDirectory = True ' ファイルダイアログを開く ' 読込みたいファイルを選択し、OKボタンが押されたら If ofd.ShowDialog() = DialogResult.OK Then ' Label2に選択された画像ファイル名を表示 Me.Label2.Text = System.IO.Path.GetFileName(ofd.FileName) ' PicturaBox1に表示される画像サイズを変更 → Zoom PictureBox1.SizeMode = PictureBoxSizeMode.Zoom ' PictureBox1に選択された画像ファイルを表示 ' PictureBox1.ImageLocation = ofd.FileName PictureBox1.Image = System.Drawing.Image.FromFile(ofd.FileName) End If End Sub End Class |
実行編
それでは実行し確認していきます。
画面起動時
ボタンを押し、ファイルダイアログが開くので
表示する画像を選択し、開くボタンを押します。
※今回は筆者が学生時代に作成したロボットの写真を使っています。
表示がされました……がしかし、横向きで表示されてしまいました。
本来であれば縦向きで表示されてほしかったのですが。。。
これを改善するために、表示される画像の向きを変更するコードを新たに加筆していきます。
向きを変更するには、
と書きます。
RotateFlipTypeにも数種類あり、今回は時計回り方向に90°回転させたいので
と設定します。
加筆したコードがこちらになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
Public Class TestPictureBox Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click Dim ofd As New OpenFileDialog ' 各パラメータを設定していきます ' 最初に表示されるデフォルトのファイル名を設定 ofd.FileName = "default.JPG" ' 最初に表示されるデフォルトのフォルダ名を設定 ofd.InitialDirectory = "C:/" ' 読込むファイルの種類を設定 ofd.Filter = ".JPG" & "|" & "*.JPG" ' ファイルダイアログのタイトルを設定 ofd.Title = "読込みたい画像ファイルを選択してください。" ' ファイルダイアログを閉じる前に現在のフォルダを復元するかしないか ofd.RestoreDirectory = True ' ファイルダイアログを開く ' 読込みたいファイルを選択し、OKボタンが押されたら If ofd.ShowDialog() = DialogResult.OK Then ' Label2に選択された画像ファイル名を表示 Me.Label2.Text = System.IO.Path.GetFileName(ofd.FileName) ' PicturaBox1に表示される画像サイズを変更 → Zoom PictureBox1.SizeMode = PictureBoxSizeMode.Zoom ' PictureBox1に選択された画像ファイルを表示 ' PictureBox1.ImageLocation = ofd.FileName PictureBox1.Image = System.Drawing.Image.FromFile(ofd.FileName) ' PictureBox1に表示される画像を回転 PictureBox1.Image.RotateFlip(RotateFlipType.Rotate90FlipNone) End If End Sub End Class |
改めて実行し、先ほどの画像を表示させると、
向きを回転させることができました。
まとめ
今回は簡単にPicturaBoxに自身のパソコンに保存されている画像を
表示する方法について解説しました。
この記事を参考にコードなどを試していただけたらなと嬉しいです。
最後までご覧いただきありがとうございます。
・こちらの書籍を参考にVB.Net勉強しています。