| Visual Basic 6.0 初級講座 |
|
|
第８回 ピクチャーボックスとイメージ
今回からは２０個のコントロールの使い方について説明していきます。その手始めの今回は、ピクチャーボックスとイメージです。
上の画像でピクチャーボックスと、イメージのアイコンを確認してください。上の画像ではコントロールのアイコンは２列に並んでいますが、場合によっては３列以上に並んでいる場合もあります。
ピクチャーボックスは配置すると、Picture1 と言う名前が自動的に付きます。イメージは Image1 です。これらの名前は変えることもできますが、今回はそのままでいきます。
１．イメージで画像を表示する
イメージは主に画像を表示するときに使います。イメージのほかにも画像を表示する機能を持ったコントロールはありますが、単に画像を表示すればいいだけの場合はイメージを使うのが最も優れています。
次の例は C:\Windows\雲.bmp を表示させるコードです。実行する前にイメージを一つフォームに配置するのを忘れない下さい。
| Private Sub Form_Click() Image1.Picture = LoadPicture("C:\Windows\雲.bmp") End Sub |
注意：C:\Windows\雲.bmp が存在しない場合はエラーになります。代わりに何でもいいので存在する画像ファイルを指定してください。
無事にできましたか？これができればいつでも好きな画像をあなたのプログラムで使うことができますね。ただし、イメージをはじめとして、ＶＢで表示できる画像は拡張子が bmp , gif , jpg ,jpeg , wmf ,ico などのファイルだけです（このほかにも表示できるのも少しあるがほとんど使わない）。これ以外の画像ファイルはこの例のような方法では表示できません。表示させる方法はありますがかなりの高等技術が必要です。
それでも、ＶＢ３以前は bmp しか表示できなかったのだから便利になったものです。実際これ以外の画像を表示したい場合などはほとんどないでしょう。
さて、イメージの便利な点に気づきましたか？ イメージは表示する画像のサイズに合わせて自動的に広がってくれるのです！、だから、イメージを使っている限り画像が大きすぎて表示できないと言うことはありません。この点ピクチャーボックスを使うと自分でピクチャーボックスのサイズを画像のサイズに変更しなくてはいけないので大変です。（とは言っても簡単にやる方法もある）。
ところで、こうなったらその場で指定したファイルを表示するプログラムを作ってみたいところです。しかし、これを実現するには画像を表示する機能のほかに、ファイルを選択する機能が必要となり、イメージやピクチャーボックスだけでは手に負えません。そこで、特別講義「画像を選択する」 を開講しますので必要なら見てください。
それから、表示した画像を消すには次のようにします。
Image1.Picture = LoadPicture("") |
２．イメージで画像を変形する
イメージはただ画像を表示するだけではなく、画像を変形させることもできます。この機能を使うにはイメージのStretchプロパティをTrueにしてください。プロパティの変更の仕方は前回やったようにImage1を選択してからプロパティウィンドウで、Stretch を探して その右に四角をクリックして True にすればいいのでしたね。この作業は 次のように コードで行うこともできます。
Image1.Stretch = True |
今回はコードで変更することにしておきましょう。なお、Stretch は 「ストレッチ」と読みます。
Stretchプロパティは画像を表示するときに自動的にイメージの大きさを画像に合わせて変更するか、しないかを設定します。False のときは 自動的に変更します。 True の時は自動的に変更しません。
自動的にサイズが変更されないと、大きい画像の場合は画像の一部しか表示されないように思いますが、ちがいます。この機能はイメージにだけ備わっている特別な機能なのです。
イメージはStrtchプロパティが True の時、自分のサイズに合わせて 表示する画像を 変形するのです！
実際にコーディングしてみましょう。さっきのプログラムを次のように修正してください。なお、イメージは大きめに配置してください。
| Private Sub Form_Click() Image1.Stretch = True Image1.Picture = LoadPicture ( "C:\Windows\雲.bmp" ) End Sub |
それで、実行すると分かるでしょう、わかりにくい場合はイメージをたて長に配置したり、横長に配置したりして試してみてください。この画像は雲の画像なのであまりおもしろくありませんが、人間の顔などでやると楽しめます。
３．ピクチャーボックスで画像を表示する
ピクチャーボックスを使って画像を表示させるには次のようにします。フォームにピクチャーボックスを一つは位置して次のように打ち込んでください。
| Private Sub Form_Click() Picture1.Picture = LoadPicture("C:\Windows\雲.bmp") End Sub |
イメージの時とほとんど同じです。まったく同じといってもいいでしょう。ところが、表示の仕方は少し違います。実行してみれば分かると思いますが、ピクチャーボックスより画像が大きい場合には画像の一部しか表示されません。また、ピクチャーボックスより画像が小さい場合はあまった部分がかっこわるいです。つまり、イメージのように自動的にサイズを調節してくれないのです。
自動的にサイズを調節する機能を付け加えるには AutoSize プロパティを True にします。次のコードはイメージの時と同じように表示する画像に会わせて自動的にサイズを調節します。
| Private Sub Form_Click() Picture1.AutoSize = True Picture1.Picture = LoadPicture("C:\Windows\雲.bmp") End Sub |
４．わく
ピクチャボックスはへこんだわくがあるのに、イメージは画像を表示していないときは透明です。しかし、この点はプロパティによって変えられます。つまり、イメージにへこんだ枠（わく）を持たせたり、ピクチャーボックスをフラット（平面的）にする事もできます。
この変更は BorderStyle プロパティ と Appearance プロパティで行ってください。初めのうちはプロパティウィンドウから変更するよいでしょう。結局のところこの２つのコントロールの見かけは全く同じと言うことです。
BorderStyleプロパティ
０ なし わくを表示しない。
１ 実線 わくを表示する。
Appearanceプロパティ
０ フラット 平面的なわく
１ ３Ｄ 立体的なわく
注意：もちろん、BorderStyleプロパティが０のときは Appearanceプロパティをいじってもわくは表示されない。
５．ピクチャーボックスで文字を表示する
ピクチャーボックスはイメージと違って文字も表示できます。
例
Picture1.Print "たけやぶやけた" |
文字を表示する位置はピクチャーボックス内の座標で指定できます。ピクチャーボックスの左上が座標（０、０）です。それで、座標（３００、１００）に表示させるコードは以下のようになります。
| Picture1.CurrentX = 300 Picture1.CurrentY = 100 Picture1.Print "好きときめきとキス" |
表示する文字の色や大きさを設定するには ForeColor プロパティと、Font プロパティを使います。この２つはいろいろな設定ができるので遊んでみてください。やはり、プロパティウィンドウからいじるとよいでしょう。
６．ピクチャーボックスでグラフィックを表示する
ピクチャーボックスはイメージ違ってグラフィックも表示できます。
グラフィックとは Line , Circle , Pset メソッドによって描かれる、線 円 点 のことです。これらメソッドの使い方は授業の第２回で解説していますので参照してください。
なお、描画したグラフィックを消去するには Cls メソッドを使います。
例
Picture1.Cls |
７．ピクチャーボックスをコンテナにする
コンテナ機能ははじめは使わないと思います。コンテナとはほかのコントロールを配置するための土台となる機能です。たとえば、フォームはコンテナ機能を持っています。それと同様にピクチャーボックスの中にコマンドボタンを配置したりできます。コンテナ機能を持っているのはフォームと、ピクチャーボックス、そしてまだ一度も登場していないフレームの３つです。
８．イベント
注意：この「８．イベント」を書いた後にイベントについて解説した 入門講座第４回 が完成しました。そちらもあわせてご覧下さい。
ピクチャーボックスもイメージも クリック 、ダブルクリックなど、基本的なイベントに応答することができます。たとえば、次のコードはピクチャーボックスがクリックされると メッセージを表示します。
| Private Sub Picture1_Click() MsgBox "ピクチャーボックスがクリックされました。" End Sub |
また、次のコードはイメージがダブルクリックされるとメッセージを表示します。
| Private Sub Image1_DblClick() MsgBox "イメージがダブルクリックされました" End Sub |
このほかのイベントについてはいずれ詳しく説明するつもりなので今回はこのくらいにします。
９．まとめ
共通の機能
・画像を表示する
Image1.Picture = LoadPicture("C:\Windows\雲.bmp")
・画像を消す
Image1.Picture = LodaPicture("")
・わく の表示、非表示を切り替える
Image1.BorderStyle = 0
０ 表示しない １ 表示する
・わく の形を設定
Image1.Appearance = 0
０ 平面的 １ 立体的
イメージの機能
・画像を変形する
Image1.Stretch = True
False 変形モードオフ（変形しないで自動的にサイズを調節する）
True 変形モードオン
ピクチャーボックスの機能
・サイズを画像に合わせて自動調節する
Picture1.AutoSize = True
False 自動調節しない。
True 自動調節する
・文字を表示する
Picture1.Print "しめじめし"
・文字を表示する位置を設定する
Picture1.CurrentX = 300
Picture1.CurrentY = 100
・表示する文字の色やサイズを設定する
ForeColor プロパティと Font プロパティを使う。
・グラフィックを表示する
Line Circle Pset メソッドを使う。
・文字やグラフィックを消す
Picture1.Cls