在动画中使用时,模糊的TextBlocks [英] Blurred textblocks when used in animations

查看:202
本文介绍了在动画中使用时,模糊的TextBlocks的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在模拟使用两个画布之间的动画在Windows商店应用语义变焦效果。然而,当我缩小的的TextBlock 出现在画布上,表现为非常模糊,直到动画完成。

I am simulating the semantic zoom effect in a Windows Store app using animations between two canvas'. However when I "zoom out" the TextBlock that appear on the canvas, appear as VERY blurry until the animation completes.

这只是发生在第一个动画后,该文本是所有后续动画清晰。

This only happens for the first animation, after that the text is clear on all subsequent animations.

我怀疑一个位图缓存类型的问题,但无论是设置 CacheMode参数为位图或空没什么区别。

I suspecting a bitmap caching type issue but either setting the CacheMode to Bitmap or null makes no difference.

是否有可能控制或改变这种任何设置

Are there any settings that can control or change this?

用于动画的XAML是相当简单的,肘节能见度,然后使用一个简单DoubleAnimation是改变X - 放大器的规模;在电网包含了各种图像的Y值。每个电网视框键,里面是一个自定义的控制(而不是 TemplatedControl - 只是一个普通的老式自定义的)

The XAML used for the animation is fairly straight forward, toggle visibility and then uses a simple DoubleAnimation to change the scale of the X & Y values of the Grid which contain the various images. Inside each Grid is a ViewBox and inside that is a custom control (not a TemplatedControl - just a plain old custom one).

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="VisualStateGroup">
        <VisualStateGroup.Transitions>
            <VisualTransition From="ZoomedIn" GeneratedDuration="0" To="ZoomedOut">
                <Storyboard>
                    <DoubleAnimation Duration="0:0:0.5" To="0.01" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="ZoomedInGrid" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0:0:0.5" To="0.01" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="ZoomedInGrid" d:IsOptimized="True"/>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ZoomedInGrid">
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Collapsed</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="ZoomedOutGrid">
                        <EasingDoubleKeyFrame KeyTime="0" Value="0.01"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                    </DoubleAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="ZoomedOutGrid">
                        <EasingDoubleKeyFrame KeyTime="0" Value="0.01"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                    </DoubleAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ZoomedOutGrid">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualTransition>
            <VisualTransition From="ZoomedOut" GeneratedDuration="0" To="ZoomedIn">
                <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ZoomedInGrid">
                        <DiscreteObjectKeyFrame KeyTime="0">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Visible</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="ZoomedInGrid">
                        <EasingDoubleKeyFrame KeyTime="0" Value="0.01"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                    </DoubleAnimationUsingKeyFrames>
                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="ZoomedInGrid">
                        <EasingDoubleKeyFrame KeyTime="0" Value="0.01"/>
                        <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="1"/>
                    </DoubleAnimationUsingKeyFrames>
                    <DoubleAnimation Duration="0:0:0.5" To="0.01" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="ZoomedOutGrid" d:IsOptimized="True"/>
                    <DoubleAnimation Duration="0:0:0.5" To="0.01" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="ZoomedOutGrid" d:IsOptimized="True"/>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ZoomedOutGrid">
                        <DiscreteObjectKeyFrame KeyTime="0:0:0.5">
                            <DiscreteObjectKeyFrame.Value>
                                <Visibility>Collapsed</Visibility>
                            </DiscreteObjectKeyFrame.Value>
                        </DiscreteObjectKeyFrame>
                    </ObjectAnimationUsingKeyFrames>
                </Storyboard>
            </VisualTransition>
        </VisualStateGroup.Transitions>
        <VisualState x:Name="ZoomedIn"/>
        <VisualState x:Name="ZoomedOut">
            <Storyboard>
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ZoomedOutGrid">
                    <DiscreteObjectKeyFrame KeyTime="0">
                        <DiscreteObjectKeyFrame.Value>
                            <Visibility>Visible</Visibility>
                        </DiscreteObjectKeyFrame.Value>
                    </DiscreteObjectKeyFrame>
                </ObjectAnimationUsingKeyFrames>
                <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="ZoomedInGrid">
                    <DiscreteObjectKeyFrame KeyTime="0">
                        <DiscreteObjectKeyFrame.Value>
                            <Visibility>Collapsed</Visibility>
                        </DiscreteObjectKeyFrame.Value>
                    </DiscreteObjectKeyFrame>
                </ObjectAnimationUsingKeyFrames>
            </Storyboard>
        </VisualState>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>



我有一个更简单的场景重现了类似的问题,代码可以从的 GitHub上并看到问题存在这里是一个的视频,注意模糊的文本,当我们从缩小恢复到正常的状态去

I have recreated a similar issue in a much simpler scenario, the code can be obtained from GitHub and to see the issue there here is a video, note the blurry text when we go from zoomed out back to normal state.

同样的问题:

  • Same problem with TextBlocks however the fixes of placing inside canvas and/or rectangle, do not help: http://social.msdn.microsoft.com/Forums/en-US/winappswithcsharp/thread/ddd9f28e-f682-4070-9a48-5b584689df0c
  • Similar issue however it seems to affect a Border element: WinRT (C#/XAML) Scale without blurring
  • Similar issue but not solutions in it: http://social.msdn.microsoft.com/Forums/en-US/winappswithcsharp/thread/73ff7a75-58bf-4e01-807d-7aeb32918333
  • Similar issue http://social.msdn.microsoft.com/Forums/en-US/winappswithcsharp/thread/78d5b388-45ba-4131-9ca8-061f183d7774

推荐答案

这是由设计。文本不中动画/变焦完全呈现。一旦完成,全面渲染调用。这是常见的几乎每一个平台上。如果这是杀了你,你可以动画的图像(这基本上是Direct3D是做)。合理?我希望这回答了你的问题。

This is by design. Text is not full rendered during animations/zooms. Once complete, the comprehensive rendering is invoked. This is common on almost every platform. If this is killing you, you can animate an image (which is basically what Direct3D is doing). Make sense? I hope this answers your question.

这篇关于在动画中使用时,模糊的TextBlocks的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