TransitionControl (or TransitionPresenter?) in a Frame

2 posts, 0 answers
  1. Stefan
    Stefan avatar
    5 posts
    Member since:
    Jul 2010

    Posted 18 Aug Link to this post

    Hi,

    I'm trying to replace the ContentPresenter in a Frame with the TransitionControl as described here:

    http://docs.telerik.com/devtools/wpf/controls/radtransitioncontrol/features/radtransition-integration-with-content-controls

    If I follow this example, no content is displayed.

    I also tried using TransitionPresenter, which is better in that the content does show up, but there are no transition animations?

    I have successfully used a TransitionControl stand-alone, but I'm hoping to use the navigation features of Frame along with transition animations.

    What am I doing wrong?

    <Frame x:Name="NavFrame" NavigationUIVisibility="Visible" Margin="0,50,0,0">
        <Frame.Template>
            <ControlTemplate TargetType="{x:Type Frame}">
                <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
                    <teleriktp:TransitionPresenter CurrentContent="{TemplateBinding Content}" Duration="0:0:3">
                        <teleriktp:TransitionPresenter.Transition>
                            <telerikTransitions:WaveTransition />
                        </teleriktp:TransitionPresenter.Transition>
                    </teleriktp:TransitionPresenter>
                </Border>
            </ControlTemplate>
        </Frame.Template>
    </Frame>
  2. Martin Ivanov
    Admin
    Martin Ivanov avatar
    1408 posts

    Posted 23 Aug Link to this post

    Hello Stefan,

    In order for the TransitionPresenter to execute its animation you need to set its Host property to a Panel element. In your case you can wrap the TransitionPresenter into a Grid element, set the Grid's x:Name and use ElementName binding to bind the transition control's Host to the Grid. For example:
    <Grid x:Name="hostPanel">
        <telerikTransitionControl:TransitionPresenter CurrentContent="{TemplateBinding Content}" Duration="0:0:3" Host="{Binding ElementName=hostPanel}">
            <telerikTransitionControl:TransitionPresenter.Transition>
                <telerikTransitions:WaveTransition />
            </telerikTransitionControl:TransitionPresenter.Transition>
        </telerikTransitionControl:TransitionPresenter>
    </Grid>

    I also tested your scenario with the RadTransitionControl and it is displayed properly. You can check this in the attached project.

    Regards,
    Martin Ivanov
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Back to Top