Waivio

Recommended Posts

尝试制作篮球游戏

0 comments

tensaix2j26.044 years agoHive.Blog5 min read

https://images.hive.blog/DQmYf7uEgycGmEpFitaXLfAf2C41ejyw1vKSVjzKVAPfs8C/image.png

物理引擎

上次制作弹珠跟桌球这两款游戏都能用 Box2D 来完成因为我那弹珠跟桌球游戏是2D 的活动范围,3D 的呈现,即使桌球有一小部分需要3D 功能,但可以用一些workaround 来解决。

可是这个篮球必须是完全 3D 的活动范围,所以就必须找一个3D 的物理引擎。

我在github找到一个叫 oimo.js 的物理引擎
https://lo-th.github.io/Oimo.js/#basic

它的demo 看起来很炫。 几千个物体相互碰撞都不会慢。。

https://images.hive.blog/DQmZJVycGfmkvcAn8DkAC6cuy1EB8tgbSj3ijT6T8PjZZ9p/image.png

但实际上用起来, 你会发现它的精确度没有Box2d 那么好。因为这个貌似是用在那些几千个物体互相碰撞的场景,所以个别的物体就不用要求那么准确。

跟Box2D 比,它有两个不足的地方,

  1. Tunneling Effect 的问题没处理好。

Tunneling Effect 就是有些情况下 Collision detection 会漏掉, 特别是物体在高速移动时。 这是因为在游戏里是 frame by frame 去处理的 例如 60 frames per second, 不是像现实那样是 continuouos 连续的, 所以如果有物体的速度很快去碰撞一个很薄的墙壁, 假设collision 本来会发生在 frame n 跟 frame n+1 之间(假设本来应该发生在 frame n.5) ,那这个引擎在 frame n 时就detect 不到collision , frame n+1 也detect 不到 , 那穿透现象就会发生。

在 Box2d 只要 set 那个dynamic body物件的 isBullet = true, 引擎就会用 continous collision detection 的方式去计算。 就解决了 (虽然会慢一点), 但 oimo.js 的 dynamic body 没有这个attribute。

2. Sensor

之前用 Box2d 有个attribute 叫 isSensor 的. 这个set 去true 的话, 这个body 就不会跟其它物件有碰撞, 是专门用来探测有没有物件经过某些区域, 但探测者自己不要给其他body 造成 collision 用的。 在 oimo.js 也没有。

3. Collision Detection Listener 和 Callback

Box2D 的Collision Detection Listener 和 Callback 做得太方便了, 这个 oimo.js 则没有这个东西, 必须自己去它的code 里加入你的 callback。 而且它的document 不齐全。

说完坏处, 在来说好处 。这个 oimo.js 可以直接使用在 Decentraland SDK 里不用特别处理, 因为它每个 module 都有 export 好, 而且跟 typescript compatible 。

它的用法格式跟 Box2D 几乎是一样的, 也是有一个 World ,然后要自己去 Step() 来跑iteration。 只不过它是3D 的, 所以很多东西要用 Vec3


建模

这个游戏建模方面就很简单。 因为就只有一颗球, 一个篮板,跟一个篮筐 + 网, 还有3面墙跟一个地板。

篮球就用一个sphere ,在 blender 里弄 uvmap 就好了。 你会发现要给 球体弄 uvmap 的texture 不是一件简单的事, 因为他的mapping 线条很扭曲。用gimp 弄了很久都看起来不妥。 后来在某论坛找到这个参考。

https://images.hive.blog/DQmT4P3MPioaXYbvab3ddsY5N3dGmK38ewAoTWBWqqZeJJN/image.png

至于uvsphere ,我都尽量用比较少 polygon 的设定,所以看起来没那么圆,会有一点角, 但玩的时候不会特别明显因为球会很小。

https://images.hive.blog/DQmNXHAb1uhn5zvkHvuipydKLb3QoyxYSygNhm3MUGU9JNR/image.png

篮筐 + 网,

用 circle 做篮筐,然后 extrude 下去 , extrude 后的部分用 wireframe modifier 搞定。 虽然那个网看起来不像,但加了白texture 后就还可以。https://images.hive.blog/DQmQst3nvrxLkXEDuwq631vLf1H2xZLvBUQacMVU3a7GS5Y/image.png

篮板,墙,地板就基本上 cube + uvmap texture 搞定。

暂时就说这么多先,有兴趣玩可以到 Decentraland 24, -147 那里玩。

那块地不是我的,是一位叫 红牛的朋友借的。

谢谢阅读。

Comments

Sort byBest
AI
Waivio AI Assistant
How can I help you today?