按鈕動畫WPF

你好我想在button做出animation，它確實增加IsMouseOver的width和height，然而，當IsMouseOver爲false，它不與動畫回到它原來的地方。按鈕動畫WPF

這裏是我的.XAML

<Grid> 
    <Button Margin="355,0,0,0" Width="100" Height="300"> 
     <Image Source="img/blue.jpg" /> 
     <Button.Style> 
      <Style TargetType="Button"> 
       <Style.Triggers> 
        <Trigger Property="IsMouseOver" Value="True"> 
         <Trigger.EnterActions> 
          <BeginStoryboard> 
           <Storyboard> 
            <ThicknessAnimation Duration="0:0:0.250" To="0" 
            Storyboard.TargetProperty="BorderThickness" /> 
            <DoubleAnimation Duration="0:0:0.550" To="320" 
            Storyboard.TargetProperty="Height" /> 
            <DoubleAnimation Duration="0:0:0.550" To="120" 
            Storyboard.TargetProperty="Width" /> 
           </Storyboard> 
          </BeginStoryboard> 
         </Trigger.EnterActions> 
        </Trigger> 
        <Trigger Property="IsMouseOver" Value="False"> 
         <Trigger.EnterActions> 
          <BeginStoryboard> 
           <Storyboard> 
            <ThicknessAnimation Duration="0:0:0.250" To="0" 
            Storyboard.TargetProperty="BorderThickness" /> 
            <DoubleAnimation Duration="0:0:0.550" To="300" 
            Storyboard.TargetProperty="Height" /> 
            <DoubleAnimation Duration="0:0:0.550" To="100" 
            Storyboard.TargetProperty="Width" /> 
           </Storyboard> 
          </BeginStoryboard> 
         </Trigger.EnterActions> 
        </Trigger> 
       </Style.Triggers> 
      </Style> 
     </Button.Style> 
    </Button> 
</Grid>

來源

2015-11-16 Valkyry

您應該將動畫Trigger.ExitActions這樣。

<Button.Style> 
    <Style TargetType="Button"> 
     <Style.Triggers> 
      <Trigger Property="IsMouseOver" Value="True"> 
       <Trigger.EnterActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <ThicknessAnimation Duration="0:0:0.250" To="0" 
                  Storyboard.TargetProperty="BorderThickness" /> 
          <DoubleAnimation Duration="0:0:0.550" To="120" 
                  Storyboard.TargetProperty="Height" /> 
          <DoubleAnimation Duration="0:0:0.550" To="120" 
                  Storyboard.TargetProperty="Width" /> 
         </Storyboard> 
        </BeginStoryboard> 
       </Trigger.EnterActions> 
       <Trigger.ExitActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <ThicknessAnimation Duration="0:0:0.250" To="0" 
                  Storyboard.TargetProperty="BorderThickness" /> 
          <DoubleAnimation Duration="0:0:0.550" To="100" 
                  Storyboard.TargetProperty="Height" /> 
          <DoubleAnimation Duration="0:0:0.550" To="100" 
                  Storyboard.TargetProperty="Width" /> 
         </Storyboard> 
        </BeginStoryboard> 
       </Trigger.ExitActions> 
      </Trigger> 
     </Style.Triggers> 
    </Style> 
</Button.Style>

來源

2015-11-16 08:05:39 bars222

就像一個魅力工作，我有另一個問題，它有可能只增長，例如從左側？ – Valkyry

如果按鈕放置在「Grid」容器中，並且它的屬性設置爲「HorizontalAlignment =」Left「Margin =」10,0,0,0「' – bars222

好極了！謝謝！ – Valkyry

回答

相關問題