手把手教你godot的第一个项目:自由落体方块

3150次阅读 26人点赞 作者: WuBin 发布时间: 2025-02-26 17:06:24
扫码到手机查看

构建框架

使用Godot 4.x 标准版本 windows11系统

新建项目

  • 运行 Godot

  • 点击右侧的 "新建项目"

  • 选择项目位置和名称

  • 选择渲染器为 "Forward+"(默认选项)

  • 点击 "创建并编辑"

创建游戏场景

  • 在场景面板中,点击 "+" 号添加根节点

  • 选择 "Node2D" 作为根节点

  • 重命名根节点为 "Game"

  • 保存场景(按 Ctrl+S),命名为 "game.tscn"

添加球体

  • 右键点击 "Game" 节点,选择 "添加子节点"

  • 搜索并选择 "CharacterBody2D"

  • 重命名为 "Ball"

  • 再次右键 "Ball" 节点,添加 "CollisionShape2D" 子节点

  • 添加 "Sprite2D" 子节点到 "Ball" 下 (这里需要后续操作!)

设置球体的外观和碰撞

  • 选择 "CollisionShape2D" 节点

  • 在检查器中,设置 "Shape" 属性

  • 选择 "新建CircleShape2D"

  • 鼠标拖动并调整球的大小

添加简单的脚本

  • 选择 "Ball" 节点

  • 点击顶部的脚本按钮(或按下 Ctrl+Alt+S)

  • 创建新脚本,保持默认名称 "Ball.gd"

然后在文件中填入下面内容:
extends CharacterBody2D

var gravity = 980
var bounce_strength = -400

#func _ready():
	## 设置ball的初始位置
	#position = Vector2(352, 100)

func _physics_process(delta: float) -> void:
	velocity.y += gravity * delta
	
	var collision = move_and_collide(velocity * delta)
	if collision:
		velocity = velocity.bounce(collision.get_normal()) * 0.8

添加地面

  • 右键点击 "Game" 节点,添加 "StaticBody2D" 节点

  • 重命名为 "Ground"

  • 添加 "CollisionShape2D" 子节点

  • 在检查器中设置 Shape 为 "New RectangleShape2D"

  • 调整大小和位置

  • 在Ground节点下创建Sprite2D节点

最终节点树如下所示:
Game (Node2D)
├── Ball (CharacterBody2D)
│   ├── CollisionShape2D
│   └── Sprite2D
└── Ground (StaticBody2D)
    └── CollisionShape2D
    └── Sprite2D
做完上面的步骤,按F5,发现界面中什么都没有?!

设置主场景和纹理

设置主场景

  • -去到顶部菜单 "项目" -> "项目设置"
  • - 在左侧找到 "应用程序" -> "运行"
  • - 在 "主场景" 字段中选择您的 "game.tscn"

设置纹理

球体现在是看不见的,因为 Sprite2D 节点没有设置纹理。我们需要给它添加一个纹理

所以我们需要继续对1.3和1.6步骤进行后续的操作。给碰撞球体添加纹理。

为1.3步骤中的球体添加纹理:

为 Sprite2D 添加纹理:

  • - 选择 Ball 节点下的 Sprite2D
  • - 在右侧检查器中,找到 Texture 属性
  • - 点击右侧的下拉箭头,选择 "新建 GradientTexture2D"- 设置尺寸为 96x96(与碰撞形状大小匹配)
  • - 选择一个颜色(比如蓝色)
然后这时候再按F5,就可以在界面中看到方块落下,反弹并逐渐静止。

基础知识

Node2D

  • 这是一个基础的 2D 节点类型

  • 用于在 2D 空间中组织和管理其他节点

  • 具有位置、旋转、缩放等基本 2D 变换属性

  • 在您的项目中,它作为根节点用来组织整个场景

CharacterBody2D

  • 这是一个专门用于制作可控制角色的物理节点

  • 具有内置的物理属性(如速度、碰撞检测等)

  • 适合制作受物理影响的游戏对象

  • 在您的项目中,用它来实现小球的物理运动和碰撞

GradientTexture2D

  • 这是一个用于生成渐变纹理的资源

  • 可以创建简单的纯色或渐变效果

  • 在您的项目中用于:

    • 给小球一个可见的外观

    • 给地面一个可见的外观

  • 可以通过设置 width 和 height 来控制纹理大小

Sprite2D :

  • 用于显示 2D 图像的节点

  • 可以显示纹理(比如您使用的 GradientTexture2D)

  • 支持缩放、旋转等变换

StaticBody2D :

  • 用于创建静态的物理物体

  • 不会移动但可以与其他物体发生碰撞

  • 在您的项目中用作地面

CollisionShape2D :

  • 定义物体的碰撞形状

  • 可以附加不同类型的形状(如圆形、矩形等)

  • 用于物理碰撞的检测

脚本代码解释

extends CharacterBody2D

var gravity = 980
var bounce_strength = -400

