wpf 倒计时 (关键帧)

XMAL

        <TextBlock
            HorizontalAlignment="Center" VerticalAlignment="Center"
            FontSize="36" FontWeight="Bold" Foreground="RoyalBlue" Loaded="CountdownTextBlock_OnLoaded"
            PreviewMouseUp="UIElement_OnPreviewMouseUp" RenderTransformOrigin=".5 .5" Text="5">
            <TextBlock.RenderTransform>
                <ScaleTransform ScaleX="5" ScaleY="{Binding RelativeSource={RelativeSource Self}, Path=ScaleX}" />
            </TextBlock.RenderTransform>
        </TextBlock>

代码


        // 这里做一个缩放动画
        var scaleanimation = new DoubleAnimation
        {
            From = 30,
            To = 0.5,
            Duration = TimeSpan.FromSeconds(1),
            RepeatBehavior = RepeatBehavior.Forever,
        };

        Storyboard.SetTarget(scaleanimation, textBlock);
        Storyboard.SetTargetProperty(scaleanimation, new PropertyPath("(UIElement.RenderTransform).(ScaleTransform.ScaleX)"));

        var storyboard = new Storyboard();
        storyboard.Children.Add(scaleanimation);

        // 就是生成 9 个显示数值的关键帧,然后每间隔一秒显示一个
        var frams = new StringAnimationUsingKeyFrames
        {
            FillBehavior = FillBehavior.HoldEnd,
        };

        const int len = 10;
        for (var idx = 0; idx < len; idx++)
        {
            var frame = new DiscreteStringKeyFrame($"{idx}") { KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(len - idx)), };
            frams.KeyFrames.Add(frame);
        }

        frams.Completed += (_, _) => storyboard.Stop();

        storyboard.Begin();
        textBlock.BeginAnimation(TextBlock.TextProperty, frams);
上一篇
下一篇