EntranceThemeTransition
EntranceThemeTransition
EntranceThemeTransition
EntranceThemeTransition
Class
Definition
Provides the animated transition behavior on controls when they first appear. You can use this on individual objects or on containers of objects. In the latter case, child elements will animate into view in sequence rather than all at the same time.
public : sealed class EntranceThemeTransition : Transition, IEntranceThemeTransitionpublic sealed class EntranceThemeTransition : Transition, IEntranceThemeTransitionPublic NotInheritable Class EntranceThemeTransition Inherits Transition Implements IEntranceThemeTransition// This API is not available in Javascript.
<EntranceThemeTransition .../>
- Inheritance
-
EntranceThemeTransitionEntranceThemeTransitionEntranceThemeTransitionEntranceThemeTransition
- Attributes
| Device family |
Windows 10 (introduced v10.0.10240.0)
|
| API contract |
Windows.Foundation.UniversalApiContract (introduced v1)
|
Inherited Members
Inherited methods
Inherited properties
Examples
The following example shows a how to apply an EntranceThemeTransition to a Button.
<Button Content="EntranceThemeTransition Button">
<Button.Transitions>
<TransitionCollection>
<!-- This transition just uses the default behavior which is to
have the button animate into view from the right. You can
make it start from anywhere on the right by using the
FromHorizontalOffset property. If you'd rather see a vertical
animation, use the FromVerticalOffset property. -->
<EntranceThemeTransition />
</TransitionCollection>
</Button.Transitions>
</Button>
<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>
<!-- If you set an EntranceThemeTransition animation on a panel, the
children of the panel will automatically offset when they animate
into view to create a visually appealing entrance. -->
<Grid HorizontalAlignment="Left">
<Grid.ChildrenTransitions>
<TransitionCollection>
<EntranceThemeTransition/>
</TransitionCollection>
</Grid.ChildrenTransitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<!-- The sequence children appear depends on their order in
the panel's children, not necessarily on where they render
on the screen. Be sure to arrange your child elements in
the order you want them to transition into view. -->
<Rectangle Fill="Red" Grid.Row="0" Grid.Column="0"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Blue" Grid.Row="0" Grid.Column="1"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Green" Grid.Row="0" Grid.Column="2"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Red" Grid.Row="1" Grid.Column="0"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Blue" Grid.Row="1" Grid.Column="1"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Green" Grid.Row="1" Grid.Column="2"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Red" Grid.Row="2" Grid.Column="0"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Blue" Grid.Row="2" Grid.Column="1"
Width="100" Height="100" Margin="2"/>
<Rectangle Fill="Green" Grid.Row="2" Grid.Column="2"
Width="100" Height="100" Margin="2"/>
</Grid>
Constructors
EntranceThemeTransition() EntranceThemeTransition() EntranceThemeTransition() EntranceThemeTransition()
Initializes a new instance of the EntranceThemeTransition class.
public : EntranceThemeTransition()public EntranceThemeTransition()Public Sub New()// This API is not available in Javascript.
- See Also
Properties
FromHorizontalOffset FromHorizontalOffset FromHorizontalOffset FromHorizontalOffset
Gets or sets the distance by which the target is translated in the horizontal direction when the animation is active.
public : double FromHorizontalOffset { get; set; }public double FromHorizontalOffset { get; set; }Public ReadWrite Property FromHorizontalOffset As double// This API is not available in Javascript.
<EntranceThemeTransition FromHorizontalOffset="double" />
- Value
- double double double double
The horizontal offset translation, in pixels.
- See Also
FromHorizontalOffsetProperty FromHorizontalOffsetProperty FromHorizontalOffsetProperty FromHorizontalOffsetProperty
Identifies the FromHorizontalOffset dependency property.
public : static DependencyProperty FromHorizontalOffsetProperty { get; }public static DependencyProperty FromHorizontalOffsetProperty { get; }Public Static ReadOnly Property FromHorizontalOffsetProperty As DependencyProperty// This API is not available in Javascript.
The identifier for the FromHorizontalOffset dependency property.
- See Also
FromVerticalOffset FromVerticalOffset FromVerticalOffset FromVerticalOffset
Gets or sets the distance by which the target is translated in the vertical direction when the animation is active.
public : double FromVerticalOffset { get; set; }public double FromVerticalOffset { get; set; }Public ReadWrite Property FromVerticalOffset As double// This API is not available in Javascript.
<EntranceThemeTransition FromVerticalOffset="double" />
- Value
- double double double double
The vertical offset translation, in pixels.
- See Also
FromVerticalOffsetProperty FromVerticalOffsetProperty FromVerticalOffsetProperty FromVerticalOffsetProperty
Identifies the FromVerticalOffset dependency property.
public : static DependencyProperty FromVerticalOffsetProperty { get; }public static DependencyProperty FromVerticalOffsetProperty { get; }Public Static ReadOnly Property FromVerticalOffsetProperty As DependencyProperty// This API is not available in Javascript.
The identifier for the FromVerticalOffset dependency property.
- See Also
IsStaggeringEnabled 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 : PlatForm::Boolean IsStaggeringEnabled { get; set; }public bool IsStaggeringEnabled { get; set; }Public ReadWrite Property IsStaggeringEnabled As bool// This API is not available in Javascript.
<EntranceThemeTransition IsStaggeringEnabled="bool" />
- Value
- PlatForm::Boolean bool bool bool
true if the animation staggers rendering of multiple items. false if the animation renders all items at once.
- See Also
IsStaggeringEnabledProperty 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// This API is not available in Javascript.
The identifier for the IsStaggeringEnabled dependency property.
- See Also