Resource

资源库，外部资源管理（静态类）。

用于管理及有序并行加载图片、视频、声音等素材。

关键方法

loadImage ( key: string, format?: IExportFileType ): Promise<ILeaferImage>

预加载图片资源，key 为图片的 url 地址，format 用于强制定义图片类型 。

setImage ( key: string, value: string | IObject | ILeaferImage | ILeaferCanvas, format?: IExportFileType ): ILeaferImage

自定义图片资源的 key，建议采用 leafer://协议 + 类型后缀名，方便识别导出资源。

value 支持 base64，原始图像、画布，以及封装的跨平台图像、画布。

format 用于强制定义图片类型。

set ( key: string, value: any )

设置资源的 key, 图像类型必须为 ILeaferImage。

get ( key: string ): any

通过 key 获取资源对象。

remove ( key: string )

通过 key 移除资源，移除后会自动释放该资源的内存。

destroy ( )

销毁所有资源。

示例

等待图片加载完，再添加到引擎中

// #等待图片加载完，再添加到引擎中 import { Leafer, Image, Resource } from 'leafer-ui'  const leafer = new Leafer({ view: window })  const url = '/image/leafer.jpg'  Resource.loadImage(url).then(() => {   leafer.add(new Image({ url }))  })

原始图片对象 转 url

// #图片 url [原始图片对象转 url]  import { Leafer, Image, Platform, Resource } from 'leafer-ui'  const leafer = new Leafer({ view: window })  Platform.origin.loadImage('/image/leafer.jpg').then((img) => { // 加载原始图片对象（跨平台）   const { url } = Resource.setImage('leafer://test1.jpg', img) // 原始图片对象 转为 自定义资源符   leafer.add(new Image({ url })) // url = leafer://test1.jpg  })

原始 canvas 对象转 url

// #图片 url [原始 canvas 对象转 url] import { Leafer, Image, Platform, Resource } from 'leafer-ui'  const leafer = new Leafer({ view: window })  Platform.origin.loadImage('/image/leafer.jpg').then((img) => {   const canvas = document.createElement('canvas') // 原始画布 //  canvas.width = img.width  canvas.height = img.height  canvas.getContext('2d').drawImage(img, 0, 0)   const { url } = Resource.setImage('leafer://test2.jpg', canvas) // 原始canvas 对象 转为 自定义资源符   leafer.add(new Image({ url })) // url = leafer://test2.jpg  })

跨平台 LeaferCanvas 对象转 url

// #图片 url [跨平台 LeaferCanvas 对象转 url]  import { Leafer, Image, LeaferCanvas, Platform, Resource } from 'leafer-ui'  const leafer = new Leafer({ view: window })  Platform.origin.loadImage('/image/leafer.jpg').then((img) => {   const leaferCanvas = new LeaferCanvas({ width: img.width, height: img.height }) // LeaferCanvas 跨平台画布 //  leaferCanvas.drawImage(img, 0, 0)   const { url } = Resource.setImage('leafer://test3.jpg', leaferCanvas) // LeaferCanvas 转为 自定义资源符   leafer.add(new Image({ url })) // url = leafer://test3.jpg  })

添加一个自定义异步任务

export() 导出图片时，会等待此任务执行完再导出.

// #添加一个自定义异步任务（导出图片时会等待此任务执行完再导出） import { Resource } from 'leafer-ui'  async function doSomething() {  // 执行异步任务 }  // 添加异步任务 Resource.tasker.add(async () => await doSomething())