2010-09-27 116 views
0

我有一個按鈕,這是一個獨特的按鈕,他的風格應該不符合所有其他風格。所以當你將鼠標移到這個按鈕上時,它應該改變它的圖像。但它不工作,這裏是代碼...我開始WPF所以如果你能指出我什麼我做錯了會非常感激問題動畫WPF按鈕

<Button Name="RemoveButton" ClickMode="Press" BorderThickness="0" Background="Transparent" Style="{StaticResource ButtonStyle1}"> 
     <Button.Content> 
      <Grid> 
       <Image x:Name="CloseActive" x:FieldModifier="public" Height="12" VerticalAlignment="Center" Source="/HTFS.Atlas.Portfolio.PortfolioClient.WCF.Controls;component/Images/tab-close.png" Visibility="Hidden" /> 
       <Image x:Name="CloseInactive" x:FieldModifier="public" Height="12" VerticalAlignment="Center" Source="/HTFS.Atlas.Portfolio.PortfolioClient.WCF.Controls;component/Images/tab-close-inactive.png" /> 
      </Grid> 
     </Button.Content> 
     <Button.Resources> 
      <Storyboard x:Key="MouseOverAnimation"> 
       <DoubleAnimation Storyboard.TargetName="CloseActive" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.5" /> 
       <DoubleAnimation Storyboard.TargetName="CloseInactive" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:0.5" /> 
      </Storyboard> 
      <Storyboard x:Key="MouseOutAnimation"> 
       <DoubleAnimation Storyboard.TargetName="CloseInactive" Storyboard.TargetProperty="Opacity" From="0" To="1" Duration="0:0:0.5" /> 
       <DoubleAnimation Storyboard.TargetName="CloseActive" Storyboard.TargetProperty="Opacity" From="1" To="0" Duration="0:0:0.5" /> 
      </Storyboard> 
      <Style x:Key="CloseButtonStyle" TargetType="{x:Type Control}"> 
       <Style.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Trigger.EnterActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" /> 
         </Trigger.EnterActions> 
         <Trigger.ExitActions> 
          <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" /> 
         </Trigger.ExitActions> 
        </Trigger> 
       </Style.Triggers> 
      </Style> 
     </Button.Resources> 
    </Button> 

回答

1

對於CloseActive圖像,而不是使用Visibility="Hidden"嘗試Opacity="0"。 在您的動畫中,您正在調整圖像的不透明度,但仍然隱藏。

除了去除可見性屬性,嘗試將動畫直接Button.Triggers

 <Button.Triggers> 
      <EventTrigger RoutedEvent="Button.MouseEnter"> 
       <BeginStoryboard Storyboard="{StaticResource MouseOverAnimation}" /> 
      </EventTrigger> 
      <EventTrigger RoutedEvent="Button.MouseLeave"> 
       <BeginStoryboard Storyboard="{StaticResource MouseOutAnimation}" /> 
      </EventTrigger> 
     </Button.Triggers> 

觸發,因爲你不能在從風格稱爲故事板使用Storyboard.TargetName。您還必須使用事件觸發器而不是常規觸發器。 您也可以刪除CloseButtonStyle,因爲它不會被使用。

+0

沒有...它沒有工作.... – rDeeb 2010-09-27 16:32:00

+0

我更新了答案,包括將觸發器移動到Button.Triggers中,他們將在那裏正常工作。 – Garrett 2010-09-27 16:47:16

+0

網格中圖像的順序很重要。把CloseActive放在最後。 – 2010-09-27 16:47:35