Anfügen von Abhängigkeitseigenschaft an Benutzersteuerelement

Question

Wie kann ich DependencyProperty auf Rectangle füllen, so kann ich die Farbe dynamisch ändern?

<UserControl.Resources> 
    <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Grid> 
         <Rectangle Stroke="Black"> 
          <Rectangle.Fill> 
           <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
            <GradientStop Color="#FF48B6E4" Offset="0.013"/> 
            <GradientStop Color="#FF091D8D" Offset="1"/> 
           </LinearGradientBrush> 
          </Rectangle.Fill> 
         </Rectangle> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </Grid> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsFocused" Value="True"/> 
         <Trigger Property="IsDefaulted" Value="True"/> 
         <Trigger Property="IsMouseOver" Value="True"/> 
         <Trigger Property="IsPressed" Value="True"/> 
         <Trigger Property="IsEnabled" Value="False"/> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
</UserControl.Resources> 

<Grid x:Name="LayoutRoot"> 
    <Button Style="{DynamicResource ButtonStyle1}"/> 
    <TextBlock 
     x:Name="NodeName" 
     x:FieldModifier="public" 
     Text="Property" 
     Margin="8" 
     HorizontalAlignment="Center" 
     VerticalAlignment="Center" 
     TextWrapping="Wrap" 
     TextAlignment="Center" 
     FontFamily="Segoe Print" 
     FontWeight="Bold" 
     Foreground="White" 
     FontSize="40"/> 
</Grid> 

Answer 1

Warum Sie binden nicht Fill an die Background Eigenschaft des Button:

<ControlTemplate TargetType="{x:Type Button}"> 
    <Grid> 
     <Rectangle Stroke="Black" Fill="{TemplateBinding Background}" /> 
     ... 
    </Grid> 
    ... 
</ControlTemplate> 

und stellen Sie dann Background wie folgt aus:

<Button Style="{DynamicResource ButtonStyle1}"> 
    <Button.Background> 
     <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
      <GradientStop Color="#FF48B6E4" Offset="0.013"/> 
      <GradientStop Color="#FF091D8D" Offset="1"/> 
     </LinearGradientBrush> 
    </Button.Background> 
</Button> 

Answer 2

Wenn Sie eine eigene Abhängigkeitseigenschaft genannt MyProperty registriert haben in Ihrem UserControl, können Sie es auf diese Weise binden:

... 
<Rectangle Stroke="Black" Fill="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Parent.Parent.MyProperty}" /> 
... 

keine weiteren Änderungen erforderlich sind.

Dies bindet die -Eigenschaft an das übergeordnete Element des Steuerelements, dem der Stil zugewiesen ist, in Ihrem Fall die UserControl selbst.

Mit dieser Methode können Sie nicht nur an Eigenschaften eines UserControl binden, sondern auch an die Eigenschaften anderer Steuerelemente.

Answer 3

Ich würde eine Abhängigkeitseigenschaft auf YourUserControl Ansicht erstellen , etwas in der Art (Ich habe etwas von Ihrem Markup der Kürze halber entfernt):

<UserControl.Resources> 
<Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 
       <Grid> 
        <Rectangle Stroke="Black" Fill="{TemplateBinding Background}"> 
        </Rectangle> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

<Grid x:Name="LayoutRoot"> 
    <Button Style="{DynamicResource ButtonStyle1}" Background="{Binding DynamicColor}"/> 
</Grid> 

Dann in YourUserControl.xaml.cs könnten Sie Ihre Abhängigkeitseigenschaft erstellen:

private My_ViewModel _viewModel 
    { 
     get { return this.DataContext as My_ViewModel; } 
    } 

    public LinearGradientBrush DynamicColor 
    { 
     get { return (string)GetValue(DynamicColorProperty); } 
     set { SetValue(DynamicColorProperty, value); } 
    } 
    public static readonly DependencyProperty DynamicColorProperty = 
     DependencyProperty.Register("DynamicColor", typeof(LinearGradientBrush), typeof(YourUserControl), 
     new PropertyMetadata(new PropertyChangedCallback(OnDynamicColorPropertyChanged))); 

    private static void OnDynamicColorPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) 
    { 
     ((YourUserControl)d).OnTrackerInstanceChanged(e); 
    } 

    protected virtual void OnDynamicColorPropertyChanged(DependencyPropertyChangedEventArgs e) 
    { 
     this._viewModel.DynamicColor = e.NewValue; 
    } 

public class My_ViewModel : INotifyPropertyChanged 
{ 
    public LinearGradientBrush DynamicColor 
    { 
     get { return dynamicColor; } 
     set 
     { 
      if(dynamicColor != value) 
      { 
       dynamicColor = value; 
       OnPropertyChanged("DynamicColor"); 
      } 
     } 
    } 
    private LinearGradientBrush dynamicColor; 
} 

Dieser Ansatz gibt Ihnen die vollständige Kontrolle über den Wert des dynamic Eigenschaft sowie ermöglicht es Ihnen, in der Lage sein Unit-Test das Verhalten effektiv.