チュートリアル : デバイスのユーザー コントロールの作成
更新 : 2007 年 11 月
このチュートリアルでは、コントロール ライブラリを作成し、これに格納するユーザー コントロールを作成します。1 つの再利用可能単位としての複数の Windows フォーム コントロールの組み合わせであるユーザー コントロールと、標準のコントロールからは利用できない UI または機能を必要とするコントロールであるカスタム コントロールとの違いについて説明します。
このチュートリアルのユーザー コントロールは、デバイスの単純な時計表示であり、「チュートリアル : Visual Basic による複合コントロールの作成」および「チュートリアル : Visual C# による複合コントロールの作成」など、同様のデスクトップ チュートリアルをひな型としています。
このチュートリアルは、次の 4 つの部分で構成されます。
コントロール ライブラリとコントロールの作成
ライブラリとコントロールの名前変更
コントロールへのコンポーネントの追加
デバイス エミュレータでのコントロールのテスト
このチュートリアルでは、Visual Basic または Visual C# のどちらかを使用できます。ファイル名が同じで、言語固有の拡張子が付いているファイルをどちらの言語でも使用する場合、使用する言語の拡張子を選択する必要があることが縦棒により示されます。たとえば、filename.vb|cs となります。
メモ : |
---|
お使いのマシンで、Visual Studio ユーザー インターフェイスの一部の要素の名前や場所が、次の手順とは異なる場合があります。これらの要素は、使用している Visual Studio のエディションや独自の設定によって決まります。詳細については、「Visual Studio の設定」を参照してください。 |
このチュートリアルは、[Visual Basic 開発設定] と 「Visual C# 開発設定] を使用して記述されています。
前提条件
なし。
対象デバイスの選択
ソリューションを配置するときにデバイス選択のダイアログが表示されるようにするには、次の手順を実行します。
配置時にデバイス選択のダイアログを表示するには
[ツール] メニューの [オプション] をクリックし、[デバイス ツール] を展開クします。次に、[全般] をクリックします。
([デバイス ツール] が表示されない場合は、[オプション] ダイアログ ボックスの下部にある [すべての設定を表示] を選択します)。
[デバイス プロジェクトの配置前に選択できるデバイスを表示] チェック ボックスをオンにします。
プロジェクトの作成
新しいプロジェクトに付けた名前により、ルート名前空間とアセンブリ名も設定されます。
コントロール ライブラリとコントロールを作成するには
(Visual Basic) [ファイル] メニューの [新規作成] をポイントし、[プロジェクト] をクリックします。
または
(Visual C#) [ファイル] メニューの [新規作成] をポイントし、[プロジェクト] をクリックします。
[新しいプロジェクト] ダイアログ ボックスで、[プロジェクトの種類] ペインの [Visual Basic] または [Visual C#] を展開し、[スマート デバイス] をクリックします。
目的の言語が最初に表示されない場合は、[他の言語] を展開します。この表示は、ユーザーの開発設定で管理されます。
[テンプレート] ペインの [スマート デバイス プロジェクト] をクリックします。
[名前] ボックスに「ctlDevClockLib」と入力し、[OK] をクリックします。
(Visual C# のみ) [場所] ボックスで、プロジェクト ファイルを格納する場所を確認し、[OK] をクリックします。
[ターゲット プラットフォーム] ボックスの一覧の [Pocket PC 2003] をクリックします。
[.NET Compact Framework のバージョン] ボックスの一覧の [.NET Compact Framework Version 2.0] をクリックします。
[テンプレート] ペインの [コントロール ライブラリ] をクリックし、[OK] をクリックします。
コンポーネント デザイナが表示されます。
プロジェクト名、ルート名前空間、およびアセンブリ名 (ctlDevClockLib) は既に指定しました。しかし、プロジェクト内のコンポーネントには Visual Studio により割り当てられた既定の名前があります (たとえば、UserControl1 など)。通常は、それらの名前をもっとわかりやすい用語に変更します。
ライブラリとコントロールの名前を変更するには
ソリューション エクスプローラで [UserControl1.vb|cs] を右クリックし、[プロパティ] をクリックします。
[ファイル名] を「ctlDevClock.vb|cs」に変更します。
(Visual C# のみ) このコード要素に対するすべての参照の名前を変更するかどうかを確認するメッセージ ボックスに対して、[はい] をクリックします。
[プロパティ] ウィンドウで行った名前の変更が、他の参照 (クラス名やコンストラクタなど) に反映されます。
次に、[ツールボックス] からコンポーネントを追加して、機能やユーザーとの対話をユーザー コントロールに設定します。このチュートリアルでは、システム時刻にアクセスする タイマー コントロールと、時刻を表示する ラベル コントロールを追加します。
コンポーネントを追加して、それらのプロパティを変更するには
[ツールボックス] の [ラベル] をダブルクリックします。
ラベル コントロールが コンポーネント デザイナ のユーザー コントロールに追加されます。
ラベル コントロールの [プロパティ] ウィンドウで、次の手順を実行します。
プロパティ |
変更後の値 |
---|---|
(Name) |
lblDisplay |
テキスト |
(空白) |
TextAlign |
TopCenter |
Font.Size |
14 |
[ツールボックス] の [タイマー] をダブルクリックします。
コンポーネント トレイに タイマー コントロールが表示されます。
タイマ コントロールの [プロパティ] ウィンドウで、次の手順を実行します。
プロパティ |
変更後の値 |
---|---|
Interval |
1000 |
Enabled |
True |
次の手順では、ラベル コントロールにイベント ハンドラを追加して、時計が時を刻むようにします。
イベント ハンドラを追加するには
コンポーネント トレイで、[Timer1] (Visual Basic の場合) または [timer1] (C# の場合) をダブルクリックし、コード エディタで Tick イベントを開きます。
(Visual Basic) 次のイベント処理コードを挿入します。
lblDisplay.Text = Format(Now, "hh:mm:ss")
または
(Visual C#)
lblDisplay.Text = DateTime.Now.ToLongTimeString();
(Visual Basic) アクセス修飾子を Private から Protected に変更し、Overridable キーワードを追加して、ハンドラ コードを次のようにします。
Protected Overridable Sub Timer1_Tick(ByVal sender As Object, _ ByVal e As System.EventArgs) Handles Timer1.Tick ' Causes the label to display the current time lblDisplay.Text = Format(Now, "hh:mm:ss") End Sub
または
(Visual C#) アクセス修飾子を private から protected に変更し、virtual キーワードを追加して、ハンドラ コードを次のようにします。
protected virtual void timer1_Tick(object sender, System.EventArgs e) { // Causes the label to display the current time. lblDisplay.Text = DateTime.Now.ToLongTimeString(); }
[ファイル] メニューの [すべてを保存] をクリックします。
(Visual Basic のみ) [プロジェクトの保存] ダイアログ ボックスで、プロジェクトを「ctlDevClockLib」として選択した場所に保存します。
コントロールのテスト
この単純なデバイス アプリケーションは、コントロールのテスト コンテナとして機能します。
コントロールをビルドし、テスト コンテナを作成するには
[ビルド] メニューの [ビルド] (または [ctlDevClockLib のビルド]) をクリックします。
[ファイル] メニューの [追加] をポイントし、[新しいプロジェクト] をクリックします。
[新しいプロジェクトの追加] ダイアログ ボックスで、[プロジェクトの種類] ペインの [スマート デバイス] をクリックし、[テンプレート] ペインの [スマート デバイス プロジェクト] をクリックします。
[プロジェクト名] ボックスに「Test」と入力し、[OK] をクリックします。
[新しいスマート デバイス プロジェクトの追加] ダイアログ ボックスで、[ターゲット プラットフォーム] ボックスの一覧の [Pocket PC 2003] をクリックし、[.NET Compact Framework] ボックスの一覧の [.NET Compact Framework Version 2.0] をクリックします。さらに、[テンプレート] ペインの [デバイス アプリケーション] をクリックし、[OK] をクリックします。
ソリューション エクスプローラで、Test プロジェクトを右クリックし、[スタートアップ プロジェクトに設定] をクリックします。
Test プロジェクトを右クリックし、[参照の追加] をクリックします。
[参照の追加] ダイアログ ボックスの [プロジェクト] タブをクリックし、[ctlDevClockLib] をクリックします。
[ツールボックス] の [ctlDevClockLib コンポーネント] タブを探し、[ctlDevClock] コンポーネントをダブルクリックします。
コントロールがデザイナに読み込まれます。
[デバッグ] メニューの [開始] または [デバッグ開始] をクリックします。
[配置] ダイアログ ボックスで、[Pocket PC 2003 SE エミュレータ] を選択し、[配置] をクリックします。