2012-04-10 89 views
0

我正在創建一個按鈕樣式。粘貼到一個窗口看到的想法:WPF陰影觸發器

<Style x:Key="SelectionButton3" 
     TargetType="{x:Type Button}"> 

    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 

       <Grid HorizontalAlignment="Stretch" 
         VerticalAlignment="Stretch" 
         ClipToBounds="False"> 

        <Grid.RowDefinitions> 
         <RowDefinition Height="75"/> 
        </Grid.RowDefinitions> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="100"/> 
         <ColumnDefinition Width="*"/> 
        </Grid.ColumnDefinitions> 

        <Border x:Name="TheBorder" 
          BorderThickness="0,1.5,1.5,1.5" 
          CornerRadius="3" 
          Background="SteelBlue" 
          Height="35" 
          Grid.Column="1" 
          Grid.Row="0" 
          Margin="-31" 
          BorderBrush="DarkSlateBlue"> 

         <Border.BitmapEffect> 
          <DropShadowBitmapEffect x:Name="BorderShadow" 
                ShadowDepth="0"/> 
         </Border.BitmapEffect> 

        </Border> 

        <Rectangle Fill="SteelBlue" 
           Stroke="DarkSlateBlue" 
           Grid.Row="0" 
           Grid.Column="0"> 

         <Rectangle.LayoutTransform> 
          <RotateTransform Angle="-45" /> 
         </Rectangle.LayoutTransform> 

         <Rectangle.BitmapEffect> 
          <DropShadowBitmapEffect ShadowDepth="5"/> 
         </Rectangle.BitmapEffect> 

        </Rectangle> 

        <ContentPresenter x:Name="ContentArea" 
             VerticalAlignment="Center" 
             HorizontalAlignment="Center" 
             Content="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}" /> 
       </Grid> 

      </ControlTemplate> 
     </Setter.Value> 

    </Setter> 

    <Setter Property="Foreground" 
      Value="LightGray" /> 
    <Setter Property="FontFamily" 
      Value="Segoe UI" /> 



</Style> 

<Button Click="Button_Click" 
     Style="{StaticResource SelectionButton3}" 
     Width="185"> 

</Button> 

我想什麼有發生的是邊框陰影,以當鼠標懸停在邊界或矩形上時出現。我知道我需要一個觸發器,但我不確定在哪裏&該怎麼做。

有人能指出我正確的方向嗎?

感謝

回答

1
<Style x:Key="SelectionButton3" 
     TargetType="{x:Type Button}"> 

    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type Button}"> 

       <Grid HorizontalAlignment="Stretch" 
         VerticalAlignment="Stretch" 
         ClipToBounds="False"> 

        <Grid.RowDefinitions> 
         <RowDefinition Height="75"/> 
        </Grid.RowDefinitions> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="100"/> 
         <ColumnDefinition Width="*"/> 
        </Grid.ColumnDefinitions> 

        <Border x:Name="TheBorder" 
          BorderThickness="0,1.5,1.5,1.5" 
          CornerRadius="3" 
          Background="SteelBlue" 
          Height="35" 
          Grid.Column="1" 
          Grid.Row="0" 
          Margin="-31" 
          BorderBrush="DarkSlateBlue"> 
        </Border> 

        <Rectangle Name="rect" Fill="SteelBlue" 
           Stroke="DarkSlateBlue" 
           Grid.Row="0" 
           Grid.Column="0"> 

         <Rectangle.LayoutTransform> 
          <RotateTransform Angle="-45" /> 
         </Rectangle.LayoutTransform> 

        </Rectangle> 

        <ContentPresenter x:Name="ContentArea" 
             VerticalAlignment="Center" 
             HorizontalAlignment="Center" 
             Content="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}" /> 
       </Grid> 
       <ControlTemplate.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
        <Setter TargetName="TheBorder" Property="BitmapEffect"> 
         <Setter.Value> 
         <DropShadowBitmapEffect ShadowDepth="0" /> 
         </Setter.Value> 
        </Setter> 
        <Setter TargetName="rect" Property="BitmapEffect"> 
         <Setter.Value> 
         <DropShadowBitmapEffect ShadowDepth="5"/> 
         </Setter.Value> 
        </Setter> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Setter.Value> 

    </Setter> 

    <Setter Property="Foreground" 
      Value="LightGray" /> 
    <Setter Property="FontFamily" 
      Value="Segoe UI" /> 



</Style> 

需要注意的是,除非你使用.NET 3.0或3.5 SP1之前,您應該使用Effect而不是BitmapEffectBitmapEffect屬性在3.5 SP1中已被棄用

+0

謝謝。那樣做了 – CoderForHire 2012-04-10 21:54:06