Navigation

    CreatiCode Scratch Forum

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • CreatiCode

    三维 - 跳板游戏(难度:5)

    小教程
    1
    1
    590
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • A
      TCode Admin last edited by admin

      介绍

      在这个小教程里,你会做一个有趣的跳板游戏:

      v4a.gif

       

      玩家需要通过奔跑和跳跃达到终点,而且最快到达的玩家会被显示在一个排行榜上。

       
       

      第 1 步 - 草地场景

      作为开始,请你在创益编程平台上创建一个新的项目,去掉用不到的小狗角色,然后把另外一个空白的角色命名为"玩家".

      在这个玩家角色里,添加下面这些积木。它们会创建一个草地三维场景,同时显示三维坐标系。

      46cb497c-249d-4bd7-a269-af03651d2e38-image.png

       
      程序的运行结果如下:

       
       

      第 2 步 - 添加 3 个新角色

      这个“玩家”角色将包含所有用来创建和控制玩家化身的程序。这个游戏还有另外3个组成部分:

      • 平台:所有的跳板
      • 目标:目标区域
      • 控制:游戏控制逻辑

      因此,请添加 3 个空白的角色,并将它们命名为“平台”、“目标”和“控制”。

      5da4765a-1cd7-49ba-b383-8cdf672a6952-image.png

       
       

      第 3 步 - 广播 3 条消息

      在添加玩家化身之前,让我们先在其他 3 个角色中把其它游戏元素搭建起来。我们可以先在“玩家”这个角色里发送 3 条消息,并等待它们全部处理完。

      6cfa3184-9d51-4413-b299-491753fceb03-image.png

       
       

      第 4 步 - 添加第一个跳板

      现在让我们切换到平台角色。当它受到了“添加平台”的消息时,它会添加第一块跳板。它将是一个 400 x 400 的方盒子,厚度为 10。你可以选择任何纹理,例如“木材07”。

      82c53778-81c2-4c4d-ac46-c23c11bf361e-image.png

       
      它应该是这样的:

      g4.gif

       
       

      第 5 步 - “Z 起点”变量

      所有的跳板都会漂浮在空中,这样如果玩家化身从跳板上掉下来就会输掉比赛。但是,此时,我们还不确定这些跳板应该在多高的位置。因此,我们可以使用一个名为“Z 起点”的新变量,并使用这个变量来设置我们板的 z 位置。我们暂时将此变量设置为 100,这样便于我们测试程序,而且以后我们可以很容易把这个变量的值变大。

      10a3703b-f864-4a15-a82b-49de32e706c5-image.png

       
      现在这个跳板会浮动在 100 的 Z位置:

      g5.gif

       
       

      第 6 步 - 复​​制到第二块跳板

      在添加第二块跳板的时候,虽然我们可以添加一个新的盒子,更好的方法是复制第一块跳板。这样不仅速度会更快,还能节省一些存储空间。

      复制第二块跳板后,我们可以使用“更新大小”积木来改变它的大小和形状。例如,我们可以让它在 X 方向上宽 200,在 Y 方向上长 800。

      af07d070-d613-4b28-8e18-e09b0f95637a-image.png

       
      现在新跳板将与第一块跳板重叠很大一部分:

      g6.gif

       
       

      第 7 步 - 移动第二块跳板

      现在让我们决定将第二块跳板移动到哪里。如果你不确定它的新坐标是什么,可以先使用“位置工具”拖动它到理想的位置。在下面的示例中,我们将第二个跳板沿着Y轴向前拖动,然后添加“移动到”积木,其中的参数将自动被设为当前物体的位置。我们仍然可以更改这些位置值,例如将 Y 位置四舍五入到 800。为了让它与第一块板处于同一水平高度,我们仍将使用“Z 起点”作为其 Z 位置。

      g8.gif

       
       

      第 8 步 - “添加跳板”积木

      每当我们添加新跳板时,我们都会使用相同的一组积木:复制、更新大小和移动。因此,如果我们为这一组步骤定义一个新的块,将使我们的程序更加简洁。我们仍然通过一些输入参数来定制每个跳板的大小和位置。

      请创建一个名为“添加跳板”的新积木,其中包含 5 个输入,如下所示:

      46d0f7ab-47bd-4a7b-b18b-8e1b9631a374-image.png

       
      然后将已有的 3 个积木移动到这个新积木的定义中,并应用 5 个输入积木。

      g2.gif

       
      现在我们可以使用这个新积木来添加第二块跳板:

      45abfa23-79aa-456f-bfd1-456e76f30d43-image.png

       
       

      第 9 步 - 再添加 4 个跳板

      现在你可以使用新的积木“添加跳板”来随意添加更多的跳板。这里有些例子。请注意,你可以将 Z 位置设置在第一块跳板的上方或下方,只需要在“Z 起点”上增加一个正数或负数。

      aaab8481-515e-4b14-a92e-f679cdb3ae16-image.png

       
      它们看起来像这样:

      g4.gif

       
       

      第 10 步 - 添加玩家化身

      现在平台已经准备就绪,我们可以切换回到“玩家”角色。

      首先,让我们添加一个新的化身。你可以选择系统提供的任何头像。给化身添加 3 个动画能力:“跳在空中”、“跑”和“胜利”。将它移动到第一个跳板上方( Z 位置 200)。

      另外,让我们添加一个追踪摄像头来跟随化身移动。它的“z 偏移”应该是 50,即化身高度的一半。这杨摄像头将瞄准化身的腰部而不是脚部。

      251cf12f-93e1-44d6-be21-1c1f35b4c733-image.png

       
      化身看起来像这样:

      g5.gif

       
       

      步骤 11 - 重力和碰撞

      为了让化身向下降落(而不是漂在空中),我们需要给它设定重力。比如说,我们可以把重力设置为 800 。如果你使用更大的数值,化身会下降得更快。

      为了让化身站在跳板上(而不是从跳板中穿过去),我们需要开启化身和其他所有角色(包括跳板和目标)之间的“碰撞”。注意,对于化身和模型,我们需要把“z 位移”设置为高度的一半。

      3e466e93-502d-49f7-8544-95434d5e5db7-image.png

       
      现在化身将落在跳板上并站在上面:

      g6.gif

       
       

      第 12 步 - 控制玩家化身的主循环

      现在我们添加玩家化身的重复循环,通过处理键盘事件来控制化身的运动。由于化身可能在跳板上或在空中,我们可以分别定义 2 个新的积木来处理这两种场景:“在空中”和“已着陆”。

      为了判断化身是否接触到跳板,我们可以使用“角色物体在下方被阻止”积木。如果化身被其下方的任何障碍物阻挡,这个积木将报告数值 1。

      cbc7470a-9dfa-4c75-b54a-171aca899122-image.png

       
       

      第 13 步 - 添加 “设置方向” 积木

      在“已着陆”积木的定义中(仍在玩家角色中),我们首先需要设置化身面向的方向,然后设置它的速度。我们可以创建一个新的积木“设置方向”,专门用于设置化身的方向,这样我们的程序会更容易阅读和修改。

      3b908b66-5cf4-4ddc-9b51-28496c2c0324-image.png

       
       

      第 14 步 - 设置按下“w”时的前进方向

      现在让我们在玩家角色中定义之前创建的“设置方向”积木。当“w”键被按下时,我们希望化身朝向与摄像头相同的方向。这样,玩家可以通过旋转摄像头来控制化身向前移动的方向。

      我们可以使用摄像头的“侧视角度”属性(也就是水平旋转角度)读出它当前的方向,然后让化身面向那个方向。

      7f451e78-8c2f-429a-a8bf-290f0d76025d-image.png

       
      现在如果我们再次运行这个项目,我们可以拖动鼠标左键来旋转摄像头,然后按“w”将化身转向我们观看的方向。事实上,当我们旋转摄像头时,如果我们一直按住“w”键,化身将一直保持与摄像头相同的方向。

      g9b.gif

       
       

      第 15 步 - 处理其他 3 个方向

      其他 3 个方向的逻辑非常相似。 “s”键将使化身朝向摄像头,与相机的方向相反。 “a”和“d”键将使化身面向左侧或右侧。

      489423e2-1605-44fe-bad2-568aaed2368d-image.png

       
      现在化身可以根据当前摄像头的方向转向这 4 个方向:

      g10b.gif

       
       

      第 16 步 - 处理 4 个对角线方向

      为了让玩家更好地控制化身,让我们再添加 4 个对角线方向的逻辑。例如,当玩家同时按下“w”和“a”时,我们可以将化身转向左前方,也就是摄像头的方向加上315度。

      请注意,我们需要在检查单个按键之前检查这些双键组合。比如说,我们应该检查“w”和“a”是否同时被按下,只有在排除这个情况之后,我们才可以检查是否只有“w”被按下。如果我们先检查“w”是否被按下,那么我们会将化身转向正前方,那就没法正确处理“w+a”的组合了。

      d4.gif

       
      这是我们同时按下 2 个键时的结果:

      d2b.gif

       
       

      第 17 步 - 设置玩家化身的速度

      现在我们可以控制化身的方向。如果 4 个键中的任何一个被按下,我们就应该让化身移动。如果他们都没有被按下,我们应该让化身停止。

      请注意,“前进速度”将使化身朝其当前面向的方向移动。

      2390657a-3b35-439f-8818-aa55601882f7-image.png

       
      现在化身可以在我们按键时四处移动了:

      d5.gif

       
       

      第 18 步 - 添加动画

      当化身在移动时,我们还应该将其动画设置为“跑”。当没有任何键被按下时,我们应该切换回“待命”动画。

      eb379a84-61d0-46f4-9f1f-f3b32cf43cec-image.png

       
      现在我们化身可以作出跑的动作了:

      d6.gif

       
       

      第 18 步 - 让化身跳起来

      当 SPACE 键被按下时,化身需要跳起来。为此,我们要设置化身的“上升速度”。

      99647278-96b4-4023-8f2b-8d885b590cf6-image.png
       
      你应该还记得,在第 11 步中,我们已经设置了化身的“重力”。重力和上升速度是这样协同工作的:

      1。当我们按下 SPACE 时,上升速度被设置为300,这使化身开始上升。
      2。随着时间的推移,重力会逐渐降低上升速度,让上升速度越来越小。这时我们会看到化身仍然在上升,但它在逐渐变慢。
      3。当化身的上升速度变为0时,它达到了这次跳跃的最高点,并开始下降。
      4。重力会继续让已经是负数的上升速度继续变小,这让化身的下降越来越快。
      5。如果化身落到任何障碍物上,或者它的Z位置变为0,它会停止下降,它的上升速度也会被重置为0。

       
      这是化身跳跃的样子:

      d7.gif

       
       

      第 19 步 - 跳跃动画

      当化身在半空中时,我们需要将其动画更改为“跳在空中”。我们可以把动画积木加入到“在空中”积木的定义中:

      f6ccdef9-a91f-4911-8f95-2b5ed4fbafd5-image.png

       
      现在跳跃动画可以显示出来了。但是,您会注意到一个小问题:化身在跳跃时身体会稍微向右偏移一些。

      d8.gif

       
      这很可能是由于化身的动画数据有错误。为了解决这个问题,我们可以在 x 方向上添加一个 -7 的偏移量,这将使化身向左平移 7 个单位:

      df620b94-136c-41b1-9033-e626b1970dd8-image.png

       
      这是更正后的跳跃动画:

      d9.gif

       
       

      第 19 步 - 在空中改变方向

      当化身在半空中时,我们是否应该允许玩家改变它的方向?如果我们想让游戏更贴近现实,那么我们就不应该允许这个操作,因为没有人可以在跳跃的中途改变身体的移动方向。然而,如果我们添加这个操作,它将使游戏玩起来更有趣,因为玩家将对化身会有更好的控制。

      在这个项目中,让我们允许这个操作。我们可以简单的复用“设置方向”积木:

      13fcfba1-9210-4fd9-b157-985965d28ec1-image.png

       

      现在化身跳起来后,我们还可以用w/s/a/d四个键改变它的飞行方向了:

      d10.gif

       
       

      第 20 步 - 允许在空中开始移动

      现在我们需要回答一个类似的问题:如果化身垂直向上跳跃(移动速度为0),我们是否应该允许化身在半空中开始向前移动?为了让游戏更有趣,我们还是会允许玩家这样操作。我们可以从“已着陆”积木中复制这些积木:

      4c98bc27-9b26-4df0-bc8d-6c3fe040ac4b-image.png

       
      请注意,我们不需要再更改动画,因为化身在空中时会保持“跳在空中”的动画。现在我们可以按 SPACE 让化身直接向上跳,然后按 w/s/a/d 键中的任一个让化身移动:

      d11.gif

       
       

      第 21 步 - “玩家速度”变量

      目前,化身始终以每秒 300 个单位的速度移动。为了让游戏更有趣,我们可以添加这样一个功能:如果玩家一直按下“w”键,那么化身就会越跑越快。这样化身在一直往前跑的时候会让人感觉它获得了一些“冲力”。

      为了让跑步速度可以变化,我们需要用一个新的变量“玩家速度”来代表它。这个变量最初应设置为 300,这将是化身的默认速度。我们最好将所有变量初始化代码放在最开始,这样以后会很容易找到这些积木。

      e9905cda-c171-4be7-a58a-c471293d00f4-image.png

       
      接下来,我们在设置化身的前进速度和上升速度时应该使用“玩家速度”变量。如果速度数值越大,那么化身就会跑得更快、跳得更高。我们需要在“已着陆”和“在空中”中都使用这个变量。

      ca32780b-a398-4dc6-809d-ce96ac9db0f4-image.png

      ce9423bb-d378-4cf3-9abf-17adc57e73c1-image.png

       
       

      第 22 步 - 加速化身

      现在让我们通过更改“玩家速度”变量来加速化身。在“已着陆”积木的定义中,我们可以简单地检测“w”键是否被按下。

      • 如果它是被按下,我们将“玩家速度”变量增加 5,除非它已经达到 900 或更高。
      • 如果它没有被按下,我们将“玩家速度”重置为 300。

      20e9a958-78d7-4255-bae4-75b34f81c0bf-image.png

       
      现在我们可以清楚地观察到化身的加速。请注意,如果我们按下“w + a”或“w + d”,“w”键仍然是被按下的,因此化身也同样会加速。

      d13.gif

       
       

      第 23 步 - 动画速度

      当化身跑得更快时,它的跑步动画仍然保持相同的速度。我们其实可以让跑步的动画播放得更快,这样玩家更容易观察到化身的加速。

      请创建一个名为“动画速度”的新变量,并将其用作“跑”动画的速度比例。我们可以使用“玩家速度”来计算动画的速度比例。例如,当玩家速度为 300 时,动画应以 100 速度比例播放。当玩家速度为 900 时,动画应以 300 的速度比例播放。因此,动画速度等于 100 乘以 玩家速度 与 300 的比率。

      55ec1bc0-5cad-46e7-9b5d-f60c07fcbc7b-image.png

       
      你现在可以观察到当化身跑得更快时,动画也会加快:

      d14.gif

       
       

      第 24 步 - 为阴影添加光源

      下面我们让化身在跳板上投下阴影。这不仅会让游戏看起来更逼真,还会给玩家一些提示,让玩家知道化身在空中跳跃时会降落在哪里。

      要使用阴影,我们需要做三件事:添加光源,使化身投射阴影,并使跳板接收阴影。

      我们应该在程序一开始就添加光源,也就是在添加任何物体之前。由于“草地”场景已经包含了一些相当明亮的光源,我们需要先将它们删除掉。

      要投射阴影,我们应该添加一个单向光源来模拟阳光。我们可以称它为“光源1”。这个光的方向是 x = -0.1, y = 0, z = -1:它会从上到下照射,但稍微向左偏移(负 x 方向),这样即使化身静止不动,我们也能看到一些阴影。

      448b14cf-02dd-4d2a-ac83-60fc6c13afd8-image.png

       
      添加这 2 个积木后,化身变得很暗:

      s5.gif

       
      为了照亮它,让我们再添加一个环境光源。它的强度应该是比较低的,比如50,否则会使化身的影子很难看清。

      6b1ed8e8-a86b-4e1d-9ce9-f6f037d8aca1-image.png

       
      现在化身看起来就清晰多了:

      s6.gif

       
       

      第 25 步 - 投射和接收阴影

      要使化身投射阴影,我们应该在添加化身后立即改变它:

      43d63740-798d-4eb2-b1ca-7c0cc7989b96-image.png

       
      为了使跳板接收并显示阴影,我们需要在添加每个跳板后立即更改它。这必须在 平台 角色中的 两处 完成:

      f2afec31-70b8-4013-9429-0e5f68262546-image.png

       
      现在你应该看到这样一个漂亮的阴影了:

      s7.gif

       
       

      第 26 步 - 添加目标区域

      现在我们已经准备好化身和平台,下一步是处理结束游戏的部分。首先,我们需要在平台的末端添加一个目标区域。

      在“目标”角色中,当我们收到“添加目标”这个消息时,我们可以在最后一个跳板后面添加一个带有彩虹纹理的圆柱形平台。它的名字应该设置为“目标”,而且它需要接收和显示阴影:

      93ab1879-b0da-497a-b73d-6c9d3103ed10-image.png

       
      这个目标区域会像这个样子:

      g21.gif

       
       

      第 27 步 - 主循环

      在我们添加更多积木之前,是时候稍微清理一下我们现有的程序了,因为玩家角色中的主要积木堆已经变得太长了。

      让我们定义一个名为“主循环”的新积木,并将现在的重复循环移到那里:

      main2.gif

       
       

      第 28 步 - 检测玩家胜利

      要赢得比赛,化身必须站在目标平台上。在主循环中,每当化身落在某个障碍物上时,我们应该查看那个障碍物是否就是目标。

      如果那个障碍物的名字是“目标”,那么我们就知道玩家已经完成了挑战。我们应该广播“胜利”的消息,然后使用“终止”积木退出这个重复循环。

      3c29b1b7-0c22-462c-a0ec-7347736c41ba-image.png

       
      注意,这些新的积木都是加在化身站在障碍物的情况下的。此外,在“终止”积木运行之后,重复循环将停止,因此玩家将无法再使用键盘来控制化身了。

       
       

      第 29 步 - 庆祝动画

      玩家完成挑战后,我们应该展示一些庆祝动画。我们需要把化身的速度设置为 0,让它停下来,然后开始“胜利”的动画。我们还应该将化身转向摄像头,以便我们可以看到它的正面。最后,我们应该把摄像头拉近化身,给它一个特写镜头。

      d29e6897-331e-4e6e-bd54-72f7d0b4b695-image.png

       
      下面就是庆祝的样子:

      v1.gif

       
       

      第 30 步 - 开始按钮

      由于这个游戏是看谁能在最短的时间内跑到目标,我们需要用一个计时器来统计玩家用了多少秒。

      我们需要在游戏开始时显示一个“开始”按钮,这样玩家就可以在他或她准备好时启动计时器。

      在“控制”角色中,我们应该使用按钮控件来添加这个“开始”按钮。请注意,你需要先运行“添加按钮”积木以将其添加到舞台,然后当你再添加它下面 2 个积木时,这些积木的下拉列表中就能看到这个按钮的选项了。

      9c7e0bf3-ec6e-4dca-b2fb-9d3b71926f3e-image.png

       

      该按钮将如下所示:

      a9ec6621-930d-414f-9ac6-14df6b9a31f8-image.png

       
       

      第 31 步 - 3 个游戏阶段

      在点击“开始”按钮之前,玩家应该无法控制化身。在玩家点击“开始”按钮后,他才会获得化身的控制权,而我们也应该在那个时候开始计时。

      为了确保我们正确地控制游戏的不同阶段,我们可以创建一个新变量“游戏阶段”。它将首先被设置为“等待开始”。当玩家单击“开始”按钮后,我们将游戏阶段更改为“已开始”。稍后,当玩家到达目标区域时,我们会受到“胜利”的消息,而这个时候我们可以将游戏阶段更改为“已结束”。

      8e9cdc5f-a11d-4e7b-93ce-0f911f8884a0-image.png

       
       

      第 32 步 - 在游戏开始前限制玩家的控制

      在游戏开始之前,玩家应该无法用键盘控制化身,因为我们还没有启动计时器。在“玩家”角色中,我们可以使用“游戏阶段”变量来确保这一点。我们将在游戏阶段改变为“已开始”后才进入主要的控制循环。

      412521cf-ee3a-4289-a721-fc6f99ae22e7-image.png

       
       

      第 33 步 - 计时器显示

      单击“开始”按钮时,我们应该删除该按钮,并在底部添加一个标签,用来显示计时器当前的时间。

      78b5c63e-5439-48b3-8ab1-5a786f83ee74-image.png

       
      当我们点击“开始”按钮时,它看起来像这样:

      v3.gif

       
       

      第 34 步 - 显示当前游戏时间

      添加时间标签后,我们可以将计时器归零,并开始显示当前的游戏时间。我们可以每隔 0.1 秒就更新一次时间显示。我们需要重复的更新时间,直到游戏阶段变为“已结束”。

      83d8910a-6df4-42f1-9f68-10499c5c6d45-image.png

       
      让我们来测试一下游戏时间的显示。你可以看到计时器在单击“开始”按钮后才开始计时,并在化身落在目标跳板上时停止计时。

      e2dddx.gif

       
       

      第 35 步 - 记录游戏时间

      在玩家到达目标点后,我们需要将游戏时间作为他/她的“分数”记录下来。这个分数将用来给这个玩家在排行榜上的进行排名。为此,我们可以使用“游戏”扩展类别中的“记录玩家得分”积木。

      之后,我们应该添加另一个按钮,让玩家可以查看排行榜。

      93a64375-12c1-4f5d-a166-520236ed9691-image.png

       
      这是新按钮的样子:

      bd37849e-063c-4d77-8155-2e57bfb6eb0a-image.png

       
       

      第 36 步 - 显示排行榜

      当玩家单击新添加的按钮时,我们会显示当前的排行榜。我们需要显示使用最少时间到达目标区域的玩家。由于每个玩家的“分数”就是完成游戏花费了多少秒的时间,我们应该显示“最低”分数的玩家。

      注意,如果一个玩家多次运行游戏,所有的游戏时间都会被记录下来,但排行榜只会显示每个玩家的最佳记录。

      1d569e03-16a6-436b-b8d8-a0343f2fe0f1-image.png

       
      排行榜将如下所示,显示排名、玩家姓名、该玩家的最佳游戏时间以及创建该记录的日期。

      a739339a-9134-4cdf-a19b-d99ee155a0bb-image.png

       
      玩家可以通过单击右上角的“x”关闭此排行榜。

       
       

      第 37 步 - 提高高度

      现在我们的游戏已经完成了。在最后,让我们将所有的跳板和化身都移动到更高的 z 位置, 例如 5000。我们现在也可以隐藏 3D 轴了。

      玩家角色:

      fd63c2b0-4f47-467d-9f9a-0fdc225771be-image.png

       
      平台角色:

      3f7e52db-7d64-41dd-9158-13ae321c76e2-image.png

       
      目标角色:

      d1fa42ef-cf80-44e9-8e1e-75ec117b7295-image.png

       
      这是游戏最终版本的演示:

      v4a.gif

       
       

      创意

      你可以通过多种方式扩展这个游戏。以下是一些供你参考的方法:

      • 平台形状、大小和位置:你可以添加不同形状的平台,例如圆柱体和球体。它们可以有不同的大小,并且不必居中对齐。

      • 旋转平台:你可以旋转平台,以便让化身跑步上坡或下坡。

      • 模型:除了使用简单形状制作平台,你还可以使用有趣的模型,例如沙发床或汉堡包。

      • 奖励:你可以在平台上添加额外的物体,当化身喷到它们时,它们会为玩家提供额外的帮助。例如,这个奖励物品可以是一瓶能量饮料,它可以使化身的速度在后面10秒内加倍。

      1 Reply Last reply Reply Quote 1
      • Pinned by  A admin-tcode 0 
      • First post
        Last post