🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
# 小爷吴亦凡 本案例的原理是用陀螺仪控制舞台上的图片或视频。 在讲解本案例之前,我们首先需熟悉陀螺仪旋转轴的原理,如下图解释了陀螺仪控制手机如何绕X、Y、Z轴旋转的情况。 ![](https://box.kancloud.cn/250fd987de420a3c5c11e2442e0bd276_900x425.png) **上传视频素材** 注意:为防止视频在不同手机的不兼容性,我们在制作案例前可先将视频导成序列帧的形式再上传进编辑页面 ![](https://box.kancloud.cn/64d609cca5bacc5b3aa93c5c798e7726_900x457.png) 在舞台上添加一个陀螺仪,选择旋转类型,如下图为“绕Y轴旋转角”,同时将其命名为“Y” ![](https://box.kancloud.cn/55a59b701494dcd2ee1f77f8873804c7_900x445.png) **设置关联属性** 选择视频素材,点击其“左”属性右边的“关联”按钮,设置关联属性: 参考物体:“Y” 参考属性:“文本取值” 关联方式:“控制点插值” 主控量:“-40” 被控量:“0” 主控量:“40” 被控量:“-1198” (注意:具体数值可提前在手机上观察得出) ![](https://box.kancloud.cn/0484eb274ac85707e7aef0fa1e593571_900x436.png) 同时添加另外一个陀螺仪,设置其类型为“绕X轴旋转角”,为其命名为“X”。 ![](https://box.kancloud.cn/5302ef6ca20afe53b313f71b5e17851f_900x427.png) 选择视频素材,点击其“上”属性右边的“关联”按钮,设置关联属性: 参考物体:“X” 参考属性:“文本取值” 关联方式:“控制点插值” 主控量:“20” 被控量:“0” 主控量:“80” 被控量:“-173” ![](https://box.kancloud.cn/61f0873a17c2b9c1d43d196910932ade_900x431.png) 观看本节视频教程: http://cdn1.mugeda.com/course/4/4.1/4.1.12.mp4