イメージの利用

フォーム上で画像を表示するための使用するイメージの利用方法について解説します。

(2022 年 06 月 17 日公開 / 2022 年 06 月 17 日更新)

イメージを作成する
イメージに表示する画像ファイルを指定する
イメージの外枠を表示するかどうかを設定する
イメージの大きさと表示する画像の大きさが異なる場合にどのように表示するかどうかを設定する
画像の表示位置を設定する
画像を並べて表示する
イメージの背景色を設定する
イメージのイベント処理

イメージを作成する

イメージを作成する方法を見ていきます。イメージを作成するにはツールボックス上で下記のアイコンをクリックします。

イメージを作成する(1)

アイコンをクリックした後でフォーム上でマウスをドラッグしてコマンドボタンを作成します。

イメージを作成する(2)

イメージを作成する(3)

オブジェクト名の設定

VBAから操作するにあたってイメージのオブジェクト名を設定しておきます。イメージのプロパティウィンドウを見てください。

イメージを作成する(4)

オブジェクト名はプロパティウィンドウ上で直接編集が出来ます。今回はオブジェクト名を「flowerImage」に変更します。

イメージを作成する(5)

イメージに表示する画像ファイルを指定する

イメージに表示する画像を設定します。画像ファイルを指定するには「Picture」プロパティを使います。

object.Picture = LoadPicture( pathname )

オブジェクトの上に表示するビットマップを設定します。 object には設定するオブジェクトを指定します。設定する値の pathname にはピクチャファイルの絶対パスを指定します。

LoadPicture関数を使いイメージに表示する画像ファイルをの位置を絶対パスで指定します。使用できる画像フォーマットは、bmp/gif/jpg/wmf/icoなどがあります。

実際の使い方としては次のようになります。

sampleForm.flowerImage.Picture = LoadPicture("c:\tmp\flower.jpg")

サンプルプログラム

では簡単なサンプルで試してみましょう。

Sub テスト()
    Load sampleForm
    sampleForm.flowerImage.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.Show
End Sub

上記マクロを実行すると次のように表示されます。

イメージに表示する画像ファイルを指定する(1)

プロパティウィンドウで値を指定する

「Picture」プロパティについてはプロパティウィンドウで指定が出来ますので、値が決まっている場合は設計の時点で設定をしておくことも可能です。プロパティウィンドウの「Picture」の箇所の右側にある「...」をクリックして下さい。

イメージに表示する画像ファイルを指定する(2)

次のようにファイル選択ダイアログが表示されますので、画像ファイルを選択します。

イメージに表示する画像ファイルを指定する(3)

ファイルが選択されるとプロパティウィンドウには次のように表示されます。

イメージに表示する画像ファイルを指定する(4)

イメージの外枠を表示するかどうかを設定する

イメージの外枠を表示するかどうかを設定します。外枠の設定にはには「BorderStyle」プロパティを使います。

object.BorderStyle = fmBorderStyle

コントロールまたはフォームの境界線のスタイルを設定します。 object には設定するオブジェクトを指定します。設定する値の fmBorderStyle には境界線のスタイルを指定します。

設定可能な値は次の通りです。

定数	値	境界線の状態
fmBorderStyleNone	0	境界線を表示しません
fmBorderStyleSingle	1	実線の境界線を表示します

デフォルトの値は「fmBorderStyleSingle」で実線が表示されます。境界線を表示したくない場合は「fmBorderStyleNone」を指定して下さい。

実際の使い方としては次のようになります。

sampleForm.flowerImage.BorderStyle = fmBorderStyleNone

サンプルプログラム

では簡単なサンプルで試してみましょう。

Sub テスト()
    Load sampleForm
    sampleForm.flowerImage.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.flowerImage.BorderStyle = fmBorderStyleNone
    sampleForm.Show
End Sub

上記マクロを実行すると次のように表示されます。

イメージの外枠を表示するかどうかを設定する(1)

プロパティウィンドウで値を指定する

「BorderStyle」プロパティについてはプロパティウィンドウで指定が出来ますので、値が決まっている場合は設計の時点で設定をしておくことも可能です。プロパティウィンドウの「BorderStyle」の箇所の右側にある下向き矢印をクリックして値を選択して下さい。

イメージの外枠を表示するかどうかを設定する(2)

イメージの大きさと表示する画像の大きさが異なる場合にどのように表示するかどうかを設定する

イメージの大きさと表示する画像の大きさが異なる場合にどのように表示するかどうかを設定します。表示方法の設定にはには「PictureSizeMode」プロパティを使います。

object.PictureSizeMode = fmPictureSizeMode

コントロールの背景に表示するピクチャの表示方法を設定します。 object には設定するオブジェクトを指定します。設定する値の fmPictureSizeMode にはサイズがピクチャのサイズと異なる場合の表示方法を指定します。

