Sin descripción

8 Ramas

“hujiajun” 7f0178dd60 添加识别图		hace 10 meses
miniprogram	7f0178dd60 添加识别图	hace 10 meses
qa	f30686ea2d init微信小程序	hace 1 año
screenshot	f30686ea2d init微信小程序	hace 1 año
test	e6b213905b test	hace 11 meses
typings	6d158722d8 ui修改	hace 11 meses
.eslintrc.js	f30686ea2d init微信小程序	hace 1 año
.gitignore	f30686ea2d init微信小程序	hace 1 año
LICENSE	f30686ea2d init微信小程序	hace 1 año
README.md	f30686ea2d init微信小程序	hace 1 año
package.json	f30686ea2d init微信小程序	hace 1 año
project.config.json	524368314e 传输id 从下标改 id	hace 10 meses
project.private.config.json	995fda1af7 更新UI 接口显示逻辑	hace 11 meses
tsconfig.json	f30686ea2d init微信小程序	hace 1 año

xr-frame-demo

微信小程序xr-frame系统的示例集。

准备工作

目前需要下载最新的Nightly版本工具，最新的客户端（安卓8.0.29，iOS8.0.29），以及基础库（2.27.1）。

直接体验

二维码以及部分样例的扫描图片详见：官方文档-示例。

https://user-images.githubusercontent.com/7337763/199401152-d3e14ca2-bcde-41aa-902c-dc0fbd6b6358.mp4

快速索引

常见问题QA

基础库版本分布

基础能力

基础案例 PBR材质下渲染的内置图形。

透明画布使用透明画布能力，透出背景。

灯光案例多种灯光作用下的四个白色图形。

动画案例 keyframe 动画案例。

视频案例视频纹理，正式版本预计基础库 v2.32.0 及以上支持。

交互案例简单的拖拽图形旋转移动案例。

显示与图层案例控制节点树的显示案例。

动态节点案例通过 xr-shadow 节点，来动态在其下添加节点，以及用代码加载资源。

渲染目标案例使用 xr-asset-render-texture 生成渲染目标。

粒子系统使用xr-particle，控制粒子系统的显示。

后处理系统展示了内置的几种后处理效果。

全局环境数据与局部环境数据动态更改 xr-mesh 局部环境数据的案例。

AR 能力

相机渲染案例 AR相机与glTF一同渲染的基础案例。

平面识别案例基础的平面识别案例。

平面识别叠加Marker案例平面识别叠加Marker案例

相机旋转案例 threeDof，用于在不需要SLAM的场景，支持手持相机旋转，兼容性较好。

2DMarker案例 2DMarker识别案例。

OSDMarker案例 OSDMarker识别案例。

人脸案例人脸识别案例。

人手案例人手识别案例。

人体案例人体识别案例。

物理能力

射击积木案例射击积木案例

投球入筐案例投球入筐案例

glTF 能力

金属头盔案例包含完整MetalRougnessMap、EmissiveMap、NormalMap、OcclusionTexture 以及各类因子的 glTF 模型案例。

动画案例包含 glTF 动画，以及 keyframe 动画协作的案例

加载与多光源案例组件和页面通信实现资源加载时覆盖加载界面，以及多个动画光源案例。

morph案例 morph targets的使用。

无光照案例应用 KHR_materials_unlit 扩展的 glTF 案例。

扩展 - 压缩纹理

扩展 - KHR_texture_transform 贴图矩阵变换案例应用 KHR_texture_transform 扩展的 glTF 案例，glTF 贴图矩阵变换支持（需基础库2.31.0）。

扩展 - KHR_materials_pbrSpecularGlossiness 高光光泽度案例

扩展 - KHR_materials_sheen 布料与织物材质的模拟案例 glTF Sheen 扩展，主要用于布料与织物材质的模拟。基础库 2.32.1 支持。

扩展 - KHR_lights_punctual

高级定制

定制组件和元素定制组件和元素并使用。

定制渲染资源定制Effect和Geometry并使用。

通用功能模版

小程序混合通信通过小程序按钮事件，传递速度变量到 xr-frame 组件通信的案例。

Controller 第一人称漫游第一人称相机控制器。

Loading 动态资源加载与使用点击按钮进行对应资源的加载与使用。

Tracker 动态多Tracker切换点击按钮，对应不同识别效果 Marker 的添加与删除。

AR 模型摆放与手势控制点击屏幕摆放，然后单指拖动屏幕进行旋转，双指拖动进行放大缩小。

AR 面向屏幕的面片与模型通过脚本控制的，四个方向各有一个面向屏幕的物体。

AR 平面模式下的 UI 面板 AR环境下，简单的UI面板

Effect 模型切换为Toon渲染(自定义多pass)

Geometry 定制每帧变化的Geometry

glTF 模型更换贴图加载 glTF 模型，调整 glTF 的材质的贴图

glTF 模型动画（脚本、骨骼）

glTF 模型更改渲染状态，glTF设为遮挡模型使用模型做遮挡剔除，让该模型剔除其他物体

glTF 添加模型内UV动画

Touch 点选物体与动画控制

序列帧动画（雪碧图、GIF）使用自定义材质实现的序列帧动画案例。

截屏与分享通过分享系统截屏分享

过滤黑色背景视频通过自定义材质，过滤掉视频黑色部分的案例。

AR典型案例

扫描图片模型透视案例基于 Stencil裁剪实现的基本模型透视效果案例。

传送门效果案例基于平面识别与模版剔除实现的基本传送门效果案例。

平面视频案例基于 2DMarker 实现，扫描工卡照片显示对应的生活场景。

扫描物体查看信息基于 OSD 实现的扫描广州塔或虎年公仔，识别成功后会在物体右上角加上信息提示。

扫描人脸穿戴基于人脸识别的穿戴。

微信球案例扫描手握着的微信纪念球，会显示三维纪念球，点击三维纪念球会播放动画。

扫描还原案例

扫描渲染案例根据三维重建模型与扫描全景图还原的案例，仅使用IBL作为光源，可切换天空盒。

卡其脱离太 xr-frame团队的办公区和成员三维重建，以及与小程序音频系统、2dview协作的例子。

产品级案例

边缘迷走 AR文字互动游戏。

■■■■ ■■■■■■■■■■■■■■■■

版权

实例中用到的所有资源：

README.md