WinRT(C#/ XAML)缩放没有模糊

我已经把一个基本的animation,从0.1到1.0(X&Y)的控制缩放。 我始终看到的问题是这些控件在最终的静态状态下“模糊”。

一个例子是我拿的这个屏幕凸轮。

手表屏幕凸轮

我不确定是什么原因造成的。 它是一个默认的animation/故事板,你可以通过Blend生成。

<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="UIBorder" > <EasingDoubleKeyFrame KeyTime="0" Value="0.2"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseInOut"/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> <EasingDoubleKeyFrame KeyTime="0:0:1.4" Value="1"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseInOut" Amplitude="3"/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> 

所述控制:

 <Grid x:Name="UIBorder" Width="555" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5"> <Grid.RenderTransform> <CompositeTransform ScaleY="0.2" ScaleX="0.2"/> </Grid.RenderTransform> <Grid Margin="122,0,0,0" RenderTransformOrigin="0.5,0.5" > <Border Background="#FF343434" ManipulationMode="None" IsDoubleTapEnabled="False" IsHoldingEnabled="False" IsRightTapEnabled="False" IsTapEnabled="False" RenderTransformOrigin="0.5,0.5" > <Border.RenderTransform> <CompositeTransform/> </Border.RenderTransform> </Border> </Grid> <Image HorizontalAlignment="Left" VerticalAlignment="Center" Source="ms-appx:///Assets/Chrome/LoginSeal.png" Stretch="None"/> </Grid> 

注意:

  • 我已经从两个独立的来源(即不是硬件特定的)在Windows 8 PC和Surface RT平板上证实了这种模糊。
  • 我已经试过BitmapCache,看看是否有任何改变(如果会变得更糟)。

Solutions Collecting From Web of "WinRT(C#/ XAML)缩放没有模糊"

看起来像一个错误。 显然,WinRT在动画过程中会自动将CacheMode转换为BitmapCache,并以低标度缓存对象。 虽然我不能复制你现在看到的,但是在动画处理TextBlocks的投影属性时,在Windows 8的预发布版本中也有类似的问题。 我认为可能发生的情况是,在开始动画之前使用控件的最大尺寸来确定用于BitmapCache的RenderAtScale属性值(在WinRT中不可用,但在Silverlight或WPF中存在,它似乎是它的一个版本存在于WinRT中,它只是不暴露给API的用户)。 一个解决方法可能会以某种方式在加载时将位图的ScaleX / ScaleY值设置为1,然后在位图第一次显示之前回到0.2。 或者,您可以将控件的不透明度设置为0,并在动画开始之前将其缩放到1,然后在将缩放比例设置为0.2之后淡入控件。 如果你真的需要在动画之前出现小的那个 – 你可以有两个控制副本 – 一个在动画开始之后立即消失的小副本,另一个从大而不可见(或者在不透明度=“0.005” ),并且在动画开始时非常快地动画到不透明度1,比例0.2。

这对我来说看起来很好:

 <Page x:Class="App76.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:App76" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Page.Resources> <Storyboard x:Name="anim" SpeedRatio="0.2"> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="UIBorder"> <EasingDoubleKeyFrame KeyTime="0" Value="0.2"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseInOut" /> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> <EasingDoubleKeyFrame KeyTime="0:0:1.4" Value="1"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseInOut" Amplitude="3" /> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="UIBorder"> <EasingDoubleKeyFrame KeyTime="0" Value="0.2"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseInOut" /> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> <EasingDoubleKeyFrame KeyTime="0:0:1.4" Value="1"> <EasingDoubleKeyFrame.EasingFunction> <BackEase EasingMode="EaseInOut" Amplitude="3" /> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> </Storyboard> </Page.Resources> <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> <Grid x:Name="UIBorder" Width="555" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5"> <!--<Grid.CacheMode> <BitmapCache /> </Grid.CacheMode>--> <Grid.RenderTransform> <CompositeTransform x:Name="ct" ScaleY="0.2" ScaleX="0.2" /> </Grid.RenderTransform> <Grid Margin="122,0,0,0" RenderTransformOrigin="0.5,0.5"> <Border Background="#FF343434" ManipulationMode="None" IsDoubleTapEnabled="False" IsHoldingEnabled="False" IsRightTapEnabled="False" IsTapEnabled="False" RenderTransformOrigin="0.5,0.5"> <Border.RenderTransform> <CompositeTransform /> </Border.RenderTransform> </Border> </Grid> <Image HorizontalAlignment="Left" VerticalAlignment="Center" Source="ms-appx:///Assets/SplashScreen.png" Stretch="None" /> </Grid> <Button VerticalAlignment="Bottom" HorizontalAlignment="Left" Content="TEST" Click="ButtonBase_OnClick" /> </Grid> </Page> using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; namespace App76 { public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); ct.ScaleX = 1; ct.ScaleY = 1; this.Loaded += MainPage_Loaded; } void MainPage_Loaded(object sender, RoutedEventArgs e) { ct.ScaleX = 0.2; ct.ScaleY = 0.2; } private void ButtonBase_OnClick(object sender, RoutedEventArgs e) { anim.Begin(); } } } 

为UIBorder设置UseLayoutRounding =“True”