Matter.js之给box添加键盘控制
本文最后更新于:1 年前
Matter.js是个开源的2D物理引擎,它提供了一个简单的API,可以让我们以更简单的方式来操作物理引擎。但是却没有提供一个简单的控制器,我们需要自己写一个控制器,来控制画布中的物体运动。本文章基于上次制作的demo,给box添加键盘控制。
思路
代码写的默认变量都是暴露在外面的,因此打算直接用js的按键检测的方式实现键盘控制,这样就可以让我们的box自由移动了。
首先需要认识一下matter.js提供的操作对象的方法
- 力
每个body都有一个force属性,用来赋予该对象一个力,由于本引擎是个2D引擎,所以用的是vector2,也就是二维向量。
force属性本身的值就是一个vector2类型的,该类型表示一个二维向量,向量有两个属性,x和y,可以表示力的方向,这里如果有什么不懂的建议补一下高中数学平面几何,内容很简单。
举个例子,我们可以把一个body的force属性设置为:表示的就是一个平行与x轴且方向为正方向(右侧)的向量,其中y值为1,表示力的大小.1
body.force = {x: 1, y: 0};
关于平面坐标系,后面会详细解析,在这里只为实现功能
这样的话只要判断按键的代码,然后赋值不同的向量给对象的force属性就可以实现鼠标控制对象运动的功能了。
加下来就是我的代码了,代码比较简单,一目了然
1 |
|
效果
本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!