Question

我正在将EntranceThemeTransition动画应用于TextBlock。 TextBlock的样式为PageHeaderTextStyle，其中包含RenderTransform。我遇到的问题是RenderTransform应用Translation效果，直到完成动画播放后才会实际渲染。因此，它看起来很奇怪，因为动画滚动控件，然后突然翻译将文本按到位。有谁知道为什么会这样？

有没有办法在考虑翻译的情况下播放动画？

变换：

<Setter Property="RenderTransform">
    <Setter.Value>
        <TranslateTransform X="-2" Y="8"/>
    </Setter.Value>
</Setter>

的TextBlock：

<TextBlock x:Name="pageTitle" Grid.Column="1" Text="{Binding Title}" Style="{StaticResource PageHeaderTextStyle}">
    <TextBlock.Transitions>
        <TransitionCollection>
            <EntranceThemeTransition/>
        </TransitionCollection>
    </TextBlock.Transitions>
</TextBlock>

Answer 1

我刚刚遇到了完全相同的问题。解决问题的方法是嵌套距离TextBlock Grid一个级别，并在其上进行转换，例如使用第二个Grid。

转换将转换应用于其每个子节点，但是它们可能具有的任何转换都会暂时替换，直到动画完成后才会导致令人讨厌的快照。当之后应用原始变换时。

在以下示例中，将运行转换，替换TextBlock的转换，然后在转换结束后，将应用原始转换。您会看到＆＃39; snap＆＃39;：

<Grid Style="{StaticResource LayoutRootStyle}">
    <TextBlock Text="Header" Style="{StaticResource PageHeaderTextStyle}"
        Margin="0,0,0,40"/>
</Grid>

在下一个示例中，转换运行并且转换应用于Grid，使TextBlock转换不受影响。没有＆＃39; snap＆＃39;：

<Grid Style="{StaticResource LayoutRootStyle}">
    <Grid>
        <TextBlock Text="Header" Style="{StaticResource PageHeaderTextStyle}"
            Margin="0,0,0,40"/>
    </Grid>
</Grid>

希望这有帮助！

Answer 2

从你的话来看，看起来像EntranceThemeTransition动画你的TextBlock的转换。最简单的方法是将入口转换放在父元素上，或者将转换放在一个元素上。你可以简单地将TextBlock包装在一个Grid中来完成它。

RenderTransform在TextBlock上的EntranceThemeTransition之后发生

2 个答案: