私のケーキを持って、それも食べてください：コンテナとその内容をバインドする

Question

私は、スライスと塗りつぶしという2つのDependencyPropertiesを含むカスタムコントロールCakeを持っています。 スライスにアクセスできるスタイルを作成するにはどうしたらいいですか？スライスをデザインすることもできますか？

<Style TargetType={x:Type local:Cake}> 
    //I don't like setting DataContext Here 
    <Setter Property="DataContext" Value="{Binding RelativeSource={RelativeSource Self}}/> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType={x:Type local:Cake}> 
       <Grid DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}">       

        //This is how I display a slice 
        <ContentPresenter Content={Binding Slice}/> 

        //This is how cake decorations are displayed 
        <ItemsPresenter/> 

       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="Slice"> 
     <Setter.Value> 

      //Design Slice Here - it's easy to override when I want 
      <Slice Filling={Binding Filling}> // it's just in a setter. 

     </Setter.Value> 
    </Setter> 
    <Setter Property="DataContext" Value="{Binding RelativeSource={RelativeSource Self}}/> 
</Style> 

オプションは、私が試した：私は明らかにユーザーコントロールでは動作しませんという名前のコンテンツを、許可したいので

• は、私は、ユーザーコントロールを使用することはできません。私は彼らの バインディングのためのDataContextを使用することはできませんユーザーを意味し、自己にケーキコンテナのDataContextを設定しなければならないので、私は上記の例を好きではないHere.

• を参照してください。

• ケーキでは、どちらが正しい親であるかわからないため、RelativeSourceを使用してFillingプロパティをバインドすることはできません。 Here.

• 私はスライス要素、 で直接コンテンツプレゼンターを置き換えることができますが、それはテンプレートにあるので、私はテンプレート外スライスどこ へのアクセスを失う参照してください。私はvisualTreeをスライスにタイプキャストする可能性がありますが、これはメンテナンスの悪夢を感じさせます。

私は基本的に、それぞれのケーキは、スライスを持ちたい、ともそれをデフォルトの外観を与えながら

<Cake.Slice> 
    <DockPanel> 
     <Rectangle Background= “Blue”/> 
     <Rectangle Background= “Blue”/> 
     <Rectangle Background=“{Binding Filling}”/> 
    </DockPanel> 
</Cake.Slice> 

を使用して設定できるようにします。

EDIT： はどうやら私のスタイルは、ケーキプロジェクトとは対照的に、私はCake.dllを参照することを仕事に提供しません。それはなぜでしょうか？

Answer 1

これはあなたが必要とするものではありませんが、これを達成するための参考になることを願っています。

まず、あなたがコントロール自体にDataContextを設定する必要はありません、あなたはケーキ制御（充填およびスライス）上のプロパティにバインドすることができCakeののControlTemplateから{TemplateBinding Slice}を使用して、{Binding Slice, RelativeSource={RelativeSource TemplatedParent}}のためだけのショートカットである（ことができますので、どちらか一方を使用してください）。

ControlTemplateのItemPresenterがどの項目を表示するのか、SliceとFillingのプロパティの種類はわからないので、これはコントロールの簡略化されたバージョンになります。この例では、充填はSolidColorBrushで、スライスはStyleです。そのスタイルはCakeのControlTemplate内のContentControlに適用されるので、スライスにあらかじめ定義されたスタイルを持つことができます。また、選択した内容を適用することもできます（Sliceプロパティの目的が異なる場合は、例えばSliceStyleという別のプロパティを導入できます）。

ケーキ制御：

public class Cake : Control 
{ 
    static Cake() 
    { 
     DefaultStyleKeyProperty.OverrideMetadata(
      typeof(Cake), 
      new FrameworkPropertyMetadata(typeof(Cake))); 
    } 

    public SolidColorBrush Filling 
    { 
     get { return (SolidColorBrush)GetValue(FillingProperty); } 
     set { SetValue(FillingProperty, value); } 
    } 

    public static readonly DependencyProperty FillingProperty = 
     DependencyProperty.Register(
      "Filling", 
      typeof(SolidColorBrush), 
      typeof(Cake), 
      new PropertyMetadata(Brushes.Transparent)); 

    public Style Slice 
    { 
     get { return (Style)GetValue(SliceProperty); } 
     set { SetValue(SliceProperty, value); } 
    } 

    public static readonly DependencyProperty SliceProperty = 
     DependencyProperty.Register(
      "Slice", 
      typeof(Style), 
      typeof(Cake), 
      new PropertyMetadata(null)); 
} 

デフォルトスタイル（Generic.xaml）：

<Style TargetType="{x:Type local:Cake}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type local:Cake}"> 
       <ContentControl Width="{TemplateBinding Width}" 
           Height="{TemplateBinding Height}" 
           Style="{TemplateBinding Slice}"/> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

異なるスライスのスタイル（これらはContentControlにのためのControlTemplateを設定しているので、あなたが問題番号3にヒットしません。あなたの質問）：

<Window.Resources> 
    <Style x:Key="TwoLayeredSlice" TargetType="{x:Type ContentControl}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Grid> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="*"/> 
          <RowDefinition Height="*"/> 
         </Grid.RowDefinitions> 
         <Rectangle Fill="{Binding Filling, 
          RelativeSource={RelativeSource AncestorType={x:Type local:Cake}}}"/> 
         <Rectangle Fill="Brown" 
            Grid.Row="1"/> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

    <Style x:Key="FourLayeredSlice" TargetType="{x:Type ContentControl}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Grid> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="*"/> 
          <RowDefinition Height="*"/> 
          <RowDefinition Height="*"/> 
          <RowDefinition Height="*"/> 
         </Grid.RowDefinitions> 
         <Rectangle Fill="{Binding Filling, 
          RelativeSource={RelativeSource AncestorType={x:Type local:Cake}}}"/> 
         <Rectangle Fill="Brown" 
            Grid.Row="1"/> 
         <Rectangle Fill="{Binding Filling, 
          RelativeSource={RelativeSource AncestorType={x:Type local:Cake}}}" 
            Grid.Row="2"/> 
         <Rectangle Fill="Brown" 
            Grid.Row="3"/> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</Window.Resources> 

そしてコントロールが使用中：

<Grid Background="Gray"> 
    <local:Cake Width="200" 
       Height="100" 
       HorizontalAlignment="Left" 
       Filling="Gold" 
       Slice="{StaticResource TwoLayeredSlice}"/> 
    <local:Cake Width="200" 
       Height="100" 
       HorizontalAlignment="Center" 
       Filling="Pink" 
       Slice="{StaticResource FourLayeredSlice}"/> 
    <local:Cake Width="200" 
       Height="100" 
       HorizontalAlignment="Right" 
       Filling="Blue" 
       Slice="{StaticResource FourLayeredSlice}"/> 
</Grid> 

ボナペティ！