精灵 Sprite

Flame提供了一个Sprite类，代表图片（或图片的一部分）。

你可以通过fromImage构造函数创建一个Sprite，并为其提供预加载的图片，也可以使匿名函数传入文件名，异步加载。

下面的例子会创建一个精灵，传入的文件名作为图片，自动加载：

Sprite player = Sprite('player.png');

你也可以在精灵所在的原始图像中指定坐标。这样我们可以使用精灵清单，减少内存中的图片数量。比如：

Sprite playerFrame = Sprite('player.png', x = 32.0, width = 16.0);

x和y的默认值为0.0，宽度和高度的默认值为null（默认值会使其使用图片的原本尺寸）。

Sprite类还有一个loaded函数，该函数返回图片是否加载完毕，还有一个render函数，我们可以通过它将图像渲染在Canvas上：

Sprite block = Sprite('block.png');

// 在render函数中
block.render(canvas, 16.0, 16.0); //canvas, 宽度, 高度

render函数中，尺寸是必选参数，图片将会相应调整其大小。

精灵尚未加载完成时，render不会执行任何操作，不需要担心。该图像缓存至Images类中，因此你可以安全的创建多个重名的精灵。

Sprite类中的所有render函数都可以接收Paint实例，它有一个可选参数overridePaint，该参数将重写该Sprite的paint实例。

精灵们可以当作widget使用，只需使用Flame.util.spriteAsWidget。

点此查看一个使用sprite和widget的完整案例。

精灵清单 SpriteBatch

如果你有一个Sprite清单（也称为图集，它是一个图像，并包含较小图像），并且希望对其进行有效渲染，你可以通过使用SpriteBatch完成该操作。

传入图片的文件名，然后添加一个对图像进行描述（位置、缩放、旋转和可选颜色）的矩形。

您可以使用Canvas和可选的Paint，BlendMode和CullRect对其进行渲染。

为方便操作，Flame还提供了SpriteBatchComponent。

点此查看示例。

Svg

Flame提供了一个简单的API，用于渲染游戏中的SVG图像。

只需导入package:flame/svg.dart中的Svg类，使用以下代码块将其渲染在画布上：

Svg svgInstance = Svg('android.svg');

final position = Position(100, 100);
final width = 300;
final height = 300;

svgInstance.renderPosition(canvas, position, width, height);

Flame.images

Flame.images是优先级较低的，用于加载图像的应用程序，与Flame.audio十分类似。

在Flutter中，将所有内容从本地转为在Canvas上绘制的图片比较麻烦。此类允许你使用drawImageRect函数获得可在Canvas上绘制的图像。

它会自动缓存使用文件名加载的任何图片，所以你可以安全的多次调用。

若要加载/绘制图片，你可以像这样使用load函数：

import 'package:flame/flame.dart';

// 在异步context中
Image image = await Flame.images.load('player.png');

// 或者
Flame.images.load('player.png').then((Image image) {
  var paint = Paint()..color = Color(0xffffffff);
  var rect = Rect.fromLTWH(0.0, 0.0, image.width.toDouble(), image.height.toDouble());
  canvas.drawImageRect(image, rect, rect, paint);
});

加载和清除缓存的方式与音频类似:load, loadAll, clear和clearAll。他们返回Future的图片加载类型。

仍然类似音频，你可以实例化自己的图片副本（每个实例共享不同的缓存）：

Image image = await new Images().load('asd');