Expand Minimize

UIElement.Transitions property

Applies to Windows and Windows Phone

Gets or sets the collection of Transition style elements that apply to a UIElement.

Syntax


Public Property Transitions As TransitionCollection


<uielement>
  <uielement.Transitions>
    <TransitionCollection>
      oneOrMoreTransitions
    </TransitionCollection>
  </uielement.Transitions>
</uielement>

XAML Values

oneOrMoreTransitions

One or more object elements instantiating types that are derived from the Transition base type. Typically there is only one of each type of transition included in the collection.

Property value

Type: TransitionCollection

The strongly typed collection of Transition style elements that apply to a UIElement.

Remarks

Important  The XAML syntax for all properties that use a TransitionCollection value is unusual in that you must declare an explicit TransitionCollection object element as the value, and then provide object elements as child elements of TransitionCollection for each of the transition animations you want to use. For most other XAML collection properties you could omit the collection object element because it can be implicit, but properties that use TransitionCollection don't support the implicit collection usage. For more info on implicit collections and XAML, see Basic XAML syntax guide.

This is a short list of some of the possible types for transitions:

Specific classes that derive from UIElement sometimes have their own properties that hold other types of transitions for class-specific scenarios. For example, Popup.ChildTransitions and ItemsControl.ItemContainerTransitions.

Transition animations play a particular role in UI design of your app. The basic idea is that when there is a change or transition, the animation draws the attention of the user to the change.

It's not common to set the value of the Transitions property directly on a UIElement that is a direct element of app UI. It's more common to have a transitions collection be a part of a visual state, template or style. In this case you use mechanisms such as Setter of a Style to specify the Transitions property, and set the value using XAML-defined content that is typically stored as a XAML resource.

VisualTransition is not one of the types you put in the UIElement.Transitions collection. VisualTransition is specifically for animations in visual state groups, and is used by the VisualStateGroup.Transitions property.

Examples

This XAML example shows a single EntranceThemeTransition as defined in a Style for a Button. Transition animation properties are typically set in styles and templates rather than as properties directly in a UI definition. Styles are typically stored as a XAML resource.


<Grid Background="{StaticResource ApplicationPageBackgroundBrush}">
    <Grid.Resources>
        <Style x:Key="DefaultButtonStyle" TargetType="Button">
            <Setter Property="Transitions">
                <Setter.Value>
                    <TransitionCollection>
                        <EntranceThemeTransition/>
                    </TransitionCollection>
                </Setter.Value>
            </Setter>
        </Style>
    </Grid.Resources>

    <Button Style="{StaticResource DefaultButtonStyle}" 
            Content="EntranceThemeTransition style applied" />

</Grid>


Requirements

Minimum supported client

Windows 8

Minimum supported server

Windows Server 2012

Minimum supported phone

Windows Phone 8.1 [Windows Runtime apps only]

Namespace

Windows.UI.Xaml
Windows::UI::Xaml [C++]

Metadata

Windows.winmd

See also

UIElement
Storyboarded animations
TransitionCollection

 

 

Show:
© 2014 Microsoft