0

In a Windows Phone 8 app, I would like to use the animation / transition /effect used into the Windows Phone Store app when an item is selected.

Here the explanation of the animation / transition :

  • open the Official Windows Phone Store app
  • do a research
  • in the list of results click on an app
  • watch the behaviour of the title of the app (it is going on the bottom right to reappear on the page with an animation too).

I am pretty sure that I have seen this effect on several other apps. So my question could be stupid, but is there a method or something into the SDK to do this effect / animation / transition or should I do "manually" ?

Thank you in advance for your tips about the subject !

4

1 回答 1

0

我也曾多次搜索过此内容,但找不到任何需要应用的模板才能获得相同的结果。

最后,我正在创建自己的动画以获得类似的效果。我有一个 Button 控件,用于在我的列表中进行选择。对于按钮模板,我应用了我自己的样式,其中包含以下 Visual State 更改的定义:

您可以在 Blend 中创建按钮模板和样式模板。

<Style x:Key="LongListSelectorButtonStyle" TargetType="Button">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid Background="Transparent">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver"/>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(TranslateTransform.Y)"
                                                     Storyboard.TargetName="ButtonBackground"
                                                     From="0"
                                                     To="-6"
                                                     Duration="00:00:0.04"/>
                                    <DoubleAnimation Storyboard.TargetProperty="(Border.RenderTransform).(TranslateTransform.X)"
                                                     Storyboard.TargetName="ButtonBackground"
                                                     From="0"
                                                     To="2"
                                                     Duration="00:00:0.04"/>

                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>

此动画会将按钮从其当前位置向右上方移动一点。您可以将动画更改为任何其他方向。

于 2014-04-03T14:32:55.507 回答