AnimatedIcon.Source Property

public:
 property IAnimatedVisualSource2 ^ Source { IAnimatedVisualSource2 ^ get(); void set(IAnimatedVisualSource2 ^ value); };

/// [get: Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)]
/// [set: Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)]
IAnimatedVisualSource2 Source();

void Source(IAnimatedVisualSource2 value);

/// [Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)]
/// [get: Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)]
/// [set: Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)]
IAnimatedVisualSource2 Source();

void Source(IAnimatedVisualSource2 value);

public IAnimatedVisualSource2 Source { [Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)] get; [Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)] set; }

[Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)]
public IAnimatedVisualSource2 Source { [Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)] get; [Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallback(enable=true)] set; }

var iAnimatedVisualSource2 = animatedIcon.source;
animatedIcon.source = iAnimatedVisualSource2;

Public Property Source As IAnimatedVisualSource2

Property Value

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

Attributes

Microsoft.UI.Xaml.CustomAttributes.MUXPropertyChangedCallbackAttribute

Examples

This example sets the AnimatedIcon.Source property to AnimatedBackVisualSource.

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

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

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. -->

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

<AnimatedIcon>
    <animatedvisuals:AnimatedBackVisualSource/>
</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.

Applies to

See also

• AnimatedIcon
• TryCreateAnimatedVisual(Compositor, Object)
• Animated icon overview
• Microsoft.UI.Xaml.Controls.AnimatedVisuals