Question

我希望有一个类似于Windows 8的通知窗口，它是如何从侧面飞出来的。我试过像这样实现它，但我的厚度动画似乎不起作用。

<Window x:Class="URM.Views.DesktopAlert"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="DesktopAlert" Height="184" Width="404" AllowsTransparency="True" WindowStyle="None" Background="Transparent" ShowActivated="False" Loaded="Window_Loaded">
    <Grid  >

        <!-- Notification area -->
        <Border BorderThickness="1" Background="#FFF0F0F0" BorderBrush="Transparent" CornerRadius="0">
            <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Height="144" Width="385">
                <Rectangle Fill="#FF5C5C5C" Height="25" HorizontalAlignment="Left" Margin="0,29,0,0" Name="rectangle6" Stroke="{x:Null}" VerticalAlignment="Top" Width="382" />
                <TextBlock FontFamily="Franklin Gothic Book" FontSize="17" Foreground="#FFF0F0F0" Height="23" HorizontalAlignment="Right" Margin="0,30,10,0" Name="textBlock2" Text="{Binding NewAlert.AlertHeader}" VerticalAlignment="Top" Width="333" TextAlignment="Right" />
                <TextBlock FontFamily="Franklin Gothic Book" FontSize="17" Foreground="#FF5C5C5C" Height="57" HorizontalAlignment="Right" Margin="0,56,7,0" Name="textBlock1" Text="{Binding NewAlertText}" TextAlignment="Left" VerticalAlignment="Top" Width="376" TextWrapping="Wrap" />
                <Button Content="X" Height="24" HorizontalAlignment="Left" Margin="365,-2,0,0" Name="button1" VerticalAlignment="Top" Width="14" Foreground="#FF5C5C5C" Background="{x:Null}" BorderBrush="#FFF0F0F0" BorderThickness="0" Click="button1_Click" FontSize="14" FontWeight="SemiBold" />
                <TextBlock Height="18" HorizontalAlignment="Left" Margin="0,8,0,0" Name="textBlock3" Text="ULTRA ROUTE MANAGEMENT" VerticalAlignment="Top" Foreground="#FF5C5C5C" />
                <TextBlock Height="23" HorizontalAlignment="Left" Margin="195,121,0,0" Name="textBlock4" Visibility="Collapsed" Text="{Binding NewAlert.AlertLinkId}" VerticalAlignment="Top" Width="163" Foreground="#FF5C5C5C" FontSize="18"><TextBlock.TextDecorations><TextDecoration Location="Underline" /></TextBlock.TextDecorations></TextBlock>
                <Button Height="30" Content="{Binding NewAlert.AlertLinkId}" HorizontalAlignment="Left" Margin="182,113,0,0" Name="button2" VerticalAlignment="Top" Width="186" FontSize="18" BorderBrush="{x:Null}" Background="{x:Null}" Click="button2_Click" />
            </Grid>
        </Border>

        <!-- Animation -->
        <Grid.Triggers>
            <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <ThicknessAnimation Storyboard.TargetProperty="(Grid.Margin)" Duration="0:0:20" From="1900,200,0,0" To="1400,200,0,0"/>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Completed="DoubleAnimationUsingKeyFrames_Completed">
                            <SplineDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
                            <SplineDoubleKeyFrame KeyTime="0:0:15" Value="0"/>
                        </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Grid.Triggers>



    </Grid>
</Window>

我做错了什么？我不明白为什么厚度动画不会起作用。

Answer 1

您的动画值似乎不合适。我试过以下代码

<Grid.Triggers>
            <EventTrigger RoutedEvent="FrameworkElement.Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <ThicknessAnimation Storyboard.TargetProperty="(Grid.Margin)" Duration="0:0:20" From="518,3,-518,-3" To="0"/>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" >
                            <SplineDoubleKeyFrame KeyTime="0:0:2" Value="1"/>
                            <SplineDoubleKeyFrame KeyTime="0:0:15" Value="0"/>
                        </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            </Grid.Triggers>

它对我来说很好。在设计视图中，将网格拖出窗口，您可以获得正确的从网格边缘更新的值。

有一个类似于Windows 8的通知窗口

1 个答案: