Question

我设置了一个故事板来放大和缩小窗口。这些在Blend编辑器中工作正常，但在实际运行时，它们根本不起作用。

窗口应该以与垂直方向水平相同的速率扩展/收缩。

对此有什么解决方法？

enter image description here

这是我的XAML。

<Window x:Name="window" x:Class="MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="32" Width="32" ResizeMode="NoResize" WindowStyle="None">
    <Window.Resources>
        <Storyboard x:Key="GrowFrame">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="window">
                <EasingDoubleKeyFrame KeyTime="0" Value="32"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="256">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut" Amplitude="0.25"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="window">
                <EasingDoubleKeyFrame KeyTime="0" Value="32"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="256">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut" Amplitude="0.25"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="window">
                <EasingDoubleKeyFrame KeyTime="0" Value="0.5"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut" Amplitude="0.25"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="window">
                <EasingColorKeyFrame KeyTime="0" Value="Transparent"/>
                <EasingColorKeyFrame KeyTime="0:0:0.5" Value="White">
                    <EasingColorKeyFrame.EasingFunction>
                        <BackEase EasingMode="EaseOut"/>
                    </EasingColorKeyFrame.EasingFunction>
                </EasingColorKeyFrame>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="ShrinkFrame">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="window">
                <EasingDoubleKeyFrame KeyTime="0" Value="256"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="32">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CubicEase EasingMode="EaseInOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="window">
                <EasingDoubleKeyFrame KeyTime="0" Value="256"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="32">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CubicEase EasingMode="EaseInOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="window">
                <EasingDoubleKeyFrame KeyTime="0" Value="1"/>
                <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0.5">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CubicEase EasingMode="EaseInOut"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)" Storyboard.TargetName="window">
                <EasingColorKeyFrame KeyTime="0" Value="White"/>
                <EasingColorKeyFrame KeyTime="0:0:0.5" Value="Transparent">
                    <EasingColorKeyFrame.EasingFunction>
                        <CubicEase EasingMode="EaseInOut"/>
                    </EasingColorKeyFrame.EasingFunction>
                </EasingColorKeyFrame>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>
    </Window.Resources>
    <Window.Triggers>
        <EventTrigger RoutedEvent="Mouse.MouseEnter">
            <BeginStoryboard Storyboard="{StaticResource GrowFrame}"/>
        </EventTrigger>
        <EventTrigger RoutedEvent="Mouse.MouseLeave">
            <BeginStoryboard x:Name="ShrinkFrame_BeginStoryboard" Storyboard="{StaticResource ShrinkFrame}"/>
        </EventTrigger>
    </Window.Triggers>
</Window>

Answer 1

WPF确实支持同步动画（当您尝试时）和重叠动画，其中您提供了HandoffBehavior。您可以尝试查看它是否可以作为解决方法。但是我认为这是一个已知的错误（https://connect.microsoft.com/VisualStudio/feedback/details/715415/window-width-height-animation-in-wpf-got-broken-on-net-framework-4-0）。我很震惊，现在还没有解决。

Answer 2

正如其他人所指出的那样，新框架版本中存在一个阻止同步动画的错误。但是，这是一个快速的小解决方案，对我来说非常好。这简直太简单了，所以我认为没有任何解释。它有效，而这一切都很重要：

<强> XAML：

<Window x:Class="App.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="32" Width="32" ResizeMode="NoResize" WindowStyle="None"
    MouseEnter="MouseEntered" MouseLeave="MouseLeft">
</Window>

<强>代码隐藏：

using System.Windows;
using System.Windows.Input;

namespace App
{
    public partial class MainWindow : Window
    {
        private const int MAX_WINDOW_SIZE = 256;
        private const int MIN_WINDOW_SIZE = 32;
        private const int ANIMATION_SPEED = 10;

        public MainWindow()
        {
            InitializeComponent();
        }

        private void MouseEntered(object sender, MouseEventArgs e)
        {
            while (this.Width <= MAX_WINDOW_SIZE)
            {
                this.Width += ANIMATION_SPEED;
                this.Height += ANIMATION_SPEED;
            }
        }

        private void MouseLeft(object sender, MouseEventArgs e)
        {
            while (this.Width >= MIN_WINDOW_SIZE)
            {
                this.Width -= ANIMATION_SPEED;
                this.Height -= ANIMATION_SPEED;
            }
        }
    }
}

Answer 3

或者，只需使用固定大小的透明窗口作为解决方法：

   <Window x:Name="window" x:Class="RectangleWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="RectangleWindow" Height="300" Width="300"  ResizeMode="NoResize" WindowStyle="None" 
            Background="Transparent" AllowsTransparency="True">
        <Window.Resources>
            <Storyboard x:Key="GrowFrame">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="insideRectangle">
                    <EasingDoubleKeyFrame KeyTime="0" Value="32"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="256">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <BackEase EasingMode="EaseOut" Amplitude="0.25"/>
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="insideRectangle">
                    <EasingDoubleKeyFrame KeyTime="0" Value="32"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="256">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <BackEase EasingMode="EaseOut" Amplitude="0.25"/>
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="ShrinkFrame">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="insideRectangle">
                    <EasingDoubleKeyFrame KeyTime="0" Value="256"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="32">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CubicEase EasingMode="EaseInOut"/>
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="insideRectangle">
                    <EasingDoubleKeyFrame KeyTime="0" Value="256"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="32">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CubicEase EasingMode="EaseInOut"/>
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </Window.Resources>
        <Window.Triggers>
            <EventTrigger RoutedEvent="Mouse.MouseEnter">
                <BeginStoryboard Storyboard="{StaticResource GrowFrame}"/>
            </EventTrigger>
            <EventTrigger RoutedEvent="Mouse.MouseLeave">
                <BeginStoryboard x:Name="ShrinkFrame_BeginStoryboard" Storyboard="{StaticResource ShrinkFrame}"/>
            </EventTrigger>
        </Window.Triggers>

        <Rectangle x:Name="insideRectangle" Fill="White" 
          Width="50" Height="50"
          HorizontalAlignment="Left"
          VerticalAlignment="Top">
            <Rectangle.BitmapEffect>
                <DropShadowBitmapEffect/>
            </Rectangle.BitmapEffect>      
        </Rectangle>
    </Window>

WPF和Blend：调整大小窗口不起作用

3 个答案: