【Godot4自学手册】第十九节敌人的血量显示及掉血特效

2024-03-03 21:52

本文主要是介绍【Godot4自学手册】第十九节敌人的血量显示及掉血特效,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

这一节,我主要学习敌人的血量显示、掉血显示和死亡效果。敌人的血量显示和主人公的血量显示有所不同,主要是在敌人头顶有个红色的血条,受到攻击敌人的血条会减少,并且有掉血数量的文字显示,效果如下:
请添加图片描述

一、创建敌人的血条

1.节点布局

新建Node场景命名为HealthBar,给HealthBar添加3个子节点,一是TextureProgressBar命名为HbarTxp,二是Label命名为ShowLb,三是AnimationPlayer命名为AnimaP。整个场景节点情况如下:
请添加图片描述

保存场景到Scenes文件夹下。

2.设置血条

选择HbarTxp节点, 在其检查器中Textures->Progress选择新建AtlasTexture(纹理图集),然后单击该图集在其属性面板中,将我们做好的血量图片拖拽到Atlas下,操作图如下:
请添加图片描述

下一步单击Region->编辑区域按钮,在弹出的区域编辑器中,吸附模式选择自动裁剪,然后单击红色血条,然后选择关闭。操作过程如下:
请添加图片描述

同理,设置Textures->Over,操作过程类似,只不过背景图片选择血条背景图片框,选择的图片如下:
请添加图片描述

HbarTxp检查器中将Textures->Progess Offset设置为(1,1),如下:
请添加图片描述

最后,在HbarTxp检查器中将Radial Fill->Max Value 设置为1,Step设置为0,Value设置为0,5,参数如下:
请添加图片描述

在编辑器中调整HealthBar居中,最后效果如下:
请添加图片描述

3.设置文本显示

选择ShowLb结点,在其检查器中将Text属性随便输入一个数字10。Theme Overrides->Colors->Font Color选择红色,如下:
请添加图片描述

在编辑器中调整ShowLb到血量条的正上方,最后效果如下:
请添加图片描述

4.设置文字动画

选择AnimaP节点,在其动画面板中“动画”按钮下拉菜单中选择新建动画。
请添加图片描述

新动画名称设置为Hurt。
请添加图片描述

动画时长设置为0.6,将播放头放到第1帧,选择ShowLb,在其检查器中Layout->Transform->Position后面的关键帧按钮将此关键帧添加到动画第一帧。
请添加图片描述

将播放头放到第4帧,向上调整ShowLb到合适位置,同理将该位置添加到第4关键帧。
将播放头放到第1帧,选择ShowLb,在其检查器中Theme Overrides->Colors->Font Color后面的关键帧按钮将此关键帧添加到动画第一帧。
请添加图片描述

同样设置第3帧。将播放头放到第7帧(动画最后),选择ShowLb,在其检查器中Theme Overrides->Colors->Font Color,将透明度设置为0,如下:
请添加图片描述

设置完成后单击后方的动画关键帧将透明度为0添加到动画末尾,最后动画面板中Hurt动画设置如下:
请添加图片描述

最终的动画效果如下:
请添加图片描述

5.编写脚本代码

给跟节点添加添加脚本,命名为health_bar,保存到Scripts文件夹下。并编写如下代码:

extends Node2D
@export var stats:Stats  #定义状态继承自Stats
@onready var hbar_txp = $HbarTxp
@onready var show_lb = $ShowLb
@onready var anima_p = $AnimaPvar oldhealth# Called when the node enters the scene tree for the first time.
func _ready():show_lb.visible=false #血量变化文字隐藏显示oldhealth = stats.health  #记录上次血量stats.health_changed.connect(update_health)  #血量变化信号连接到血量更新UIupdate_health()# Called every frame. 'delta' is the elapsed time since the previous frame.
func update_health():var percentage :=stats.health/ float(stats.max_health)  #计算血量百分比hbar_txp.value = percentage  #将百分比赋给进度条var healthcharge = stats.health-oldhealth #计算血量编号if(healthcharge!=0):		show_lb.text=str(healthcharge) #血量变化复制给lableshow_lb.visible=true  #显示血量变化数字anima_p.play("Hurt") #播放血量位置隐藏动画oldhealth=stats.health  #记录目前血量pass

二、给敌人添加血量

切换到Enemy场景,选择根节点,第一是单击添加子节点按钮,在创建Node结点对话框选择Stats,这个类是我们自定义的状态类,单击创建。
请添加图片描述

第二是单击实例化子场景按钮,在弹出的实例化子场景对话中选择,我们刚才新建的health_bar.tsc场景,然后单击打开按钮,将health_bar实例化到Enemy场景。
请添加图片描述

选中HealthBar结点,然后在其检查器中Stats属性上单击,在弹出对话框中stats,单击确定,这样stats状态就和HealthBar链接起来了。
请添加图片描述

三、编写代码

切换到Enemy代码,编写代码。首先获取状态结点,代码如下:

@onready var stats = $Stats

然后修改hurt_state受伤代码:

