Table of Contents

Class SKLottieView

Namespace
SkiaSharp.Extended.UI.Blazor.Controls
Assembly
SkiaSharp.Extended.UI.Blazor.dll

A Blazor component that plays Lottie animations, mirroring the MAUI SKLottieView API. Wraps SKAnimatedCanvasView with an SKLottiePlayer to handle loading, playback, and rendering.

public class SKLottieView : ComponentBase, IComponent, IHandleEvent, IHandleAfterRender, IAsyncDisposable
Inheritance
SKLottieView
Implements
Inherited Members

Remarks

Point Source at a Lottie JSON URL, configure repeat and speed, and the component handles the rest—loading, frame updates, and rendering.

Access read-only state (IsLoading, Progress, etc.) via an @ref to the component instance.

Constructors

SKLottieView()

Properties

AdditionalAttributes

Additional HTML attributes forwarded to the underlying canvas element.

AnimationCompleted

Fires when all repeats complete.

AnimationFailed

Fires when loading fails.

AnimationLoaded

Fires when the animation is successfully loaded.

AnimationSpeed

Playback speed multiplier. Negative values play in reverse. Defaults to 1.0.

AnimationUpdated

Fires after each frame update, allowing the host to refresh displayed state.

Duration

Gets the total animation duration.

HasAnimation

Gets whether an animation is loaded and ready to play.

IsAnimationEnabled

Whether the animation loop is running. Defaults to true.

IsComplete

Gets whether the animation has completed all repeats.

IsLoading

Gets whether the animation is currently loading.

Progress

Gets the current playback position.

RepeatCount

Number of additional plays after the first. Use -1 for infinite, 0 for no repeat. Defaults to -1.

RepeatMode

How the animation repeats. Defaults to Restart.

Source

URL of the Lottie JSON file to load.

Methods

BuildRenderTree(RenderTreeBuilder)

Renders the component to the supplied RenderTreeBuilder.

DisposeAsync()
OnParametersSetAsync()

Method invoked when the component has received parameters from its parent in the render tree, and the incoming values have been assigned to properties.

Restart()

Restarts the animation from the beginning with current settings.