Godot游戏练习01-第5节-游戏显示与像素资源

昨天解决了一个不知道什么原因的bug, 也不知道是什么导致的, 但估计大概率是哪里的引用的细节弄错了, 在上节课的基础上重新实现了一次解决了, 今天我们调整一下游戏的显示, 并且加上像素画资源, 让游戏略微生动一点点

游戏显示配置

按照以下步骤设置之后, 游戏画面比例, 元素大小才会合理显示

设计尺寸

进入设置: Project Settings -> Display -> Window -> Size: Viewport Width, Viewport Height

这两个参数用于设置游戏的设计像素尺寸, 像素风游戏一般不设置太大, 我们设置为 640 * 360

其余的也可以自定义设置, 可以打开关闭, 调整选项观察效果

后续也可以在游戏设置菜单中让用户自己控制

画面拉伸

拉伸模式 Stretch Mode: canvas_items, viewport

这个模式决定游戏画面怎样拉伸, 我们的设计尺寸一般来说远小于现在的显示器尺寸, 游戏窗口的实际像素大小也一般大于设计尺寸, 因此就涉及到画面的拉伸处理

canvas_items(高清缩放): 游戏依据窗口实际尺寸重新绘制所有2D元素, 无论怎样缩放, 所有2D元素都会保持清晰锐利
viewport(画面拉伸): 游戏按照设计尺寸渲染画面, 然后将渲染的画面拉伸到实际窗口尺寸

canvas_items渲染时使用的是实际窗口尺寸, 重新计算并绘制2D元素; viewport渲染时使用设计尺寸, 渲染后拉伸图片

拉伸比例

Stretch Aspect:

ignore (不保持原比例, 窗口尺寸变化会压扁/拉高画面内容)
keep (拉伸时游戏画面保持设计比例, 等比缩放)

还有keep width, keep height, expand我感觉用语言很难描述清楚, 可以直接看官网的动图效果 docs.godotengine.org/en/stable/t...

默认窗口尺寸

Project Settings -> Display -> Window -> Window Width/Height Override (需要打开右上角Advanced Settings)

设置默认窗口尺寸可以改变游戏启动时的窗口大小, 若不设置, 则会以设计尺寸打开, 这太小了

像素画资源

纹理渲染设置

Project Settings -> Renderring -> Texture: Linear -> Nearest

更改Texture渲染设置, 可以让像素画资源在缩放时保持清晰锐利, 而不是变模糊

像素资源绘制

对于开发人员来说, 美术是一大难题, 但是我们不能因此过多思考, 增加行动的阻力, 而是以最快的方式解决该问题

如果是需要成套的资源, 可以在itch上逛逛, 选点合适的; 如果是简单资源, 自己用Aseprite绘制一下应付; 实在不行就用简单图形代替, 集中精力在游戏机制实现上

这里我掏出Aseprite, 灵魂画师上线, 随便绘制, 糊弄两下, 看着认得是什么就行了

导出png, 导入Godot

替换游戏资源

替换player中的sprite2d资源, 调整sprite2d偏移, 调整Collisionshape形状和位置, 新增weapon节点, 添加武器的像素画资源

武器指向同步

然后调整输入组件场景的脚本, 添加一个aim_vector, 用于同步瞄准方向, 导出的aim_root用于设定瞄准基点 (在Player节点中我们将其设置为WeaponRoot)

gdscript 复制代码

class_name PlayerInputMultiplayerSynchronizerComponent
extends MultiplayerSynchronizer

@export var aim_root : Node2D

var aim_vector : Vector2 = Vector2.RIGHT
var move_vector : Vector2 = Vector2.ZERO

func _process(_delta: float) -> void:
	if is_multiplayer_authority():
		move_vector = Input.get_vector("move_left", "move_right", "move_up", "move_down")
		aim_vector = aim_root.global_position.direction_to(aim_root.get_global_mouse_position())

之后记得将aim_vector设置到同步属性列表中

最后调整player, 获取aim_vector, 并应用于WeaponRoot节点, WeaponRoot瞄准逻辑运行于所有peer上, 但玩家移动逻辑仅在服务端(authority)上运行, 之后通过位置同步到其余peer

gdscript 复制代码

func _process(_delta: float) -> void:
	var aim_vector := player_input_multiplayer_synchronizer_component.aim_vector
	weapon_root.look_at(weapon_root.global_position + aim_vector)
	if is_multiplayer_authority():
		var input := player_input_multiplayer_synchronizer_component.move_vector
		velocity = input * move_speed
		move_and_slide()

看看效果

使用了像素资源后的观感会好很多, 即使是随手糊弄的灵魂画作也感觉有点活力了!