场景中存在多个 tracker,当 tracker 触发 tracker-switch 事件的时候,如何去动态更新视频纹理。
目前以下两种思路均未实现这个功能。
方式一:当 tracker 切换的时候,更改 video-texture 的 src 信息
js 文件:
handleTrackerSwitch: async function (event) {
console.log('tracker - switch');
const active = event.detail.value;
const item = event.target.dataset.item;
const url = this.data.items1[item].resourceUri;
this.setData({ resourceUrl: url });
const video = this.scene.assets.getAsset("video-texture", "hikari");
console.log({ video });
active ? video.play() : video.stop();
}
方式二:列表遍历,tracker 切换的时候,控制列表中选项的显示和隐藏
js 文件:
handleTrackerSwitch: async function (event) {
const active = event.detail.value;
const item = event.target.dataset.item;
this.setData({ currentIndex: Number(item) });
const video = this.scene.assets.getAsset("video-texture", "hikari");
console.log({ video });
// console.log({ height: video.height, width: video.width });
active ? video.play() : video.stop();
}
目前尝试了以上两种方式,当 tracker 切换的时候,视频纹理的路径没有更新,仍为初始化时的值。
有其他实现思路或者已经实现了这个功能的,麻烦分享一下实现思路,感谢。
xr-Frame 中,动态改 xr-asset-load 里的值是无效的。
所以方法一中,动态改 src 是无效的。
xr-Frame 中使用资源的时候,需要保证资源已经被注册 (wxml被解析,一般需要通过加载回调确定),而且动态场景 xr-asset-load 不会触发 xr-assets 的 loaded事件。
所以方法二中,下方使用的是没有被注册的视频纹理,也是无效的。
(btw,实现需要这种方法可以考虑动态创建 xr-assets 使用,但是不推荐)
如果需要动态使用资源(如视频纹理),推荐使用脚本进行动态加载。
可以参考以下代码进行实现,需要注意的是,assetId 不能一致,会导致索引失败。
const videos = await Promise.all(videoList.map(videoItem => scene.assets.loadAsset({ type: 'video-texture', assetId: videoItem.id, src: videoItem.url, options: { loop: true }, }))) videos.map((videoTexture, index) => { const videoMat = scene.createMaterial( scene.assets.getAsset('effect', 'simple'), { u_baseColorMap: videoTexture.value.texture } ) scene.assets.addAsset('material', `video-mat-${videoList[index].id}`, videoMat) })
目前 xr-frame-demo 通用模版 - 多tracker切换模版已更新,可以参考实现
https://github.com/dtysky/xr-frame-demo
若同一项目上需要几十种甚至几百种视频纹理的情况下,动态 loadAsset 时会导致卡顿或白屏,针对这个问题目前有优化方式吗,或者说出现这个问题是合理的吗,
另外,想问一下视频纹理上的资源,现在应该是每次重新进入场景都会需要重新加载,会影响到使用体验,这个缓存策略目前是什么样子的啊,有办法自己修改吗
目前视频纹理的缓存在客户端侧,缓存策略不可控。需要等客户端侧视频解析改造后,才比较好确定最终的缓存策略。
// 似乎得这么写
const videos = await Promise.all(videoList.map(videoItem => scene.assets.loadAsset({
type: 'video-texture',
assetId: videoItem.id,
src: videoItem.url,
// options: { loop: true },
loop: false,
abortAudio: true,
autoPlay: false,
})))
这块的问题大佬解决了吗
有没有遇到视频问题开启音频不生效的问题,而且加上开启声音参数配置之后循环播放也不生效了
目前 video-texture 音频无法播放问题及解决方式,请参考下面的问题和回复。
https://developers.weixin.qq.com/community/develop/doc/0002622c8608b035e21fcea3851800
我们目前采用的方法是写多个tracker,然后资源动态加载