2015-01-14 27 views
4

我試圖在XAML中設置樣式。下面你可以看到我迄今創建的內容。ControlTemplate.Triggers中更靈活的setter

<Style TargetType="{x:Type Button}"> 
    <Setter Property="Background" Value="#f2f2f7"/> 
    <Setter Property="Padding" Value="6,4"/> 
    <Setter Property="Foreground" Value="#222222" /> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <Border CornerRadius="1" Background="{TemplateBinding Background}" BorderThickness="1" BorderBrush="#b1b1c0"> 
        <Border CornerRadius="1" Background="{TemplateBinding Background}" BorderThickness="1,1,1,0" BorderBrush="#f8f8fa" Padding="{TemplateBinding Padding}"> 
         <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"> 
         </ContentPresenter> 
        </Border> 
       </Border> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Setter Property="Background" Value="#8e8eba" /> 
         <Setter Property="Foreground" Value="#f2f291" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

的問題是,此按鈕有一個套在另外兩個<Border>元件。當IsMouseOver觸發器被激活時,我想要有不同的BorderBrush=""屬性。例如,當我將鼠標放在按鈕上時,內部邊框會變成紅色,外部邊框變成藍色。

你能幫我嗎?

回答

5

嘗試設置名稱爲邊框和觸發器中使用TargetName這樣的:

<Style TargetType="{x:Type Button}"> 
    <Setter Property="Background" Value="#f2f2f7"/> 
    <Setter Property="Padding" Value="6,4"/> 
    <Setter Property="Foreground" Value="#222222" /> 

    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="Button"> 
       <Border Name="OuterBorder" CornerRadius="1" Background="{TemplateBinding Background}" BorderThickness="1" BorderBrush="#b1b1c0"> 
        <Border Name="InnerBorder" CornerRadius="1" Background="{TemplateBinding Background}" BorderThickness="1,1,1,0" BorderBrush="#f8f8fa" Padding="{TemplateBinding Padding}"> 
         <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" /> 
        </Border> 
       </Border> 

       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Setter Property="Background" Value="#8e8eba" /> 
         <Setter Property="Foreground" Value="#f2f291" /> 

         <!-- Here use TargetName --> 
         <Setter TargetName="OuterBorder" Property="BorderBrush" Value="Red" /> 
         <Setter TargetName="InnerBorder" Property="BorderBrush" Value="Blue" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

Some notes

  • 的TargetName只能在<ControlTemplate.Triggers>進行設置,而不是在<Style.Triggers>
  • 的TargetName工作只有在一個ControlTemplate部分
3

爲邊框命名並在觸發器設置器上使用TargetName屬性。

<Setter TargetName="MyBorderName" Property="BorderBrush" Value="Red" />