エクスポート (0) 印刷
すべて展開
情報
要求されたトピックは次のとおりです。しかし、このトピックはこのライブラリには含まれていません。

ContentControl.ContentTemplate プロパティ

2013/12/12

ContentControl のコンテンツを表示するために使用するデータ テンプレートを取得または設定します。

Namespace:  System.Windows.Controls
アセンブリ:  System.Windows (System.Windows.dll 内)
XAML の XMLNS: xmlns にマップされていません。

public DataTemplate ContentTemplate { get; set; }
<contentControl>
  <contentControl.ContentTemplate>
    dataTemplate
  </contentControl.ContentTemplate>
</contentControl>
<contentControl ContentTemplate="templateReference"/>

XAML 値

dataTemplate

この ContentControl の表示を定義する DataTemplate オブジェクト要素。詳細については、「Windows Phone のデータ バインディング」を参照してください。

templateReference

StaticResource は、既存の DataTemplate 定義を参照します。詳細については、「[6b650743-0e38-420e-a328-5d5f008779a6#markup_extensions]」を参照してください。

ContentTemplate の属性およびプロパティ要素の構文の両方を示します。これは、リソースとして既存のインライン テンプレートを参照することも、それとは対照的にインライン テンプレートを定義することも、どちらも等しく有効なシナリオであるためです。

プロパティ値

型: System.Windows.DataTemplate
ContentControl のコンテンツを表示するために使用するデータ テンプレート。

依存関係プロパティの識別子フィールド:  ContentTemplateProperty

複数の ContentControl オブジェクトで同じ UIElement オブジェクトを使用する必要がある場合は、ContentTemplate プロパティを設定します。たとえば、アプリケーション内の複数のボタンで同じグラフィックスを使用するとします。この場合、グラフィックスを含む DataTemplate を作成し、これをボタンの ContentTemplate として使用できます。ボタンに共通の要素と固有のコンテンツの両方を含める必要がある場合は、ContentPresenterDataTemplate に追加し、Content プロパティで TemplateBinding マークアップ拡張機能を使用して、固有のコンテンツの位置を指定できます。詳細については、「[6b650743-0e38-420e-a328-5d5f008779a6#markup_extensions]」を参照してください。

ContentTemplateContentControl のインスタンスで直接設定することもできますが、スタイルで設定するのが一般的です。

次の例では、StyleButtonContentTemplate を設定することにより、共通のグラフィックを表示する 3 つのボタンを作成しています。


<StackPanel Orientation="Horizontal">
  <StackPanel.Resources>
    <Style x:Key="ArrowButton" TargetType="Button">
      <Setter Property="Margin" Value="5"/>
      <Setter Property="Width" Value="50"/>
      <Setter Property="Height" Value="20"/>
      <Setter Property="ContentTemplate">
        <Setter.Value>
          <DataTemplate>
            <Grid Height="8" Width="8">
              <Path HorizontalAlignment="Stretch" 
                      Margin="0,0,1.8,1.8" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FF000000" 
                      Data="M0.5,5.7 L0.5,0.5 L5.7,0.5"/>
              <Path HorizontalAlignment="Stretch" 
                      Margin="2,3,0,0" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FFFFFFFF" 
                      Data="M3.2,7.5 L7.5,7.5 L7.5,3.5"/>
              <Path HorizontalAlignment="Stretch" 
                      Margin="1.2,1.4,0.7,0.7" 
                      VerticalAlignment="Stretch" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" 
                      Data="M2.5,2.5 L7.5,7.5"/>
              <Path HorizontalAlignment="Stretch" 
                      Margin="1.7,2.0,1,1" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FF000000" 
                      Data="M3,7.5 L7.5,7.5 L7.5,3.5"/>
              <Path HorizontalAlignment="Stretch" 
                      Margin="1,1,1,1" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FFFFFFFF" 
                      Data="M1.5,6.5 L1.5,1 L6.5,1.5"/>
            </Grid>
          </DataTemplate>
        </Setter.Value>
      </Setter>
    </Style>

  </StackPanel.Resources>
  <Button Style="{StaticResource ArrowButton}"></Button>
  <Button Style="{StaticResource ArrowButton}"></Button>
  <Button Style="{StaticResource ArrowButton}"></Button>
</StackPanel>


前の例では、次の図のような出力を生成します。

同一のグラフィックスを持つボタン

Three buttons that have the same content.

次の例では、共通のグラフィックと固有のコンテンツを表示する 3 つのボタンを作成しています。DataTemplateContentPresenter が含まれているため、これらのボタンには、共通のグラフィックだけでなく、固有のコンテンツを割り当てることができます。


<StackPanel Orientation="Horizontal">
  <StackPanel.Resources>
    <Style x:Key="ArrowButton" TargetType="Button">
      <Setter Property="Margin" Value="5"/>
      <Setter Property="Width" Value="50"/>
      <Setter Property="Height" Value="20"/>
      <Setter Property="ContentTemplate">
        <Setter.Value>
          <DataTemplate>
            <StackPanel Orientation="Horizontal">
              <Grid Height="8" Width="8">
                <Path HorizontalAlignment="Stretch" 
                      Margin="0,0,1.8,1.8" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FF000000" 
                      Data="M0.5,5.7 L0.5,0.5 L5.7,0.5"/>
                <Path HorizontalAlignment="Stretch" 
                      Margin="2,3,0,0" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FFFFFFFF" 
                      Data="M3.2,7.5 L7.5,7.5 L7.5,3.5"/>
                <Path HorizontalAlignment="Stretch" 
                      Margin="1.2,1.4,0.7,0.7" 
                      VerticalAlignment="Stretch" Fill="#FFFFFFFF" Stretch="Fill" Stroke="#FF000000" 
                      Data="M2.5,2.5 L7.5,7.5"/>
                <Path HorizontalAlignment="Stretch" 
                      Margin="1.7,2.0,1,1" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FF000000" 
                      Data="M3,7.5 L7.5,7.5 L7.5,3.5"/>
                <Path HorizontalAlignment="Stretch" 
                      Margin="1,1,1,1" 
                      VerticalAlignment="Stretch" Stretch="Fill" Stroke="#FFFFFFFF" 
                      Data="M1.5,6.5 L1.5,1 L6.5,1.5"/>
              </Grid>
              <ContentPresenter Content="{Binding}"/>
            </StackPanel>
          </DataTemplate>
        </Setter.Value>
      </Setter>
    </Style>

  </StackPanel.Resources>
  <Button Style="{StaticResource ArrowButton}" Content="1"></Button>
  <Button Style="{StaticResource ArrowButton}" Content="2"></Button>
  <Button Style="{StaticResource ArrowButton}" Content="3"></Button>
</StackPanel>


前の例では、次の図のような出力を生成します。

同一のグラフィックスと独自のコンテンツを持つボタン

Three buttons that have shared and unique content.

Windows Phone OS

サポート: 8.0, 7.1, 7.0

表示:
© 2014 Microsoft