2.Loader

Loader
如果使用的是Pixi.js最新版本,已经移除了`PIXI.Loader`类,可以使用`PIXI.Loader.shared`来预加载多个图片,并且可以通过监听`onProgress`事件来显示载入进度,载入完成后可以使用回调方法来处理完成的事件。 但是,需要注意的是,如果要使用`PIXI.Loader.shared`来加载资源,需要先将要加载的资源添加到队列中,然后调用`PIXI.Loader.shared.load()`方法来开始加载,否则`onProgress`事件将不会被触发。 以下是一个示例代码,它可以预加载两个图片,并在载入过程中显示进度条,载入完成后会调用回调方法: ```javascript // 添加要预加载的图片 PIXI.Loader.shared.add('image1', 'path/to/image1.png'); PIXI.Loader.shared.add('image2', 'path/to/image2.png'); // 监听进度事件 PIXI.Loader.shared.onProgress.add((loader, resource) => { console.log(`Progress: ${loader.progress}%`); }); // 载入完成后的回调方法 PIXI.Loader.shared.load((loader, resources) => { console.log('All resources loaded'); // 在回调方法中创建精灵并添加到舞台 const sprite1 = new PIXI.Sprite(resources['image1'].texture); const sprite2 = new PIXI.Sprite(resources['image2'].texture); app.stage.addChild(sprite1, sprite2); }); ``` 在上面的代码中,先使用`add`方法将要预加载的图片添加到队列中,然后使用`onProgress`事件来监听进度变化。最后,在`load`方法中传入回调函数,这个函数会在所有资源都加载完成后被调用。在回调函数中可以根据`resources`参数获取每个资源的`texture`属性,然后创建精灵并添加到舞台中。 需要注意的是,在使用`PIXI.Loader.shared`加载资源时,需要先将要加载的资源添加到队列中,然后调用`load`方法开始加载。否则`onProgress`事件将不会被触发。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值