違いは何ですか
- ControlTemplate
- データテンプレート
- HierarchalDataTemplate
- アイテムテンプレート
違いは何ですか
ControlTemplate は、コントロールの視覚的な構造と視覚的な動作を指定します。コントロールに新しい ControlTemplate を与えることで、コントロールの外観をカスタマイズできます。ControlTemplate を作成すると、その機能を変更せずに、既存のコントロールの外観を置き換えます。たとえば、アプリケーションのボタンをデフォルトの正方形ではなく丸くすることができますが、それでもボタンは Click イベントを発生させます。
ControlTemplate の例は次のようになります。
ボタンの作成
<Button Style="{StaticResource newTemplate}"
Background="Navy"
Foreground="White"
FontSize="14"
Content="Button1"/>
ボタンの ControlTemplate
<Style TargetType="Button" x:Key="newTemplate">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border x:Name="RootElement">
<!--Create the SolidColorBrush for the Background
as an object elemment and give it a name so
it can be referred to elsewhere in the control template.-->
<Border.Background>
<SolidColorBrush x:Name="BorderBrush" Color="Black"/>
</Border.Background>
<!--Create a border that has a different color by adding smaller grid.
The background of this grid is specificied by the button's Background
property.-->
<Grid Margin="4" Background="{TemplateBinding Background}">
<!--Use a ContentPresenter to display the Content of
the Button.-->
<ContentPresenter
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Margin="4,5,4,4" />
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
データ テンプレートは、コントロール テンプレートと同様の概念です。これらは、ListBox、ComboBox、または ListView などのコントロール内のデータ項目の視覚的外観を置き換える、非常に柔軟で強力なソリューションを提供します。WPF コントロールには、データ表示のカスタマイズをサポートする機能が組み込まれています。
DataTemplate の例は次のようになります。
<!-- Without DataTemplate -->
<ListBox ItemsSource="{Binding}" />
<!-- With DataTemplate -->
<ListBox ItemsSource="{Binding}" BorderBrush="Transparent"
Grid.IsSharedSizeScope="True"
HorizontalContentAlignment="Stretch">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Margin="4">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" SharedSizeGroup="Key" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding Name}" FontWeight="Bold" />
<TextBox Grid.Column="1" Text="{Binding Value }" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
ItemTemplate を使用して、データ オブジェクトの視覚化を指定します。ItemsControl がコレクション オブジェクトにバインドされ、DataTemplate を使用して特定の表示命令を提供しない場合、結果として得られる各項目の UI は、基になるコレクション内の各オブジェクトの文字列表現になります。
アイテム テンプレートの例は次のようになります。
<ListBox Margin="10" Name="lvDataBinding">
<ListBox.ItemTemplate>
<DataTemplate>
<WrapPanel>
<TextBlock Text="Name: " />
<TextBlock Text="{Binding Name}" FontWeight="Bold" />
<TextBlock Text=", " />
<TextBlock Text="Age: " />
<TextBlock Text="{Binding Age}" FontWeight="Bold" />
<TextBlock Text=" (" />
<TextBlock Text="{Binding Mail}" TextDecorations="Underline" Foreground="Blue" Cursor="Hand" />
<TextBlock Text=")" />
</WrapPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
ItemsControl に ItemTemplate を設定すると、UI は次のように生成されます (例として ListBox を使用)。
コンテンツの生成中に、ItemsPanel は、ItemContainerGenerator に対する要求を開始して、各データ項目のコンテナーを作成します。ListBox の場合、コンテナーは ListBoxItem です。ジェネレーターは、コンテナーを準備するために ItemsControl を呼び出します。
準備の一部として、ListBox の ItemTemplate をコピーして ListBoxItem の ContentTemplate にする必要があります。
すべての ContentControl タイプと同様に、ListBoxItem の ControlTemplate には ContentPresenter が含まれています。テンプレートが適用されると、ContentTemplate が ListBoxItem の ContentTemplate にバインドされている ContentPresenter が作成されます。
最後に、ContentPresenter はその ContentTemplate をそれ自体に適用し、UI を作成します。
複数の DataTemplate が定義されていて、DataTemplate をプログラムで選択して適用するロジックを提供する場合は、ItemTemplateSelector プロパティを使用します。
ItemsControl は、視覚的なカスタマイズに優れた柔軟性を提供し、多くのスタイル設定およびテンプレート プロパティを提供します。ItemContainerStyle プロパティまたは ItemContainerStyleSelector プロパティを使用して、データ項目を含む要素の外観に影響を与えるスタイルを設定します。たとえば、ListBox の場合、生成されるコンテナは ListBoxItem コントロールです。ComboBox の場合、それらは ComboBoxItem コントロールです。項目のレイアウトに影響を与えるには、ItemsPanel プロパティを使用します。コントロールでグループ化を使用している場合は、GroupStyle または GroupStyleSelector プロパティを使用できます。
詳細については、データ テンプレートの概要を参照してください。
ControlTemplaesは、コントロールの「外観」と「動作」を定義します。ボタンはデフォルトで長方形です。ListBoxの背景はデフォルトで白です。これらはすべて、ControlのControlTempleによって定義されます。
DataTemplaeは、保持するデータのレイアウトを使用してコントロールを支援します。ユーザーのリストがリストボックスに追加され、UserPasswordの前にUserNameを表示したい場合は、DataTemples内でこれを定義します。DataTemplesは、ListBoxのItemTemplate(4)プロパティに割り当てられます。
HierarchalDataTemplteは、Hierarchal Data Sourceを処理することを除いて、DataTemplesと同じです。これは、TreeViewControlで一般的に使用されます。