TransitioningContentControl

The TransitioningContentControl is a ContentControl which can render PageTransitions when the Content changes.

Common Properties

Reference

TransitioningContentControl

Source code

TransitioningContentControl.cs

Example

Let's assume we have a collection of different images and we want to show them in a slideshow like view. In order to do this we can setup our TransitioningContentControl like this:

<TransitioningContentControl Content="{Binding SelectedImage}" >
    <TransitioningContentControl.ContentTemplate>
        <DataTemplate DataType="Bitmap">
            <Image Source="{Binding}" />
        </DataTemplate>
    </TransitioningContentControl.ContentTemplate>
</TransitioningContentControl>

Changing the PageTransition

If you don't like the PageTransition which is provided by the applied theme, you can also provide your own PageTransition. This can be done in XAML, provided via Binding or via DynamicResource.

In the sample below we will change the PageTransition to slide the images horizontally.

<TransitioningContentControl Content="{Binding SelectedImage}" >
    <TransitioningContentControl.PageTransition>
        <PageSlide Orientation="Horizontal" Duration="0:00:00.500" />
    </TransitioningContentControl.PageTransition>
    <TransitioningContentControl.ContentTemplate>
        <DataTemplate DataType="Bitmap">
            <Image Source="{Binding}"  />
        </DataTemplate>
    </TransitioningContentControl.ContentTemplate>
</TransitioningContentControl>

Disable the PageTransition

If you want to disable the transition, set the PageTransition to null.

<TransitioningContentControl Content="{Binding SelectedImage}" PageTransition="{x:Null}" >
    <TransitioningContentControl.ContentTemplate>
        <DataTemplate DataType="Bitmap">
            <Image Source="{Binding}"  />
        </DataTemplate>
    </TransitioningContentControl.ContentTemplate>
</TransitioningContentControl>

最后更新于