胡佳骏 f30686ea2d init微信小程序 | 11 달 전 | |
---|---|---|
.. | ||
README.md | 11 달 전 |
Android 8.0.35 基本大部分情况已修复,后续版本如果还有花屏情况可以联系官方,带上对应平台的客户端版本与基础库版本。
功能问题型
Android 8.0.35 以及 iOS 8.0.36 后已经修复,后续版本如果情况可以联系官方,带上对应平台的客户端版本与基础库版本。
OOM(内存溢出)型
小程序占用内存超过了设备对应的系统限制内存的上限。
绝大部分报错来自 github 下载太慢,导致部分库下载失败,可以 npm 默认源可以切国内源试试。目前只支持 Windows 或 Mac 环境下使用。
下载最新的开发版工具 https://developers.weixin.qq.com/miniprogram/dev/devtools/nightly.html
所有用户,会基于自身的客户端版本,更新到当前客户端版本最新的公共库。 后续如果基础库更新新的版本,只要用户客户端版本允许,就会逐渐灰度更新到所有用户。 具体关系可以看下这个文档 https://developers.weixin.qq.com/miniprogram/dev/framework/client-lib/version.html
直接看对应组件的文档即可,比如 uniform标签 看对应的材质的内置材质文档,states标签 相关看材质文档,shadow标签 相关看阴影文档...
作为相机子节点
把模型直接挂在相机底下即可(不可以带上tracker),此时模型相当于视图空间的位置,就是相对相机的固定距离。
可以在tracker中创建对应物体大小的两个点,通过 camera.convertWorldPositionToClip 获取这两个位于裁剪空间的位置,可以算出这个宽度,相对于屏幕空间大小的比例。 具体可以参考 多tracker案例 中 物体框选逻辑 https://github.com/dtysky/xr-frame-demo/blob/master/miniprogram/components/template/xr-template-tracker/index.js#L187
直接获取 物体的矩阵 以及相机的矩阵以及 near 还有 far ,就可以算出来了。
可以参考这个例子,每帧算出面向相机的方向。 https://github.com/dtysky/xr-frame-demo/blob/master/miniprogram/components/template/xr-template-lookat/index.js
有关系,OSD只返回了二维信息,距离影响识别框大小,目前的 xr-frame 返回的三维坐标是基于屏幕空间转出来的,具体可以看这个文档 https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/ar/tracker.html#OSD
OSD 非常容易误判,需要稳定识别还是建议使用 2D Marker。
理论上可以无数个,但不同的tracker图片会相互干扰,大于6个识别效果就大幅减弱了。
直接使用即可,xr-frame-demo 中 通用模版 有多案例是原生的 view 盖在 xr-frame 的 canvas 上。 但需要真机才能看效果,开发者工具中 同层渲染 有问题。 https://github.com/dtysky/xr-frame-demo/blob/master/miniprogram/pages/template/xr-template-tracker/index.wxml
AR模式里面,相机是由算法驱动的,视图矩阵和投影矩阵都是AR算法返回,所以不允许用户编辑相机。 如果需要在AR模型下,进行手势缩放,可以于场景添加触摸事件,在触摸事件中,将变化值动态同步到需更改模型的缩放值上实现。 可以参考,通用模版 - 模型摆放与手势控制 https://github.com/dtysky/xr-frame-demo/blob/master/miniprogram/components/template/xr-template-arPreview/index.js
AR渲染相机的时候,相机是交给算法那边控制的,设置target没有用。 如果在 Hand 模式下,你可以将这个立方体放在 xr-ar-tracker 下,这个模式下,整个坐标系统,会以 tracker 作为起点进行定位。
xr-shadow 里面的的节点和一般节点一致,可以获取Animator组件,使用播放函数即可。
可以用 Element 的 removeChild 方法。visible 只会影响渲染元素的是否渲染,不影响节点本身,不是真正的销毁。
横杠的属性
是 “字符与值的一个map”,写的时候需要类似 { "receive-shadow": true, "cast-shadow": true} 这样使用。
事件回调
不能通过 createElement 传入,需要通过模版绑定,或者通过 element.event 添加
anim-autoplay 判断条件是有没有对象,如果不需要播放,可以设 anim-autoplay 为 undefined
可以使用分享系统,captureToArrayBuffer 返回 Buffer,captureToLocalPath 分享到本地文件,captureToFriends 直接分享给朋友 具体可以参考 https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/share/
可以通过加载一个图片资源(雪碧图那种),根据时间控制 uv 进行实现, 具体参考帧动画案例,由 @一二侠 提供 https://github.com/dtysky/xr-frame-demo/blob/master/miniprogram/components/template/xr-template-frameEffect/index.js
alphaMode
设为 Blend 就可以控制是否开启混合,
设定渲染状态逻辑 material.setRenderState(key, value);
具体透明度可以修改材质的 baseColorFactor
。
material.setVector(key, vec);
对应文档:
https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/render/material.html
https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/builtin/effect-standard.html
如果只是决定显示正面和反面,可以采用cullOn和cullFace
目前版本建议先不要在生产环境使用视频纹理,这部分问题来源是客户端视频解码器,依赖客户端的更新修复。目前客户端已更改新的解码器版本,后续基础修复版本也在发布计划了。
渲染视频纹理的物体,与视频纹理比例一致的话,就不会出现这种情况。 如果需要保证 marker图 和 视频比例一致的话,可以参考 多tracker案例 中,播放视频纹理的部分 https://github.com/dtysky/xr-frame-demo/blob/master/miniprogram/pages/template/xr-template-tracker/index.wxml
面数上限没有要求
金属的反射需要依赖环境光,配置一下环境数据,没有的话可以使用内置的环境数据。
可以在开发者工具的控制台工具查看loaded中是否有 error,有没有 glTF 的报错。 由于目前 gltf 验证走的严格模式,比如某些 mesh 使用了目前暂不支持的 accessor.normalized,或者 uv 数量 超了,就不进行渲染了,需要通过过滤规则规避。
// accessor.normalized 的报错
Unhandled promise rejection GLTF validation failed at [AccessorNode]: [10602] Normalized accessors are not supported.
这个扩展不支持,基础库 2.31.1 后 支持 gltf 非严格模式。
// feature: gltf 可以忽略某条规则,
// 可以填多个error编号,编号由console报出,填-1则忽略所有规则。
<xr-asset-load type="gltf" asset-id="gltf-normalized" src="/assets/glb/yuge_04.glb" options="ignoreError: 10602"/>,
glTF 里面的节点是 Shadow 元素。在获取 glTF 组件后。
通过 getInternalNodeByName 获取某一个 Element。
获取对应的 Element,然后直接操作这些影子节点即可。
通过 meshes 获取所有 Mesh组件。
通过 getPrimitivesByNodeName 根据 GLTFNode 的 name 字段来获取其下的所有 Mesh组件。
通过 getPrimitivesByMeshName 根据 GLTFMesh 的 name 字段来获取其下的所有 Mesh组件。
获取对应的 Mesh组件。
通过 Mesh 可以获取对应的 材质 组件,然后再动态修改材质。
具体可以参考文档 https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/gltf/specification.html
可以通过 clipNames 获取所有片段的名称。 https://developers.weixin.qq.com/miniprogram/dev/api/xr-frame/classes/Animation.html#clipNames 动画名对应关系,可以参考官方文档,https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/gltf/specification.html#gltf
动画的名字 idle,对应的是 .gltf 文件中 animations 数组节点的每一个元素的 name 属性(参考官方文档)。
如果 .gltf 文件内的动画节点没有 name 属性,则会自动给动画分配名字 gltfAnimation#x,
其中 x 是数字编号,从0开始:gltfAnimation#0, gltfAnimation#1, 以此类推。
如果 .gltf 文件内有多个name相同的动画,也会使用这个规则,在名称后面添加#x作为动画名称,以此来区别。此时如果用不加#x的原始名称来索引动画,会返回#0的动画。
WXML
里面可以用 bind:anim-stop="handleAnimationStop",具体可以参考案例集里面的,AR典型案例 - 微信球案例
脚本添加
可以参考事件系统
https://developers.weixin.qq.com/miniprogram/dev/component/xr-frame/core/event.html