SVGAPlayer-Flutter

简体中文

支持本项目

如果 SVGA-Flutter 为您提供了便利与帮助，诚恳建议您通过以下方式支持作者、贡献者持续为该项目发电。

1. 轻点 GitHub Star，让更多人看到该项目。
2. 通过赞赏码(页面底部可见)的方式鼓励作者继续维护代码。

Introduce

SVGAPlayer is a light-weight animation renderer. You use tools to export

svga

Adobe Animate CC

Adobe After Effects

SVGAPlayer-Flutter

If wonder more information, go to this website.

• SVGAPlayer-Flutter supports 2.0 format only.

Usage

Here introduce

SVGAPlayer-Flutter

Add dependency

dependencies:
  svgaplayer_flutter: ^2.0.0  #latest version

Locate files

SVGAPlayer could load svga file from Flutter local

assets

Super simple to use

The simplest way to render an animation is to use

SVGASimpleImage

class MyWidget extends Widget {

  @override
  Widget build(BuildContext context) {
    return Container(
      child: SVGASimpleImage(
          resUrl: "https://github.com/yyued/SVGA-Samples/blob/master/angel.svga?raw=true"),
    );
  }
}

Animation will run repeatedly. If you wondering a stronger animation controls, use code.

Code to use

To control an animation rendering, you need to create a

SVGAAnimationController

SVGAImage

SVGAParser

SVGAAnimationController

import 'package:flutter/material.dart';
import 'package:svgaplayer_flutter/svgaplayer_flutter.dart';

void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}
class _MyAppState extends State with SingleTickerProviderStateMixin {
  SVGAAnimationController animationController;
  @override
  void initState() {
    this.animationController = SVGAAnimationController(vsync: this);
    this.loadAnimation();
    super.initState();
  }
  @override
  void dispose() {
    this.animationController.dispose();
    super.dispose();
  }
  void loadAnimation() async {
    final videoItem = await SVGAParser.shared.decodeFromURL(
        "https://github.com/yyued/SVGA-Samples/blob/master/angel.svga?raw=true");
    this.animationController.videoItem = videoItem;
    this
        .animationController
        .repeat() // Try to use .forward() .reverse()
        .whenComplete(() => this.animationController.videoItem = null);
  }
  @override
  Widget build(BuildContext context) {
    return Container(
      child: SVGAImage(this.animationController),
    );
  }
}

Reuse MovieEntity

The

MovieEntity

dispose

AnimationController

AnimationController::videoItem

After dispose, the

MovieEntity

If you eager to reuse the

MovieEntity

MovieEntity::autorelease

final videoItem = await SVGAParser.shared.decodeFromURL(
        "https://github.com/yyued/SVGA-Samples/blob/master/angel.svga?raw=true");
videoItem.autorelease = false;

You need to call

MovieEntity::dispose()

Cache

We will not manage any caches, you need to use

dio

Use

SVGAParser.decodeFromBytes

Features

Here are many feature samples.

• Replace an element with Bitmap.
• Add text above an element.
• Hides an element dynamicaly.
• Use a custom drawer for element.

License

Anti 996

感谢或联系作者