このクイックスタートは、DropDown for WPF を初めて使用するユーザーのために用意されています。このクイックスタートでは、C1DropDownコントロールを使用した新しいVisual Studioプロジェクトを作成し、それにコンテンツを追加して、アプリケーションを実行して出力を表示します。
アプリケーションの作成
この手順では、DropDown for WPF を使って WPF アプリケーションを作成します。C1DropDown コントロールをアプリケーションに追加すると、完全に機能するドロップダウンボックスのようなインターフェイスになり、そこに画像、コントロールなどの要素を追加することができます。プロジェクトをセットアップし、C1DropDown コントロールをアプリケーションに追加するには、次の手順に従います。
- Visual Studio で、［ファイル］→［新しい］を選択します。
- ［新しいプロジェクト］ダイアログボックスの左ペインから言語を選択し、テンプレートリストから［WPF アプリケーション］を選択します。
- プロジェクトの名前と場所を入力し、［OK］をクリックして新しいアプリケーションを作成します。
- Visual Studioツールボックスに移動し、C1DropDownアイコンをダブルクリックして、コントロールをウィンドウに追加します。
- ウィンドウのサイズを変更し、ウィンドウ内のC1DropDownコントロールの位置を変更します。
- ［プロパティ］ウィンドウに移動し、C1DropDown コントロールの Height を 30 に、Width を 100 に設定します。 XAML は次のようになります。
XAML ページのデザインビューは次の図のようになります（フォームで C1DropDown コントロールを選択している場合）。
これで、アプリケーションのユーザーインターフェイスが正しくセットアップされましたが、このアプリケーションを実行すると、C1DropDown コントロールにコンテンツがないことがわかります。次の手順では、C1DropDown コントロールにコンテンツを追加し、コントロールに対して実行可能ないくつかの操作を確認してみます。
コントロールへのコンテンツの追加
前の手順では、WPF アプリケーションを作成し、プロジェクトに C1DropDown コントロールを追加しました。この手順では、C1DropDown コントロールにコンテンツを追加します。プロジェクトをカスタマイズしてアプリケーションの C1DropDown コントロールにコンテンツを追加するには、次の手順に従います。
- ［XAML］ビューに切り替えます。次の手順では、XAML マークアップをアプリケーションに追加することにより、ドロップダウンボックスにコンテンツを追加します。
- C1DropDown コントロールにマークアップを追加します。次のようになります。
XAML
- 追加した XAML マークアップの</c1:C1DropDown.Header> タグの直後に、次のマークアップを追加します。
XAML <c1:C1DropDown.Content> <TreeView x:Name="treeSelection" Background="White"> <TreeViewItem Header="南アメリカ"> <TreeViewItem Header="ブラジル" /> <TreeViewItem Header="アルゼンチン" /> <TreeViewItem Header="ウルグアイ" /> </TreeViewItem> <TreeViewItem Header="ヨーロッパ"> <TreeViewItem Header="イタリア" /> <TreeViewItem Header="フランス" /> <TreeViewItem Header="イギリス" /> <TreeViewItem Header="ドイツ" /> </TreeViewItem> </TreeView> </c1:C1DropDown.Content>
これにより、標準の TreeView コントロールが C1DropDown コントロールのコンテンツ領域に追加されます。［デザイン］ビューに次の図のようなウィンドウが表示されます。
この手順では、C1DropDown コントロールにコンテンツを追加しました。次の手順では、コントロールをさらにカスタマイズしてからアプリケーションを実行して、実行時の操作を確認します。
アプリケーションの実行
WPF アプリケーションを作成して、アプリケーションの外観をカスタマイズしました。次に、アプリケーションを実行します。アプリケーションを実行し、DropDown for WPF の実行時の動作を確認し、さらにコントロールをカスタマイズするには、次の手順に従います。
- ［デバッグ］メニューから［デバッグ開始］を選択し、実行時にアプリケーションがどのように表示されるかを確認します。
アプリケーションは次の図のように表示されます。
C1DropDown コントロールは、シンプルなドロップダウンボックスとして表示されます。指定したテキストがコントロールのヘッダーに表示されていることを確認します。
- C1DropDown コントロールのドロップダウン矢印をクリックします。TreeView コントロールが表示されることを確認します。
- ドロップダウンボックスの項目を展開する TreeView コントロールを通常どおりに操作できることを確認します。
- もう一度 C1DropDownのドロップダウン矢印をクリックします。
ドロップダウンボックスが閉じることを確認します。
おめでとうございます!
これで DropDown for WPF クイックスタートは完了です。簡単な WPF アプリケーションを作成し、DropDown for WPF コントロールを１つ追加してカスタマイズしました。その後、コントロールの実行時機能をいくつか確認しました。