Изменение стиля объектов внутри controltemplate

Question

Я создал новый элемент управления, который содержит в себе прямоугольник и некоторые визуальные состояния.

<Style TargetType="Button" x:Key="banda"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="Button"> 
         <Grid> 

          <Grid.ColumnDefinitions > 
           <ColumnDefinition Width="*"/> 
          </Grid.ColumnDefinitions> 
          <Grid.RowDefinitions > 
           <RowDefinition Height="*"/> 
          </Grid.RowDefinitions> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="CommonStates"> 
            <VisualStateGroup.Transitions> 
             <VisualTransition GeneratedDuration="0:0:0.1"/> 
            </VisualStateGroup.Transitions> 
            <VisualState x:Name="Pressed"> 
             <Storyboard> 
              <ColorAnimation Duration="0" To="#FF47B215" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="Normal"> 
             <Storyboard> 
             <ColorAnimation Duration="0" To="{Binding Background, ElementName=Border}" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="Disabled"/> 
            <VisualState x:Name="MouseOver"> 
             <Storyboard> 
              <ColorAnimation Duration="0" To="#FF86B072" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/> 
             </Storyboard> 
            </VisualState> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
         <Border x:Name="Border" Background="purple" StrokeThickness="5" Stroke="{Binding Background, ElementName=Border}"/> 
         </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
     </Style> 

Этого контроль многократно используется в моей странице приложения, и я хотел бы прямоугольник, чтобы иметь различные значения цветов каждый раз, когда он используется, например, при нажатии кнопки, прямоугольник меняет цвета.

У меня нет идеи, как изменить свойство прямоугольника внутри кода C#. Может кто-нибудь помочь мне с форматированием?

Answer 1

Нет пота, просто создайте эту функциональность в шаблоне, привязывая его к Background;

<Style TargetType="Button" x:Key="banda"> 
      <Setter Property="Background" Value="Purple"/> 
      <Setter Property="BorderThickness" Value="5"/> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="Button"> 
         <Grid> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="CommonStates"> 
            <VisualStateGroup.Transitions> 
             <VisualTransition GeneratedDuration="0:0:0.1"/> 
            </VisualStateGroup.Transitions> 
            <VisualState x:Name="Pressed"> 
             <Storyboard> 
              <ColorAnimation Duration="0" To="#FF47B215" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="Normal"> 
             <Storyboard> 
             <ColorAnimation Duration="0" To="{Binding Background, ElementName=Border}" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="Disabled"/> 
            <VisualState x:Name="MouseOver"> 
             <Storyboard> 
              <ColorAnimation Duration="0" To="#FF86B072" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/> 
             </Storyboard> 
            </VisualState> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
         <Border x:Name="Border" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{Binding Background, ElementName=Border}"/> 
         </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Так этот путь, по умолчанию цвет будет фиолетовый (как видно в Setter декларации), и вы можете изменить его на лету, как;

<Button Style="{StaticResource banda}" Content="Blah" Background="Orange"/> 

Однако; обычно рекомендуется, чтобы вы не привязывали ко многим изменениям состояния к одному объекту. Например, если вы загрузите свой шаблон в Expression blend, и вы посмотрите на свою панель States при редактировании шаблона, вы увидите значок восклицательного знака треугольника, предупреждающий вас о том, что его не рекомендуется устанавливать слишком много состояний вокруг одного объекта в ваш шаблон. Большую часть времени его штраф, хотя и будет работать как есть. Также у вас было Stroke & StrokeThickness, примененное к Border, которое не имеет этих свойств зависимости, поэтому в примере я зафиксировал это также на BorderThickness и BorderBrush. О, и вы, вероятно, также найдете, как у вас есть ваши свойства, поэтому взаимоотношения связаны с тем, что вы будете беспокоиться. Отбросьте такие вещи;

      <VisualState x:Name="Normal"> 
           <Storyboard> 
           <ColorAnimation Duration="0" To="{Binding Background, ElementName=Border}" Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" Storyboard.TargetName="Border" d:IsOptimized="True"/> 
           </Storyboard> 
          </VisualState> 

и вместо того, чтобы просто привязать его к Background собственности через {TemplateBinding Background} вместо этого. Я бы предложил посмотреть некоторые шаблоны управления по умолчанию для кнопок и сравнить их с тем, как они используются.

Надеюсь, это поможет.