Skip to content

Latest commit

 

History

History
76 lines (61 loc) · 3.62 KB

popinthemeanimation.md

File metadata and controls

76 lines (61 loc) · 3.62 KB
Raw
-api-id -api-type
T:Windows.UI.Xaml.Media.Animation.PopInThemeAnimation
winrt class

Windows.UI.Xaml.Media.Animation.PopInThemeAnimation

-description

Represents the preconfigured animation that applies to pop-in components of controls (for example, tooltip-like UI on an object) as they appear. This animation combines opacity and translation.

-xaml-syntax

<PopInThemeAnimation .../>

-remarks

This animation does not move or change the object or its neighbors. This animation is meant to be applied to overlay content (like tooltips) when that content first appears. When the content dissapears, you should use a PopOutThemeAnimation.

Note that setting the Duration property has no effect on this object since the duration is preconfigured.

-examples

The following shows an example template for a ToolTip control that uses PopInThemeAnimation and PopOutThemeAnimation.

<Style x:Key="ToolTipStyle1" TargetType="ToolTip">
    <!-- Sample template for the ToolTip control that uses PopinThemeAnimation and PopOutThemeAnimation. -->
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ToolTip">
                <Border x:Name="LayoutRoot" 
                         BorderBrush="{TemplateBinding BorderBrush}" 
                         BorderThickness="{TemplateBinding BorderThickness}" 
                         Background="{TemplateBinding Background}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="OpenStates">
                            <VisualState x:Name="Closed">
                                <Storyboard>
                                    <!-- Run a PopOutThemeAnimation when ToolTip is closed. -->
                                    <PopOutThemeAnimation TargetName="LayoutRoot"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Opened">
                                <Storyboard>
                                    <!-- Run a PopInThemeAnimation when ToolTip is opened. -->
                                    <PopInThemeAnimation 
                                        FromVerticalOffset="{Binding TemplateSettings.FromVerticalOffset, RelativeSource={RelativeSource Mode=TemplatedParent}}" 
                                        FromHorizontalOffset="{Binding TemplateSettings.FromHorizontalOffset, RelativeSource={RelativeSource Mode=TemplatedParent}}" 
                                        TargetName="LayoutRoot"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentPresenter 
                         ContentTemplate="{TemplateBinding ContentTemplate}" 
                         ContentTransitions="{TemplateBinding ContentTransitions}" 
                         Content="{TemplateBinding Content}" 
                         Margin="{TemplateBinding Padding}"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

-see-also

Timeline, Animating pop-up UI, Guidelines and checklist for pop-up UI animations