RTS游戏框选移动

本教程将教大家实现RTS游戏中的框选选中人物、右键点击移动的功能。
点我下载教学工程
点我下载工程素材

功能结构

本教程有5个需要实现的功能

  1. 框选角色
  2. 在框选的角色身上生成选中框
  3. 人物移动
  4. 鼠标移到屏幕边缘时移动视野
  5. 场景视野缩放

布置场景

首先,我们新建3个图层

  • HUD: 放置选中框、框选框
  • 人物:放置可操作角色
  • 背景图:放置背景图片

创建士兵对象,为该对象添加自动寻路能力

创建框选框、选中框 九宫格对象,编辑九宫格缩放边距

创建背景图片

将对象放入各自图层中

实现框选

添加全局变量 最后点击x、最后点击y,用于后面控制框选框的位置

士兵对象添加实例变量【是否选中

新建事件分组【框选

当左键点击士兵时,士兵状态变为选中

左键点击空白位置时,士兵状态变为未选中

设置全局变量,当鼠标左键按下时,【最后点击x/最后点击y】的值为鼠标的坐标

当按住左键时,并且当前鼠标的坐标与最后点击坐标距离超过16像素时,显示框选框,并设置坐标大小
位置公式:x:min(鼠标操作.x, 最后点击x)    y:min(鼠标操作.y, 最后点击y)
尺寸公式:abs(鼠标操作.x - 最后点击x)    abs(鼠标操作.y - 最后点击y)

最后,当鼠标松开、或者距离小于16时,隐藏框选框

实现以上事件后,预览游戏,即可看到效果。 按住鼠标左键拖动,框选框就会显示。

接下来实现框选选中人物的逻辑。 当鼠标左键松开时,根据框选框的位置,将其中的士兵状态设置为选中状态

以上便是框选事件的全部逻辑,下图为事件表全图

生成选中框

下面我们实现选中框的逻辑

首先,当松开鼠标左键时,先销毁之前生成的选中框

在该事件下建立局部变量local_被选中单位数

根据被选中的士兵的数量,设置局部变量

根据local_被选中单位数,循环创建选中框

新建事件,每帧设置选中框的坐标和大小
坐标公式:X:士兵.bboxleft-2     y:士兵.bboxtop-2
尺寸公式:宽度:士兵.bboxright-士兵.bboxleft+4      高度:士兵.bboxbottom-士兵.bboxtop+4

实现以上逻辑后,当左键点击或框选住士兵后,士兵的位置就会自动生成选中框

右键点击移动

新建事件,当松开鼠标右键、鼠标没有悬停在士兵上并且存在选中士兵时,执行动作。

子事件下,新建局部变量:local_平均x,local_平均y

循环所有被选中士兵,将士兵的坐标加在实例变量上

实例变量除以士兵的数量,计算平均值。然后根据平均值,让士兵开启自动寻路。
寻路坐标公式: X:鼠标操作.x+ self.x-local_平均x     Y:鼠标操作.y+ self.y-local_平均y

新建事件,当士兵寻路成功时,沿路径移动

以上即是移动的全部事件,当选中士兵后右键点击地图,士兵就是自动移动过去。事件全图如下:

滚屏镜头移动

镜头的移动比较简单,当鼠标到达屏幕边缘时,每帧移动镜头即可

视野缩放

最后是通过鼠标滚轮实现视野缩放,通过表达式layoutscale可以获取当前场景的缩放比例(默认是1)。

以上便是实现RTS框选移动的全部事件。