設定可能な値は次の通りです。

定数	値	境界線の状態
fmPictureSizeModeClip	0	元の大きさのまま表示します。表示しきれない部分は切り捨てます
fmPictureSizeModeStretch	1	サイズに合わせて、ピクチャを引き伸ばします。この場合、ピクチャは水平方向または垂直方向にゆがむことがあります
fmPictureSizeModeZoom	2	必要に応じてピクチャを引き伸ばしますが、水平方向または垂直方向にピクチャがゆがまないように引き伸ばします

デフォルトの値は「fmPictureSizeModeClip」で画像の大きさを変更せずに表示します。

「fmPictureSizeModeStretch」を設定した場合には、イメージの大きさに合わせて画像の大きさを調整します。縦方向及び横方向いっぱいに引き伸ばしますので、イメージの縦横比率と画像の縦横比率が異なる場合は画像がゆがみます。

「fmPictureSizeModeZoom」を設定した場合も、イメージの大きさに合わせて画像の大きさを調整します。ただし画像の縦横比率が変わらないようにイメージの高さ又は幅のどちらかが同じ大きさになるまで調整して表示します。

実際の使い方としては次のようになります。

sampleForm.flowerImage.PictureSizeMode = fmPictureSizeModeZoom

サンプルプログラム

では簡単なサンプルで試してみましょう。

Sub テスト()
    Load sampleForm
    sampleForm.flowerImage.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.flowerImage2.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.flowerImage2.PictureSizeMode = fmPictureSizeModeStretch
    sampleForm.Show
End Sub

上記マクロを実行すると次のように表示されます。

イメージの大きさと表示する画像の大きさが異なる場合にどのように表示するかどうかを設定する(1)

同じ画像ファイルを使用していますが、右側の画像はイメージの大きさいっぱいに高さ及び幅を拡大して表示しています。

プロパティウィンドウで値を指定する

「PictureSizeMode」プロパティについてはプロパティウィンドウで指定が出来ますので、値が決まっている場合は設計の時点で設定をしておくことも可能です。プロパティウィンドウの「PictureSizeMode」の箇所の右側にある下向き矢印をクリックして値を選択して下さい。

イメージの大きさと表示する画像の大きさが異なる場合にどのように表示するかどうかを設定する(2)

画像の表示位置を設定する

イメージの中で画像を表示する位置を設定します。表示位置の設定には「PictureAlignment」プロパティを使います。

object.PictureAlignment = fmPictureAlignment

背景に表示するピクチャの位置を設定します。 object には設定するオブジェクトを指定します。設定する値の fmPictureAlignment にはピクチャをコントロールのどこに合わせて配置するかを指定します。

設定可能な値は次の通りです。

定数	値	境界線の状態
fmPictureAlignmentTopLeft	0	左上端に合わせて配置します
fmPictureAlignmentTopRight	1	右上端に合わせて配置します
fmPictureAlignmentCenter	2	中央に配置します
fmPictureAlignmentBottomLeft	3	左下端に合わせて配置します
fmPictureAlignmentBottomRight	4	右下端に合わせて配置します

デフォルトの値は「fmPictureAlignmentCenter」でイメージの中央に画像を表示します。縦方向及び横方向を個別には設定できず、中央か四隅のどこかに合わせて配置するしかありません。

実際の使い方としては次のようになります。

sampleForm.flowerImage.PictureAlignment = fmPictureAlignmentCenter

サンプルプログラム

では簡単なサンプルで試してみましょう。

Sub テスト()
    Load sampleForm
    sampleForm.flowerImage.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.flowerImage.PictureAlignment = fmPictureAlignmentBottomLeft
    sampleForm.flowerImage2.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.flowerImage2.PictureAlignment = fmPictureAlignmentTopRight
    sampleForm.Show
End Sub

上記マクロを実行すると次のように表示されます。

画像の表示位置を設定する(1)

プロパティウィンドウで値を指定する

「PictureAlignment」プロパティについてはプロパティウィンドウで指定が出来ますので、値が決まっている場合は設計の時点で設定をしておくことも可能です。プロパティウィンドウの「PictureAlignment」の箇所の右側にある下向き矢印をクリックして値を選択して下さい。

画像の表示位置を設定する(2)

画像を並べて表示する

イメージの中で画像を並べて表示するように設定します。並べて表示するには「PictureTiling」プロパティを使います。

object.PictureTiling = Boolean

ピクチャを並べて表示するかどうかを設定します。 object には設定するオブジェクトを指定します。設定する値の Boolean にはピクチャを背景全体に並べて表示するかどうかを指定します。

「True」を設定した場合、イメージ全体に画像を並べて表示します。「False」を設定した場合には画像はイメージの中に1つだけ表示されます。デフォルトの値は「False」です。

