xaml - 如何在 UWP 中对 TextBlock 的比例进行动画处理

标签 xaml animation text uwp scale

当我使用 Storyboard 放大 TextBlock 时,它会在缩放时像素化,并且仅在完成时重新渲染。

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="TextBlock" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)">
      <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1.5"/>

有没有办法在每一帧重新渲染 TextBlock?

最佳答案

我找到了一个解决方案,虽然它不再与 TextBlock 有关,但对我来说它有效:

    private void CreateText(string text)
    {
        _compositor = ElementCompositionPreview.GetElementVisual(this).Compositor;
        CreateDevice();

        _spriteTextVisual = _compositor.CreateSpriteVisual();
        _spriteTextVisual.Size = new Vector2(512, 512);

        _drawingTextSurface = _graphicsDevice.CreateDrawingSurface(new Size(512, 512), DirectXPixelFormat.B8G8R8A8UIntNormalized, DirectXAlphaMode.Premultiplied);

        using (var ds = CanvasComposition.CreateDrawingSession(_drawingTextSurface))
        {
            ds.Clear(Colors.Transparent);
            ds.DrawText(text, new Rect(0, 0, 512, 512), Colors.Black, new CanvasTextFormat
            {
                FontSize = 32,
                FontWeight = FontWeights.Light,
                VerticalAlignment = CanvasVerticalAlignment.Top,
                HorizontalAlignment = CanvasHorizontalAlignment.Center,
                LineSpacing = 32
            });
        }

        _surfaceTextBrush = _compositor.CreateSurfaceBrush(_drawingTextSurface);

        _spriteTextVisual.Brush = _surfaceTextBrush;

        ElementCompositionPreview.SetElementChildVisual(this, _spriteTextVisual);
    }

    private void CreateDevice()
    {
        _device = CanvasDevice.GetSharedDevice();
        _device.DeviceLost += Device_DeviceLost;

        if (_graphicsDevice == null)
        {
            _graphicsDevice = CanvasComposition.CreateCompositionGraphicsDevice(_compositor, _device);
        }
        else
        {
            CanvasComposition.SetCanvasDevice(_graphicsDevice, _device);
        }
    }

    private async void Device_DeviceLost(CanvasDevice sender, object args)
    {
        _device.DeviceLost -= Device_DeviceLost;
        await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, CreateDevice);
    }

只需将此文本设为最大比例即可。

关于xaml - 如何在 UWP 中对 TextBlock 的比例进行动画处理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39346561/

相关文章:

c# - 如何动态更改 UWP 的 XAML 资源值

jquery - 使用 Jquery 通过单击移动相应的 Div

ios - 动画 block - 完成立即触发

正则表达式将一行中的第一个小写字符替换为大写

r - 如何接受不带引号的文本/字符参数

wpf - "Prefix ' .... ' does not map to a namespace",设计师错误?

c# - 代码隐藏中的 WPF UserControl 动画不适用于 ContentPresenter

c# - 不同命名空间中的 XAML 转换器

ios - 动画播放与否取决于链接动画的 animationRepeatCount

javascript - 将 window.getSelection().extentOffset 引用到某个 HTML 元素