silverlight - 淡入/淡出动画导致 ScrollViewer 的内容模糊

Question

这是我的代码，它可以在 Windows Phone 8 模拟器上运行。

• XAML：

  <Grid x:Name="ContentPanel">
      <ScrollViewer>
          <StackPanel>
              <Button Content="Sample Content" Click="ButtonBase_OnClick">
                  <Button.Style>
                      <Style TargetType="Button">
                          <Setter Property="Width" Value="400"></Setter>
                          <Setter Property="Height" Value="100"></Setter>
                          <Setter Property="HorizontalContentAlignment" Value="Center"></Setter>
                          <Setter Property="VerticalContentAlignment" Value="Center"></Setter>
                          <Setter Property="Template">
                              <Setter.Value>
                                  <ControlTemplate TargetType="Button">
                                      <Grid>
                                          <Border CornerRadius="10,10,10,10"
                                                  Background="{StaticResource PhoneAccentBrush}"
                                                  BorderBrush="#FF000000" BorderThickness="1,1,1,1"
                                                  x:Name="border" RenderTransformOrigin="0.5,0.5">
                                              <Border.RenderTransform>
                                                  <TransformGroup>
                                                      <ScaleTransform />
                                                      <SkewTransform />
                                                      <RotateTransform />
                                                      <TranslateTransform />
                                                  </TransformGroup>
                                              </Border.RenderTransform>
                                              <ContentPresenter x:Name="contentPresenter"
                                                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center" />
                                          </Border>
                                      </Grid>
                                  </ControlTemplate>
                              </Setter.Value>
                          </Setter>
                      </Style>
                  </Button.Style>
              </Button>
              <TextBlock TextWrapping="Wrap">
                  Lorem ipsum Pariatur sint occaecat sunt sint do labore adipisicing 
                  eiusmod incididunt culpa laborum consequat magna dolor labore sunt sed 
                  ullamco anim adipisicing do pariatur ea esse qui sint magna in voluptate 
                  Duis id ut anim id.
              </TextBlock>
          </StackPanel>
      </ScrollViewer>
  </Grid>
  

• C＃：

  private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
  {
      var storyb = new Storyboard();
      Duration Show_Duration = new Duration(new TimeSpan(0, 0, 0, 0, 450));
      DoubleAnimation m_OpacityAni = new DoubleAnimation();
      m_OpacityAni.Duration = Show_Duration;
      m_OpacityAni.From = 1.0;
      m_OpacityAni.To = 0.0;
      m_OpacityAni.AutoReverse = true;
  
      storyb.Children.Add(m_OpacityAni);
  
      Storyboard.SetTarget(m_OpacityAni, ContentPanel);
      Storyboard.SetTargetProperty(m_OpacityAni, new PropertyPath("(UIElement.Opacity)"));
  
      storyb.Begin();
  }
  

现在，因为内容的高度小于名为“ContentPanel”的Grid，所以当动画开始时，所有的内容都会淡入淡出而不会模糊。但是，如果我复制该 TextBlock 以使 ScrollViewer 更长（使其可滚动），然后再次运行动画。这些内容将显示模糊，直到结束。

如果我删除 ScrollViewer 标记，所有内容都将清晰显示。

虽然它不会造成一些不好的副作用，但我想知道它为什么会这样显示。

期待您的回答。谢谢！

Answer 1

也许它ScrollViewer.CacheMode = CacheMode.BitmapCache在动画期间设置。