並べて表示する場合にどの位置から画像が並べられていくかは「PictureAlignment」プロパティの値によります。

実際の使い方としては次のようになります。

sampleForm.flowerImage.PictureTiling = False

サンプルプログラム

では簡単なサンプルで試してみましょう。

Sub テスト()
    Load sampleForm
    sampleForm.flowerImage.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.flowerImage.PictureAlignment = fmPictureAlignmentBottomLeft
    sampleForm.flowerImage.PictureTiling = True
    sampleForm.Show
End Sub

上記マクロを実行すると次のように表示されます。

画像を並べて表示する(1)

プロパティウィンドウで値を指定する

「PictureTiling」プロパティについてはプロパティウィンドウで指定が出来ますので、値が決まっている場合は設計の時点で設定をしておくことも可能です。プロパティウィンドウの「PictureTiling」の箇所の右側にある下向き矢印をクリックして値を選択して下さい。

画像を並べて表示する(2)

イメージの背景色を設定する

イメージの背景色を設定します。背景色の設定には「BackColor」プロパティを使います。

object.BackColor = Long

オブジェクトの背景色を設定します。 object には対象となるオブジェクトを指定します。設定する値の Long にはオブジェクトの背景色を表す値または定数を指定します。

色を指定するためのLong型の値には数値の変わりにRGB関数を使って色を指定できます。(RGB関数については「RGB関数」を参照して下さい。

背景色の場合は背景が非透明になっている必要があります。デフォルトで非透明になっているので特に設定は必要ありませんが明示的に指定する場合には「BackStyle」プロパティを設定します。

object.BackStyle = fmBackStyle

オブジェクトの背景のスタイルを設定します。 object には対象となるオブジェクトを指定します。設定する値の fmBackStyle にはコントロールの背景スタイルを指定します。

指定できる値は次のどちらかです。

定数	値	背景スタイル
fmBackStyleTransparent	0	背景を透明にします
fmBackStyleOpaque	1	背景を不透明にします

使い方としては次のようになります。

sampleForm.flowerImage.BackColor = RGB(255, 0, 0)
sampleForm.flowerImage.BackStyle = fmBackStyleOpaque

サンプルプログラム

では簡単なサンプルで試してみましょう。

Sub テスト()
    Load sampleForm
    sampleForm.flowerImage.Picture = LoadPicture("c:¥tmp¥flower.jpg")
    sampleForm.flowerImage.BackColor = RGB(255, 0, 0)
    sampleForm.flowerImage.BackStyle = fmBackStyleOpaque
    sampleForm.Show
End Sub

上記マクロを実行すると次のように表示されます。

イメージの背景色を設定する(1)

プロパティウィンドウで値を指定する

「BackColor」プロパティについてはプロパティウィンドウで指定が出来ますので、値が決まっている場合は設計の時点で設定をしておくことも可能です。プロパティウィンドウの「BackColor」の箇所の右側にある下向き矢印をクリックして下さい。カラーパレットが表示されますので背景色に設定したい色を選択します。

イメージの背景色を設定する(2)

イメージのイベント処理

イメージで用意されているイベントは以下の通りです。

イベント	発生条件
Click	マウスでクリック
DblClick	マウスで2 回クリック
MouseDown	マウスボタンを押す
MouseUp	マウスボタンを離す
MouseMove	マウスボタンを動かす
Error	コントロールでエラーが検出され、呼び出し元のプログラムにエラー情報を返せないとき
BeforeDragOver	ドラッグアンドドロップ操作の実行
BeforeDropOrPaste	データをオブジェクトにドロップしようとするか、または貼り付けようとする

例としてDblClickイベントを試してみます。

フォームのコードウィンドウを開いて次のように入力します。

Private Sub flowerImage_DblClick(ByVal Cancel As MSForms.ReturnBoolean)
    nameLabel.Caption = "Flower"
End Sub

最初に呼びだすマクロは次の通りです。

Sub テスト()
    Load sampleForm
    sampleForm.flowerImage.Picture = LoadPicture("c:\tmp\flower.jpg")
    sampleForm.nameLabel.Caption = ""
    sampleForm.Show
End Sub

表示されるフォームには「nameLabel」と言うラベルと「flowerImage」と言うイメージが1つずつ設置されています。

では上記のマクロを実行して下さい。次のように表示されます。

イメージのイベント処理(1)

イメージをダブルクリックして下さい。ラベルに絵の名前が表示されます。

イメージのイベント処理(2)

-- --

フォーム上で画像を表示するための使用するイメージの利用方法について解説しました。

( Written by Tatsuo Ikura )

Profile

著者 / TATSUO IKURA

初心者～中級者の方を対象としたプログラミング方法や開発環境の構築の解説を行うサイトの運営を行っています。