El paquete eQuantic.UI.Lottie proporciona soporte de animación de alto rendimiento usando los formatos .lottie y .json a través del componente web @dotlottie/player-component.

Instalación

Añade el paquete a tu proyecto y registra el servicio:

builder.Services.AddUI(options =>

{

options.UseLottie();

});

Uso básico

El componente LottiePlayer se encarga de cargar los assets automáticamente vía IRequireAssets.

new LottiePlayer

{

Src = "https://assets.lottiefiles.com/animation.json",

Autoplay = true,

Loop = true,

Width = "300px"

}

Soporte de dotLottie

Se recomienda usar el formato .dotlottie por su menor tamaño de archivo y mejor rendimiento.

new LottiePlayer

{

Src = "https://example.com/animation.lottie",

Height = "400px",

Controls = true

}

Propiedades

Propiedad

Tipo

Descripción

Src

string

URL del archivo de animación (.json o .dotlottie).

Autoplay

bool

Inicia la animación automáticamente. Por defecto: true.

Loop

bool

Repite la animación en bucle. Por defecto: true.

Speed

double

Multiplicador de velocidad de reproducción. Por defecto: 1.

Background

string

Color de fondo. Por defecto: transparent.

Width

string?

La propiedad CSS width.

Height

string?

La propiedad CSS height.

Controls

bool

Muestra la interfaz de controles nativa del reproductor.

ON THIS PAGE