Mentalidad de motor de navegador, aplicada al SVG en Flutter.

Denis creó y mantiene full_svg_flutter, un runtime de renderizado autónomo para equipos que necesitan que sus SVG existentes sigan siendo SVG dentro de Flutter.

1.4.2release actual
140pub points
12versiones públicas
MITlicencia open source

El asset funciona en el navegador. En Flutter, la animación desaparece.

Muchos pipelines resuelven ese hueco convirtiendo el asset a Lottie, Rive, GIF, WebP o a código de animación Flutter a medida. Son buenas herramientas, pero convertir es un precio que no tiene sentido pagar cuando el SVG ya es la fuente de verdad.

Un único motor que conserva el DOM para SVG estático y animado

El paquete analiza el modelo del documento, el CSS, los tiempos, los filtros, el texto y el estado de interacción, y después pinta dentro de Flutter. Las exportaciones de SVGator controladas por JavaScript se ejecutan en un motor QuickJS integrado; los SVG sin scripts no pagan el arranque de JavaScript.

Qué cubre el runtime

  • Geometría estática, degradados, patrones, recorte y máscaras
  • Animación SMIL y CSS @keyframes
  • Path morphing, motion paths y control de reproducción
  • Las 17 primitivas de filtro de SVG
  • Texto enriquecido, textPath, bidi/RTL y metadatos de accesibilidad
  • JavaScript inline y exportaciones de SVGator
  • API estática compatible con flutter_svg para migrar
  • Android, iOS, macOS, Windows y Linux
Animated Flutter logo built from one SVG file

Un solo archivo SVG. Aquí, animación nativa del navegador; en el paquete, renderizado nativo de Flutter.

Esta página muestra en el navegador el SVG animado del propio proyecto. En una aplicación Flutter, full_svg_flutter renderiza ese mismo formato fuente dentro de Flutter, sin WebView ni paso de conversión.

Una ruta de migración práctica

En muchos casos, el uso estático actual de SvgPicture se migra cambiando un import. FSvgPicture detecta automáticamente los marcadores de animación, y AnimatedSvgController añade pausa, seek, velocidad, dirección y control de vistas SVG cuando el producto lo necesita.

Documentación de los runtimes que hay detrás de casos límite reales.

v1.4.2

full_svg_flutter

Mantén el SVG como formato fuente dentro de Flutter.

v0.1.0

woff2

Carga contenedores de fuentes web a través del FontLoader de Flutter.

v0.1.3

quickjs_engine

Ejecuta el mismo motor JavaScript moderno en todas las plataformas Flutter.

El problema: el soporte de SVG en Flutter suele ser estático

Una explicación práctica del hueco de renderizado, las soluciones habituales, el control de reproducción, los trade-offs de rendimiento y cuándo mantener el SVG como SVG es la decisión correcta.

Leer el análisis técnico (se abre en una pestaña nueva)

¿Necesitas construir, modernizar o desbloquear un producto digital?

Cuéntame la restricción real: web, móvil, la entrega de tu equipo o un flujo de trabajo con IA que tiene que llegar a calidad de producción.

Hablemos de tu proyecto