stats.health -=10  #受伤一次减去10点血量var dir = hurtdirecion.direction_to(global_position).normalized()if abs(dir.x)>abs(dir.y):if dir.x<0:velocity.x =-knockbackelse :velocity.x =knockbackelse:if dir.y<0:velocity.y =-knockbackelse :velocity.y =knockbackanima_p.play("TakeHit")await  anima_p.animation_finished	if stats.health<=0:#血量小于等于零时,敌人进入死亡状态state=DEATHelse:velocity = Vector2.ZEROstate=CHASE

这样,敌人就有血量显示了。今天就到这了,下节再见!

这篇关于【Godot4自学手册】第十九节敌人的血量显示及掉血特效的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/771028

相关文章

电脑显示hdmi无信号怎么办? 电脑显示器无信号的终极解决指南

《电脑显示hdmi无信号怎么办?电脑显示器无信号的终极解决指南》HDMI无信号的问题却让人头疼不已,遇到这种情况该怎么办?针对这种情况,我们可以采取一系列步骤来逐一排查并解决问题,以下是详细的方法... 无论你是试图为笔记本电脑设置多个显示器还是使用外部显示器,都可能会弹出“无HDMI信号”错误。此消息可能

第10章 中断和动态时钟显示

第10章 中断和动态时钟显示 从本章开始,按照书籍的划分,第10章开始就进入保护模式(Protected Mode)部分了,感觉从这里开始难度突然就增加了。 书中介绍了为什么有中断(Interrupt)的设计,中断的几种方式:外部硬件中断、内部中断和软中断。通过中断做了一个会走的时钟和屏幕上输入字符的程序。 我自己理解中断的一些作用: 为了更好的利用处理器的性能。协同快速和慢速设备一起工作

安卓链接正常显示,ios#符被转义%23导致链接访问404

原因分析: url中含有特殊字符 中文未编码 都有可能导致URL转换失败,所以需要对url编码处理  如下: guard let allowUrl = webUrl.addingPercentEncoding(withAllowedCharacters: .urlQueryAllowed) else {return} 后面发现当url中有#号时,会被误伤转义为%23,导致链接无法访问

C#实战|大乐透选号器[6]:实现实时显示已选择的红蓝球数量

哈喽,你好啊,我是雷工。 关于大乐透选号器在前面已经记录了5篇笔记,这是第6篇; 接下来实现实时显示当前选中红球数量,蓝球数量; 以下为练习笔记。 01 效果演示 当选择和取消选择红球或蓝球时,在对应的位置显示实时已选择的红球、蓝球的数量; 02 标签名称 分别设置Label标签名称为:lblRedCount、lblBlueCount

lvgl8.3.6 控件垂直布局 label控件在image控件的下方显示

在使用 LVGL 8.3.6 创建一个垂直布局,其中 label 控件位于 image 控件下方,你可以使用 lv_obj_set_flex_flow 来设置布局为垂直,并确保 label 控件在 image 控件后添加。这里是如何步骤性地实现它的一个基本示例: 创建父容器:首先创建一个容器对象,该对象将作为布局的基础。设置容器为垂直布局:使用 lv_obj_set_flex_flow 设置容器

C# dateTimePicker 显示年月日,时分秒

dateTimePicker默认只显示日期,如果需要显示年月日,时分秒,只需要以下两步: 1.dateTimePicker1.Format = DateTimePickerFormat.Time 2.dateTimePicker1.CustomFormat = yyyy-MM-dd HH:mm:ss Tips:  a. dateTimePicker1.ShowUpDown = t

『功能项目』战士的平A特效【35】

我们打开上一篇34武器的切换实例的项目, 本章要做的事情是在战士的每次按A键时在指定位置生成一个平A特效 首先将之前下载的技能拖拽至场景中 完全解压缩后重命名为AEffect 拖拽至预制体文件夹 进入主角动画的战士动画层级 双击第一次攻击 选择Animation 创建事件 创建的动画事件帧放在攻击动画挥剑指定处 命名为PerpetualAtt

第49课 Scratch入门篇:骇客任务背景特效

骇客任务背景特效 故事背景:   骇客帝国特色背景在黑色中慢慢滚动着! 程序原理:  1 、 角色的设计技巧  2 、克隆体的应用及特效的使用 开始编程   1、使用 黑色的背景: ![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/7d74c872f06b4d9fbc88aecee634b074.png#pic_center)   2

小程序button控件上下边框的显示和隐藏

问题 想使用button自带的loading图标功能,但又不需要button显示边框线 button控件有一条淡灰色的边框,在控件上了样式 border:none; 无法让button边框隐藏 代码如下: <button class="btn">.btn{border:none; /*一般使用这个就是可以去掉边框了*/} 解决方案 发现button控件有一个伪元素(::after

MFC中Spin Control控件使用,同时数据在Edit Control中显示

实现mfc spin control 上下滚动,只需捕捉spin control 的 UDN_DELTAPOD 消息,如下:  OnDeltaposSpin1(NMHDR *pNMHDR, LRESULT *pResult) {  LPNMUPDOWN pNMUpDown = reinterpret_cast(pNMHDR);  // TODO: 在此添加控件通知处理程序代码    if