WP7 как использовать инструментарий TransitionFrame?

Я загрузил самую последнюю версию Windows.Phone.Controls.Toolkit и в app.xaml.cs изменил

RootFrame = new PhoneApplicationFrame();

to

RootFrame = new TransitionFrame();

Я ожидал каких-то изменений в переходе между страницами, но вообще ничего не произошло.

Нужно ли мне делать что-то еще, чтобы добиться более интересных переходов?


transitions windows-phone-7
person Sam    schedule 12.06.2012    source источник

Ответы (4)


arrow_upward
8
arrow_downward

Вы должны добавить ссылку xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

и попробуйте эффект турникета, добавив:

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

на каждую страницу, которую вы хотите иметь эффект перехода.

Или вы можете попробовать другие эффекты, такие как: слайд, поворот, поворот и вращение.

person Mia    schedule 12.06.2012
comment
О, я совершенно пропустил, что мне нужно что-то добавлять на каждую страницу. Спасибо!! - person Sam; 12.06.2012

arrow_upward
5
arrow_downward

Для потомков:

Если вы не хотите писать весь этот XAML для каждой страницы, создайте вспомогательный класс и примените переходы в конструкторе своей страницы.

Transitions.cs

public class Transitions {

    /// <summary>
    /// Set the Turnstile transition for this UIElement
    /// </summary>
    /// <param name="element"></param>
    public static void UseTurnstileTransition(UIElement element)
    {
        TransitionService.SetNavigationInTransition(element,
            new NavigationInTransition() {
                Backward = new TurnstileTransition() {
                    Mode = TurnstileTransitionMode.BackwardIn
                },
                Forward = new TurnstileTransition() {
                    Mode = TurnstileTransitionMode.ForwardIn
                }
            }
        );

        TransitionService.SetNavigationOutTransition(element,
            new NavigationOutTransition() {
                Backward = new TurnstileTransition() {
                    Mode = TurnstileTransitionMode.BackwardOut
                },
                Forward = new TurnstileTransition() {
                    Mode = TurnstileTransitionMode.ForwardOut
                }
            }
        );
    }
}

ПримерPage.xaml.cs

public partial class ExamplePage : PhoneApplicationPage {
    public ExamplePage() {
        InitializeComponent();

        Transitions.UseTurnstileTransition(this);
    }
}
person kamranicus    schedule 27.01.2013
comment
Аккуратно, +1 - хотя в целом я предпочитаю делать это с использованием стиля, чтобы он был явным даже при просмотре XAML. Я добавил ответ на этот счет. - person Clément; 07.01.2014

arrow_upward
3
arrow_downward

Просто примечание, чтобы расширить ответ @subkamran. Вместо вспомогательного класса вы также можете использовать стиль:

<Style x:Key="TransitionPageStyle" TargetType="phone:PhoneApplicationPage">
    <Setter Property="toolkit:TransitionService.NavigationInTransition">
        <Setter.Value>
            <toolkit:NavigationInTransition>
                <toolkit:NavigationInTransition.Backward>
                    <toolkit:TurnstileTransition Mode="BackwardIn"/>
                </toolkit:NavigationInTransition.Backward>
                <toolkit:NavigationInTransition.Forward>
                    <toolkit:TurnstileTransition Mode="ForwardIn"/>
                </toolkit:NavigationInTransition.Forward>
            </toolkit:NavigationInTransition>
        </Setter.Value>
    </Setter>

    <Setter Property="toolkit:TransitionService.NavigationOutTransition">
        <Setter.Value>
            <toolkit:NavigationOutTransition>
                <toolkit:NavigationOutTransition.Backward>
                    <toolkit:SlideTransition Mode="BackwardOut"/>
                </toolkit:NavigationOutTransition.Backward>
                <toolkit:NavigationOutTransition.Forward>
                    <toolkit:TurnstileTransition Mode="ForwardOut"/>
                </toolkit:NavigationOutTransition.Forward>
            </toolkit:NavigationOutTransition>
        </Setter.Value>
    </Setter>
</Style>
person Clément    schedule 06.01.2014

arrow_upward
1
arrow_downward

После того, как вы указали, что хотите использовать TransitionFrame, вам нужно сообщить приложению, какие переходы вы хотите входить и выходить из страницы, вот типичный XAML, который я использую:

сначала зарегистрируйте пространство имен в шапке страницы:

xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

затем установите переходы

  <toolkit:TransitionService.NavigationInTransition>
        <toolkit:NavigationInTransition>
            <toolkit:NavigationInTransition.Backward>
                <toolkit:TurnstileTransition Mode="BackwardIn"/>
            </toolkit:NavigationInTransition.Backward>
            <toolkit:NavigationInTransition.Forward>
                <toolkit:SlideTransition Mode="SlideRightFadeIn" />
            </toolkit:NavigationInTransition.Forward>
        </toolkit:NavigationInTransition>
    </toolkit:TransitionService.NavigationInTransition>

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

HTH, Руперт.

person Rupert    schedule 12.06.2012