手順 7: フォームへのダイアログ コンポーネントの追加Step 7: Add Dialog Components to Your Form

この手順で、図ファイルを開き、背景色を選択するためにプログラムを有効にするには、OpenFileDialog コンポーネントと ColorDialog コンポーネントをフォームに追加します。To enable your program to open picture files and choose a background color, in this step, you add an OpenFileDialog component and a ColorDialog component to your form.

コンポーネントは、いくつかの点でコントロールに似ています。A component is like a control in some ways. コンポーネントはツールボックスを使用してフォームに追加し、そのプロパティの設定には [プロパティ] ウィンドウを使用します。You use the Toolbox to add a component to your form, and you set its properties using the Properties window. ただし、コントロールとは異なり、コンポーネントをフォームに追加しても、ユーザーに表示される項目がフォームに追加されるわけではありません。But unlike a control, adding a component to your form doesn't add a visible item that the user can see on the form. 代わりに、コードで発生させることができる特定の動作が提供されます。Instead, it provides certain behaviors that you can trigger with code. ここで追加するのは、[ファイルを開く] ダイアログ ボックスを開くコンポーネントです。It's a component that opens an Open File dialog box.

ビデオへのリンクこのトピックのビデオ版については、「チュートリアル 1: Visual Basic によるピクチャ ビューアーの作成 - ビデオ 3」または「チュートリアル 1: C# によるピクチャ ビューアーの作成 - ビデオ 3」を参照してください。link to videoFor a video version of this topic, see Tutorial 1: Create a Picture Viewer in Visual Basic - Video 3 or Tutorial 1: Create a Picture Viewer in C# - Video 3. これらのビデオでは、旧バージョンの Visual Studio を使用しているため、一部のメニュー コマンドやその他のユーザー インターフェイス要素が若干異なります。These videos use an earlier version of Visual Studio, so there are slight differences in some menu commands and other user interface elements. ただし、概念および手順は、現在のバージョンの Visual Studio でも同様です。However, the concepts and procedures work similarly in the current version of Visual Studio.

フォームにダイアログ コンポーネントを追加するにはTo add dialog components to your form

  1. Windows フォーム デザイナー (Form1.cs [デザイン] または Form1.vb [デザイン]) を選択し、ツールボックスの [ダイアログ] グループを開きます。Choose the Windows Forms Designer (Form1.cs [Design] or Form1.vb [Design]) and then open the Dialogs group in the Toolbox.

    注意

    ツールボックスの [ダイアログ] グループには、多数の便利なダイアログ ボックスを開くコンポーネントが含まれています。これらは、ファイルを開く、ファイルを保存する、フォルダーを参照する、フォントや色を選択するなど、さまざまな用途で使用できます。The Dialogs group in the Toolbox has components that open many useful dialog boxes for you, which can be used for opening and saving files, browsing folders, and choosing fonts and colors. このプロジェクトでは、OpenFileDialogColorDialog という 2 つのダイアログ コンポーネントを使用します。You use two dialog components in this project: OpenFileDialog and ColorDialog.

  2. openFileDialog1 というコンポーネントをフォームに追加するには、[OpenFileDialog] をダブルクリックします。To add a component called openFileDialog1 to your form, double-click OpenFileDialog. colorDialog1 というコンポーネントを追加するには、ツールボックスの [ColorDialog] をダブルクリックします To add a component called colorDialog1 to your form, double-click ColorDialog in the Toolbox. (このコンポーネントはチュートリアルの次の手順で使用します)。Windows フォーム デザイナーの下部の領域 (ピクチャ ビューアー フォームの下) に、次の図に示すように、追加した 2 つのダイアログ コンポーネントのそれぞれに対応するアイコンが表示されます。(You use that one in the next tutorial step.) You should see an area at the bottom of Windows Forms Designer (beneath the Picture Viewer form) that has an icon for each of the two dialog components that you added, as shown in the following picture.

    ダイアログ コンポーネントDialog components
    ダイアログ コンポーネントDialog components

  3. Windows フォーム デザイナーの下部にある領域で [openFileDialog1] アイコンを選択します。Choose the openFileDialog1 icon in the area at the bottom of the Windows Forms Designer. 2 つのプロパティを次のように設定します。Set two properties:

    • Filter プロパティを次のように設定します (コピーして貼り付けることができます)。Set the Filter property to the following (you can copy and paste it):

      JPEG Files (*.jpg)|*.jpg|PNG Files (*.png)|*.png|BMP Files (*.bmp)|*.bmp|All files (*.*)|*.*  
      
    • Title プロパティを Select a picture file に設定します。Set the Title property to the following: Select a picture file

      Filter プロパティの設定は、[Select a picture] ファイル ダイアログ ボックスに表示されるファイルの種類を指定します。The Filter property settings specify the kinds of file types that will display in the Select a picture file dialog box.

    注意

    他のアプリケーションで [ファイルを開く] ダイアログ ボックスの例を確認するには、メモ帳またはウィンドウトを開き、メニュー バーで、[ファイル][開く] の順に選択します。To see an example of the Open File dialog box in a different application, open Notepad or Paint, and on the menu bar, choose File, Open. 下部にある [ファイルの種類] ドロップダウン リストに注目してください。Notice how there's a Files of type drop-down list at the bottom. ここではそのボックスの内容を、OpenFileDialog コンポーネントの Filter プロパティを使用して設定しました。You just used the Filter property in the OpenFileDialog component to set that up. また、Title プロパティと Filter プロパティが [プロパティ] ウィンドウで太字になっていることに注目してください。Also, notice how the Title and Filter properties are bold in the Properties window. IDE では、既定値とは異なる値に変更されたプロパティがわかるように、それらが太字で示されます。The IDE does that to show you any properties that have been changed from their default values.

続行または確認するにはTo continue or review