템플릿 배경 및 전경색에 바인딩?

Question

버튼에 대한 간단한 ControlTemplate을 만들고 있습니다. 2 색 그라디언트를 그려서 두 색을 묶어서 템플릿에 하드 코딩 할 필요가 없습니다. 그러나 배경 및 전경은 색상뿐 아니라 브러쉬이기 때문에 이것이 제대로 작동하는지 확신 할 수 없습니다.

아무에게도이를 알릴 수있는 좋은 방법이 있습니까? 그것은 충분히 간단 해 보인다. 감사.

<ControlTemplate x:Key="ElipseButton" TargetType="Button"> 
    <Ellipse> 
    <Ellipse.Fill> 
    <RadialGradientBrush RadiusX="1" RadiusY="1" GradientOrigin="0.7,0.8"> 
       <GradientStop Color="White" Offset="0"/> 
    <GradientStop Color="Black" Offset="1"/> 
    </RadialGradientBrush> 
    </Ellipse.Fill> 
    </Ellipse> 
</ControlTemplate> 

'Black'및 'White'색상을 TemplateBindings로 바꾸고 싶습니다.

Answer 1

첨부 된 속성을 사용하여 버튼에 사용할 수 있습니다

public class ColorExtensions 
{ 
    public static readonly DependencyProperty ColorFrontProperty = DependencyProperty.RegisterAttached(
     "ColorFront", 
     typeof(Color), 
     typeof(ColorExtensions), 
     new UIPropertyMetadata(Colors.White)); 

    public static Color GetColorFront(DependencyObject target) 
    { 
     return (Color)target.GetValue(ColorFrontProperty); 
    } 

    public static void SetColorFront(DependencyObject target, Color value) 
    { 
     target.SetValue(ColorFrontProperty, value); 
    } 

    public static readonly DependencyProperty ColorBackProperty = DependencyProperty.RegisterAttached(
     "ColorBack", 
     typeof(Color), 
     typeof(ColorExtensions), 
     new UIPropertyMetadata(Colors.Black)); 

    public static Color GetColorBack(DependencyObject target) 
    { 
     return (Color)target.GetValue(ColorBackProperty); 
    } 

    public static void SetColorBack(DependencyObject target, Color value) 
    { 
     target.SetValue(ColorBackProperty, value); 
    } 
} 

그런 다음 인스턴스에서 이러한 설정과 일반 바인딩을 사용하여 템플릿에 액세스 할 수 있습니다 (TemplateBindings 여기에 작동하지 않습니다) :

<Button Content="Click Me" local:ColorExtensions.ColorFront="Red"> 
    <Button.Template> 
     <ControlTemplate TargetType="Button"> 
      <Ellipse> 
       <Ellipse.Fill> 
        <RadialGradientBrush RadiusX="1" RadiusY="1" GradientOrigin="0.7,0.8"> 
         <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(local:ColorExtensions.ColorFront)}" Offset="0"/> 
         <GradientStop Color="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=(local:ColorExtensions.ColorBack)}" Offset="1"/> 
        </RadialGradientBrush> 
       </Ellipse.Fill> 
      </Ellipse> 
     </ControlTemplate> 
    </Button.Template> 
</Button> 

Answer 2

개인적으로 전체 브러시를 템플릿에 넣기 만하면됩니다. 브러시를 방사형 그래디언트에서 선형 그래디언트로 변경 (템플릿 변경을 통해) 할 수 있으므로 훨씬 더 많은 컨트롤을 제공합니다.