Reposition​Theme​Transition Reposition​Theme​Transition Reposition​Theme​Transition Class

Definition

Reacts to layout moves when no context is set and a trigger of move is passed.

public sealed class RepositionThemeTransition : Transition, IRepositionThemeTransition, IRepositionThemeTransition2public sealed class RepositionThemeTransition : Transition, IRepositionThemeTransition, IRepositionThemeTransition2Public NotInheritable Class RepositionThemeTransition Inherits Transition Implements IRepositionThemeTransition, IRepositionThemeTransition2
<RepositionThemeTransition ../>
Inheritance
RepositionThemeTransitionRepositionThemeTransitionRepositionThemeTransition
Attributes
Windows 10 requirements
Device family
Windows 10 (introduced v10.0.10240.0)
API contract
Windows.Foundation.UniversalApiContract (introduced v1)

Inherited Members

Inherited methods

Inherited properties

Remarks

Examples

The following example applies a RepositionThemeTransition to a button. When you click the button, its margin changes, which changes its position. This position change is animated.

<Button Content="Click to reposition" Click="Button_PointerPressed"
        x:Name="animatedButton">
    <Button.Transitions>
        <TransitionCollection>
            <RepositionThemeTransition/>
        </TransitionCollection>
    </Button.Transitions>
</Button>
private void Button_Clicked(object sender, RoutedEventArgs e)
{
    animatedButton.Margin = new Thickness(100);
}
<Button Content="Remove Rectangle" Click="RemoveButton_Click"/>

<ItemsControl Grid.Row="1" x:Name="rectangleItems">
    <ItemsControl.ItemContainerTransitions>
        <TransitionCollection>
            
            <!-- Without this, there would be no animation when items 
                 are removed. -->
            <RepositionThemeTransition/>
        </TransitionCollection>
    </ItemsControl.ItemContainerTransitions>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapGrid Height="400"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    
    <!-- All these rectangles are just to demonstrate how the items
         in the grid re-flow into position when one of the child items
         are removed. -->
    <ItemsControl.Items>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
    </ItemsControl.Items>
</ItemsControl>
private void RemoveButton_Click(object sender, RoutedEventArgs e)
{
    if (rectangleItems.Items.Count > 0)
        rectangleItems.Items.RemoveAt(0);
}

Constructors

RepositionThemeTransition() RepositionThemeTransition() RepositionThemeTransition()

Initializes a new instance of the RepositionThemeTransition class.

public RepositionThemeTransition()public RepositionThemeTransition()Public Sub New()
Attributes
See Also

Properties

IsStaggeringEnabled IsStaggeringEnabled IsStaggeringEnabled

Gets or sets a value that determines whether the transition staggers rendering of multiple items, or renders all items at once.

public bool IsStaggeringEnabled { get; set; }public bool IsStaggeringEnabled { get; set; }Public ReadWrite Property IsStaggeringEnabled As bool
<RepositionThemeTransition IsStaggeringEnabled="bool"/>
Value
bool bool bool

true if the animation staggers rendering of multiple items. false if the animation renders all items at once. The default is true.

Attributes

Remarks

Available starting in Windows 10, version 1607.

The ListView control utilizes the RepositionThemeTransition to animate items when an item’s position changes. Unlike some of the other theme transitions, when more than one item’s position changes, the RepositionThemeTransition staggers the animation across the collection. (The second item lags slightly behind the first item, the third behind the second, etc.) Set this property to false to make all items render at once.

Examples

This example shows how to use a RepositionThemeTransition with a ListView.

<ListView>
    <ListView.ItemContainerTransitions>
        <TransitionCollection>
            <!-- Animate when items are removed, 
                 but don't stagger the animation across columns. -->
            <RepositionThemeTransition IsStaggeringEnabled="False"/>
        </TransitionCollection>
    </ListView.ItemContainerTransitions>
</ListView>
var lv = new ListView();
var transition = new RepositionThemeTransition();
transition.IsStaggeringEnabled = false;
lv.ItemContainerTransitions.Add(transition);
auto lv = ref new ListView();
auto transition = ref new RepositionThemeTransition();
transition->IsStaggeringEnabled = false;
lv->ItemContainerTransitions->Append(transition);

IsStaggeringEnabledProperty IsStaggeringEnabledProperty IsStaggeringEnabledProperty

Identifies the IsStaggeringEnabled dependency property.

public static DependencyProperty IsStaggeringEnabledProperty { get; }public static DependencyProperty IsStaggeringEnabledProperty { get; }Public Static ReadOnly Property IsStaggeringEnabledProperty As DependencyProperty
Value
DependencyProperty DependencyProperty DependencyProperty

The identifier for the IsStaggeringEnabled dependency property.

Attributes

See Also