Переход выбранного элемента в списке Windows Phone

В приложении Windows Phone 8 я хотел бы использовать анимацию/переход/эффект, используемые в приложении Магазина Windows Phone при выборе элемента.

Вот объяснение анимации/перехода:

  • откройте официальное приложение Windows Phone Store
  • провести исследование
  • в списке результатов нажмите на приложение
  • следите за поведением заголовка приложения (оно также появится в правом нижнем углу страницы с анимацией).

Я почти уверен, что видел этот эффект в нескольких других приложениях. Итак, мой вопрос может быть глупым, но есть ли в SDK способ или что-то еще, чтобы сделать этот эффект/анимацию/переход, или мне нужно сделать «вручную»?

Заранее спасибо за советы по теме!


person rolandl    schedule 03.04.2014    source источник


Ответы (1)


Я тоже искал это несколько раз назад, но не смог найти ни одного шаблона, который мне нужно применить, чтобы получить тот же результат.

В конце концов, я создавал свои собственные анимации, чтобы получить похожий эффект. У меня есть элемент управления Button, который используется для выбора в моем списке. Для шаблона кнопки я применил свой собственный стиль, который содержит следующее определение изменений визуального состояния:

В 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>

Эта анимация переместит кнопку немного вправо вверх от ее текущего положения. Вы можете изменить анимацию на любое другое направление.

person eX0du5    schedule 03.04.2014