uniApp开发XR-Frame微信小程序创建3D场景 （8） 刚体碰撞
上一篇文章， 我们讲解了
xr-frame 框架下的粒子系统
https://blog.csdn.net/weixin_39318421/article/details/137097137?spm=1011.2415.3001.5331
本篇文章， 我们讲解一下xr-frame框架下刚体和碰撞体的设置方法。
一.物理系统
要学习刚体，我们首先要明白xr-frame框架下的物理系统
场景中，要开启物理系统，我们需要在 <xr-scene> 标签下 配置一个 <xr-physics> 标签。
<xr-scene><xr-physics />...(场景中的其他标签)
</xr-scene>这个 xr-physics 标签代表场景中开启了物理系统，物理系统主要有两个属性
| disabled | 是否禁用物理 | boolean | disable=true的话，效果和不存在<xr-physics>标签时一致。 |
| gravity | 全局重力 | Vector3 | 默认重力(0, -9.8, 0) |
这个 gravity 默认为-9.8.也就是说在Y轴上负方向的加速度为9.8，用来模拟重力的作用。
二. 刚体
有了物理系统，我们要让某个几何体实现自由落体的运动，就需要给这个几何体设置刚体。
<xr-mesh
sphere-shape
shape-interact="collide:true;bounciness:0.9"
rigidbody="mass:5.0"
node-id="mesh-sphere"
position="0 1 0"
scale="0.7 0.7 0.7"
geometry="sphere"
material="ballMat">
</xr-mesh>
上面的代码中我们给一个球体设置了刚体组件 rigidbody 并且给刚体属性 mass 设置了一个5.0
| disabled | 是否禁用刚体 | boolean | disable=true的话，效果和不存在rigidbody属性时一致。 |
| mass | 刚体质量 | number | mass > 0 |
| useGravity | 是否受重力影响 | boolean | |
| constraintsMask | 限制刚体在某个轴上的移动 | number |
上面是刚体组件可以设置的主要属性。
完成了这些配置，我可以看到模拟器中，球体受重力影响加速下坠的物理运动。
三.碰撞
上一步，我们给小球设置了刚体，这一步我们再在场景中加入一个长方形几何体作为桌面，让小球与桌面发生碰撞回弹。
<xr-mesh
cube-shape
shape-interact="collide:true;bounciness:1"
node-id="mesh-plane"
position="0 -1 0"
rotation="0 0 0"
scale="7 0.1 7"
geometry="cube"
material="tableMat">
</xr-mesh>
现在模拟器中预览一下：
这里需要注意，我们并没有给作为桌面的长方形几何体设置刚体，因为刚体的运用主要是为了受物理效果影响。
（1）轮廓 Shape
上面代码中，首先我们设置了几何体的轮廓。
cube-shape
碰撞实际上是轮廓和轮廓间的接触实现的。所需首先需要给两个几何体都设置好轮廓。
（2）轮廓交互 interact
轮廓设置好后，我们还要给两个几何体设置轮廓交互
shape-interact="collide:true;bounciness:1"
这里就是设置的轮廓交互，其属性解释如下
| disabled | 是否禁用交互 | boolean | disable=true的话，效果和不存在shape-interact属性时一致 |
| collide | 是否发生碰撞 | boolean | collide=true的话，发生碰撞，否则发生重叠，默认false |
| bounciness | 弹性系数 | number | 0≤bounciness≤1，仅当collide=true时生效 |
| staticFriction | 静摩擦系数 | number | 0≤staticFriction≤1，仅当collide=true时生效 |
| dynamicFriction | 动摩擦系数 | number | 0≤staticFriction≤1，仅当collide=true时生效 |
在这个实例中，我们将 collide 设置为 true ，也就是要发生碰撞。
bounciness 设置为了1，也就是最大弹性。
再次观察模拟器，我们可以看到小球在桌面上不断做回弹运动。
四.交互事件
碰撞后，我们有时需要做一些后续的处理，这里就涉及到交互事件，我们在桌面几何体上绑定一个碰撞回调函数
<xr-mesh cube-shape shape-interact="collide:true;bounciness:1"
bind:collide-begin="handleCollideBegin"
node-id="mesh-plane"
position="0 -1 0"
rotation="0 0 0"
scale="7 0.1 7"
geometry="cube"
material="tableMat"></xr-mesh>
代码中
bind:clloide-begin="handleCollideBegin"
就是桌面受到碰撞后的回调函数，我们简单在index.js文件中加入处理函数。
//碰撞回调
handleCollideBegin(e){console.log(e)
}