前の手順では、C1Expander コントロールの外観と動作をカスタマイズしました。この手順では、C1Expander コントロールのコンテンツ領域にコントロールを追加してからプロジェクトを実行して、このクイックスタートで作成したアプリケーションの実行時機能を確認します。

次の手順に従います。

1. カーソルを <c1:C1Expander> タグと </c1:C1Expander> タグの間に置き、［Enter］キーを押します。

2. ツールボックスに移動し、［StackPanel］アイコンをダブルクリックして、C1Expander コントロールに StackPanel コントロールを追加します。XAML マークアップは次のようになります。

   XAML	コードのコピー
   <c1:C1Expander Height="200" Width="250" Background="Aqua" Header="Expander クイックスタート" ExpandDirection="Up"> <StackPanel></StackPanel> </c1:C1Expander>

   このクイックスタートのコンテンツ領域には複数のコントロールを追加するので、C1Expander コントロールのコンテンツ領域に StackPanel コントロールを追加しています。C1Expander コントロールはコンテンツコントロールであり、一度に１つの子項目しか受け取ることができません。複数の子項目を受け取ることができるパネルベースのコントロールを C1Expander コントロールに追加すると、この制限を回避できます。

3. パネルに追加されたすべてのコンテンツが中央に配置されるように、<StackPanel> タグに HorizontalAlignment="Center" を追加します。XAML マークアップは次のようになります。
   <StackPanel HorizontalAlignment="Center">

4. カーソルを <StackPanel> タグと </StackPanel> タグの間に置き、［Enter］キーを押します。

5. ツールパネルに移動し、［TextBlock］アイコンをダブルクリックして、StackPanel コントロールにコントロールを追加します。StackPanel のコンテンツに合計３つの TextBlock コントロールが追加されるように、この手順を２回繰り返します。XAML マークアップは次のようになります。

   XAML	コードのコピー
   <StackPanel HorizontalAlignment="Center" > <TextBlock></TextBlock> <TextBlock></TextBlock> <TextBlock></TextBlock> </StackPanel>

6. 最初の <TextBlock> タグに Text="コントロール 1" を追加し、２番目の <TextBlock> タグに Text="コントロール 2" を追加し、３番目の <TextBlock> タグに Text="コントロール 3" を追加します。XAML マークアップは次のようになります。

   XAML	コードのコピー
   <TextBlock Text="コントロール 1"></TextBlock> <TextBlock Text="コントロール 2"></TextBlock> <TextBlock Text="コントロール 3"></TextBlock>

7. ［デバッグ］メニューから［デバッグ開始］を選択し、実行時にアプリケーションがどのように表示されるかを確認します。エキスパンダのコンテンツが表示されないことを確認します。

   

   C1Expander コントロールのヘッダーをクリックしてコンテンツを展開します。コンテンツ領域に追加した３つの TextBox コントロールが表示されることを確認します。

   

おめでとうございます!

これで、Expander for WPF/Silverlight クイックスタートは終了です。このクイックスタートでは、Expander for WPF/Silverlight のアプリケーションを作成してカスタマイズし、コントロールのコンテンツ領域にコンテンツを追加し、コントロールの実行時機能を確認しました。