func _physics_process(delta):
    velocity.y += gravity * delta
    
    var collision = move_and_collide(velocity * delta)
    if collision:
        velocity = velocity.bounce(collision.get_normal()) * 0.8
  1. extends CharacterBody2D

    • 这行表示我们的脚本继承自 CharacterBody2D 节点

    • CharacterBody2D 是 Godot 中用于制作可移动物体的节点类型

  2. var gravity = 980var bounce_strength = -400

    • 定义了两个变量

    • gravity 表示重力加速度,数值 980 模拟现实世界的重力

    • bounce_strength 定义了弹跳力度(虽然在这个代码中暂时没有使用)

  3. func _physics_process(delta):

    • 这是一个特殊的函数,每个物理帧都会自动执行

    • delta 参数表示两帧之间的时间间隔(秒)

    • 用于处理物理相关的更新

  4. velocity.y += gravity * delta

    • velocity 是 CharacterBody2D 内置的速度属性

    • 这行代码让球体受重力影响

    • 每帧都增加向下的速度(y 轴正方向是向下的)

  5. var collision = move_and_collide(velocity * delta)

    • move_and_collide 是移动物体并检测碰撞的函数

    • 返回碰撞信息(如果发生碰撞)

    • velocity * delta 计算这一帧中物体应该移动的距离

  6. if collision:

    • 检查是否发生碰撞

    • 如果 collision 不为 null,说明发生了碰撞

  7. velocity = velocity.bounce(collision.get_normal()) * 0.8

    • 当发生碰撞时,计算反弹后的速度

    • collision.get_normal() 获取碰撞表面的法线方向

    • bounce() 根据法线计算反弹方向

    • x 0.8 是能量损失系数,使每次弹跳的高度逐渐降低

这个代码实现了一个简单的物理系统,让球体:

  • 受重力影响下落

  • 检测碰撞

  • 在碰撞时反弹

  • 每次反弹都损失一些能量(弹得没那么高)

点赞 支持一下 觉得不错?客官您就稍微鼓励一下吧!
关键词:godot
推荐阅读
  • uniapp实现被浏览器唤起的功能

    当用户打开h5链接时候,点击打开app若用户在已经安装过app的情况下直接打开app,若未安装过跳到应用市场下载安装这个功能在实现上主要分为两种场景,从普通浏览器唤醒以及从微信唤醒。

    10374次阅读 687人点赞 发布时间: 2022-12-14 16:34:53 立即查看
  • Vue

    盘点Vue2和Vue3的10种组件通信方式

    Vue中组件通信方式有很多,其中Vue2和Vue3实现起来也会有很多差异;本文将通过选项式API组合式API以及setup三种不同实现方式全面介绍Vue2和Vue3的组件通信方式。

    4902次阅读 368人点赞 发布时间: 2022-08-19 09:40:16 立即查看
  • JS

    几个高级前端常用的API

    推荐4个前端开发中常用的高端API,分别是MutationObserver、IntersectionObserver、getComputedstyle、getBoundingClientRect、requ...

    14970次阅读 989人点赞 发布时间: 2021-11-11 09:39:54 立即查看
  • PHP

    【正则】一些常用的正则表达式总结

    在日常开发中,正则表达式是非常有用的,正则表达式在每个语言中都是可以使用的,他就跟JSON一样,是通用的。了解一些常用的正则表达式,能大大提高你的工作效率。

    14316次阅读 555人点赞 发布时间: 2021-10-09 15:58:58 立即查看
  • 【中文】免费可商用字体下载与考证

    65款免费、可商用、无任何限制中文字体打包下载,这些字体都是经过长期验证,经得住市场考验的,让您规避被无良厂商起诉的风险。

    13110次阅读 1059人点赞 发布时间: 2021-07-05 15:28:45 立即查看
  • Vue

    Vue3开发一个v-loading的自定义指令

    在vue3中实现一个自定义的指令,有助于我们简化开发,简化复用,通过一个指令的调用即可实现一些可高度复用的交互。

    17269次阅读 1386人点赞 发布时间: 2021-07-02 15:58:35 立即查看
  • JS

    关于手机上滚动穿透问题的解决

    当页面出现浮层的时候,滑动浮层的内容,正常情况下预期应该是浮层下边的内容不会滚动;然而事实并非如此。在PC上使用css即可解决,但是在手机端,情况就变的比较复杂,就需要禁止触摸事件才可以。

    15674次阅读 1270人点赞 发布时间: 2021-05-31 09:25:50 立即查看
  • Vue

    Vue+html2canvas截图空白的问题

    在使用vue做信网单页专题时,有海报生成的功能,这里推荐2个插件:一个是html2canvas,构造好DOM然后转canvas进行截图;另外使用vue-canvas-poster(这个截止到2021年3月...

    31017次阅读 2441人点赞 发布时间: 2021-03-02 09:04:51 立即查看
  • Vue

    vue-router4过度动画无效解决方案

    在初次使用vue3+vue-router4时候,先后遇到了过度动画transition进入和退出分别无效的情况,搜遍百度没没找到合适解决方法,包括vue-route4有一些API都进行了变化,以前的一些操...

    26862次阅读 2065人点赞 发布时间: 2021-02-23 13:37:20 立即查看
交流 收藏 目录