Windows phone 7 如何为页面中的每个UI元素应用旋转栅门效果

当应用程序启动时，我有一个splashscreen，然后加载mainpage.xaml。主页有很多UI元素，比如按钮和文本块。加载这个大约需要一两秒钟，所以我想一些动画可以填补这个空白。否则它可能看起来有点尴尬

Windows phone本机应用程序（如消息）在页面向右打开时使用一些默认动画，轴心标题旋转，然后接着是另一个UI，类似开门之类的东西。经过一点研究，我发现它们是默认的故障旋转栅门动画

    <toolkit:TransitionService.NavigationInTransition>
    <toolkit:NavigationInTransition>
        <toolkit:NavigationInTransition.Backward>
            <toolkit:TurnstileTransition Mode="BackwardIn"/>
        </toolkit:NavigationInTransition.Backward>
        <toolkit:NavigationInTransition.Forward>
            <toolkit:TurnstileTransition Mode="ForwardIn"/>
        </toolkit:NavigationInTransition.Forward>
    </toolkit:NavigationInTransition>
</toolkit:TransitionService.NavigationInTransition>
<toolkit:TransitionService.NavigationOutTransition>
    <toolkit:NavigationOutTransition>
        <toolkit:NavigationOutTransition.Backward>
            <toolkit:TurnstileTransition Mode="BackwardOut"/>
        </toolkit:NavigationOutTransition.Backward>
        <toolkit:NavigationOutTransition.Forward>
            <toolkit:TurnstileTransition Mode="ForwardOut"/>
        </toolkit:NavigationOutTransition.Forward>
    </toolkit:NavigationOutTransition>
</toolkit:TransitionService.NavigationOutTransition>

因此，我将上面的代码放在主页的

标记的正上方。但是页面的元素没有旋转栅门动画，如何将其应用于页面中的其他UI元素？？有人能在这方面指导我吗

---

阿尔法

您所指的是所谓的“羽毛旋转栅门”或“剥离”过渡

我知道有三种实现：

• （免费，包括来源）
• （免费，包括来源）
• （非免费，无来源）

以上这些都没有集成到工具包的转换框架中。我自己也考虑过这样做，但从来没有时间。

也有

旋转栅门的转换。这基本上是如下激活的


更改App.xaml.cs，以便
RootFrame=new TransitionFrame（）
在XAML中为动画页面包括工具箱，例如
xmlns:toolkit=“clr namespace:Microsoft.Phone.Controls；assembly=Microsoft.Phone.Controls.toolkit”

在开始标记之后包含以下XAML（与粘贴的内容类似）

您可以在任何控件上使用feather transition，就像我在本例中使用textblock一样

<toolkit:TransitionService.NavigationInTransition>
<toolkit:NavigationInTransition>
<toolkit:NavigationInTransition.Backward>
<toolkit:TurnstileFeatherTransition Mode="BackwardIn"/>
</toolkit:NavigationInTransition.Backward>
<toolkit:NavigationInTransition.Forward>
<toolkit:TurnstileFeatherTransition Mode="ForwardIn"/>
</toolkit:NavigationInTransition.Forward>
</toolkit:NavigationInTransition>
</toolkit:TransitionService.NavigationInTransition>
<toolkit:TransitionService.NavigationOutTransition>
<toolkit:NavigationOutTransition>
<toolkit:NavigationOutTransition.Backward>
<toolkit:TurnstileFeatherTransition Mode="BackwardOut"/>
</toolkit:NavigationOutTransition.Backward>
<toolkit:NavigationOutTransition.Forward>
<toolkit:TurnstileFeatherTransition Mode="ForwardOut"/>
</toolkit:NavigationOutTransition.Forward>
</toolkit:NavigationOutTransition>
</toolkit:TransitionService.NavigationOutTransition>

if you are using pivot then use this

<controls:Pivot toolkit:TurnstileFeatherEffect.FeatheringIndex="0" Title="MY APPLICATION">


如果您使用的是pivot，请使用此选项

然后在任何控件中使用该效果

<TextBlock toolkit:TurnstileFeatherEffect.FeatheringIndex="1" Text="Hello" FontSize="50" VerticalAlignment="Center" HorizontalAlignment="Center"/>


谢谢，是的，我指的是羽毛旋转栅门。但现在羽毛旋转栅门似乎只能用于列表框：（@alfah，Colin Eberhardt的“peel”动画不要求项目是列表框。请注意，不鼓励只链接答案，因此答案应该是搜索解决方案的终点（而另一个参考的中途停留，随着时间的推移，往往会过时）请考虑在这里添加一个独立的概要，将链接作为参考。
<toolkit:TransitionService.NavigationInTransition>
<toolkit:NavigationInTransition>
<toolkit:NavigationInTransition.Backward>
<toolkit:TurnstileFeatherTransition Mode="BackwardIn"/>
</toolkit:NavigationInTransition.Backward>
<toolkit:NavigationInTransition.Forward>
<toolkit:TurnstileFeatherTransition Mode="ForwardIn"/>
</toolkit:NavigationInTransition.Forward>
</toolkit:NavigationInTransition>
</toolkit:TransitionService.NavigationInTransition>
<toolkit:TransitionService.NavigationOutTransition>
<toolkit:NavigationOutTransition>
<toolkit:NavigationOutTransition.Backward>
<toolkit:TurnstileFeatherTransition Mode="BackwardOut"/>
</toolkit:NavigationOutTransition.Backward>
<toolkit:NavigationOutTransition.Forward>
<toolkit:TurnstileFeatherTransition Mode="ForwardOut"/>
</toolkit:NavigationOutTransition.Forward>
</toolkit:NavigationOutTransition>
</toolkit:TransitionService.NavigationOutTransition>

if you are using pivot then use this

<controls:Pivot toolkit:TurnstileFeatherEffect.FeatheringIndex="0" Title="MY APPLICATION">

<TextBlock toolkit:TurnstileFeatherEffect.FeatheringIndex="1" Text="Hello" FontSize="50" VerticalAlignment="Center" HorizontalAlignment="Center"/>