2 つのキャンバス間のアニメーションを使用して、Windows ストア アプリでセマンティック ズーム効果をシミュレートしています。TextBlock
ただし、キャンバスに表示されるものを「ズームアウト」すると、アニメーションが完了するまで非常にぼやけて表示されます。
これは最初のアニメーションでのみ発生し、その後のすべてのアニメーションでテキストがクリアになります。
ビットマップのキャッシュ タイプの問題が疑わCacheMode
れますが、ビットマップまたは null に設定しても違いはありません。
これを制御または変更できる設定はありますか?
アニメーションに使用される XAML は非常に単純で、可視性を切り替えてから、単純な DoubleAnimation を使用してGrid
、さまざまな画像を含む の X および Y 値のスケールを変更します。それぞれの内部にGrid
は があり、ViewBox
その内部にはカスタム コントロールがあります (TemplatedControl
単純な古いカスタム コントロールではありません)。
<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から入手できます。問題を確認するには、ここにビデオがあります。ズームアウトから通常の状態に戻ると、テキストがぼやけます。
同様の問題:
- ただし、キャンバスおよび/または長方形内に配置するという修正と同じ問題は解決し
TextBlocks
ません : Border
同様の問題ですが、要素 に影響を与えるようです: WinRT (C#/XAML) Scale without blurring- 同様の問題がありますが、解決策はありません: http://social.msdn.microsoft.com/Forums/en-US/winappswithcsharp/thread/73ff7a75-58bf-4e01-807d-7aeb32918333
- 同様の問題http://social.msdn.microsoft.com/Forums/en-US/winappswithcsharp/thread/78d5b388-45ba-4131-9ca8-061f183d7774