Skip to content

Latest commit

 

History

History
61 lines (41 loc) · 3.08 KB

animatedicon_source.md

File metadata and controls

61 lines (41 loc) · 3.08 KB
Raw
-api-id -api-type
P:Microsoft.UI.Xaml.Controls.AnimatedIcon.Source
winrt property

Microsoft.UI.Xaml.Controls.AnimatedIcon.Source

-description

Gets or sets the animated visual shown by the AnimatedIcon object.

This documentation applies to WinUI 2 for UWP (for WinUI in the Windows App SDK, see the Windows App SDK namespaces).

-property-value

The animated visual shown by the AnimatedIcon. The default is null.

-remarks

The Source property does not support XAML attribute syntax (<AnimatedIcon Source="..."/>); you have to set the Source by using XAML property element syntax. However, Source is defined as the control's content property, so you can omit the explicit <AnimatedIcon.Source> tags. These XAML declarations produce the same result.

<!--  These XAML declarations produce the same result. -->

<muxc:AnimatedIcon>
    <muxc:AnimatedIcon.Source>
        <animatedvisuals:AnimatedBackVisualSource/>
    </muxc:AnimatedIcon.Source>
</muxc:AnimatedIcon>

<muxc:AnimatedIcon>
    <animatedvisuals:AnimatedBackVisualSource/>
</muxc:AnimatedIcon>

WinUI provides animated visuals for some common icons in the Microsoft.UI.Xaml.Controls.AnimatedVisuals namespace.

You can create custom animations to use as an animated icon in your app. Animations can be created with Adobe AfterEffects, then you can use that output with the Lottie-Windows library to generate a custom class that implements IAnimatedVisualSource2. You can use this class as the Source for an animated icon. For more information, see Use Lottie to create animated content for an AnimatedIcon.

-see-also

Animated icon overview, AnimatedIcon, IAnimatedVisualSource.TryCreateAnimatedVisual, Microsoft.UI.Xaml.Controls.AnimatedVisuals

-examples

This example sets the AnimatedIcon.Source property to AnimatedBackVisualSource.

<!-- 
xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
xmlns:animatedvisuals="using:Microsoft.UI.Xaml.Controls.AnimatedVisuals"
-->

<muxc:AnimatedIcon>
    <animatedvisuals:AnimatedBackVisualSource/>
</muxc:AnimatedIcon>