这一篇是之前曾经就说过的冷却时间的实现方式,废话不说我们先看效果:
上图左边的柱形动画是之前在QA里就介绍过的,今天我们要实现的就是右侧那种钟形的冷却时间动画,其实这个方法也是借花献佛,主要借用了Yellowafterlife的这篇文章——GameMaker: Circular cooldown rectangle 中的脚本,严格来说,本文只算个简单的脚本使用说明,原文详细的解释了脚本实现的思路和原理,推荐喜欢研究的同学深入阅读~
简单说明
这个脚本利用了绘制基本几何体的方法来绘制这个动画,同时使用了扇形图元,基本的原理就是先绘制一个矩形蒙版图像,然后根据冷却时间的变化(时间进度)来逐步缩小绘制的区域,期间需要根据进度值来不断计算绘制的角度变化。
在使用这个脚本时有一些注意事项:
- 可以在调用方法前使用draw_set_alpha和draw_set_colour来定义绘制的不透明度和颜色(用完记得要恢复)
- 原方法绘制了一个矩形,如果你想绘制圆形,可以使用纹理贴图来实现
- 对调x1和x2的传入顺序可以切换顺时针/逆时针动画方向
- 传入的value并不是冷却时间而应当是当前剩余的冷却进度(百分比)
代码
/// draw_rectangle_cd(x1, y1, x2, y2, value)
///@param x1
///@param y1
///@param x2
///@param y2
///@param value
var v, x1, y1, x2, y2, xm, ym, vd, vx, vy, vl;
v = argument4
if (v <= 0) return 0 // 进度为0则不绘制
x1 = argument0; y1 = argument1; // 定义左上角
x2 = argument2; y2 = argument3; // 定义右下角
if (v >= 1) return draw_rectangle(x1, y1, x2, y2, false) // 填满冷却区域
xm = (x1 + x2) / 2; ym = (y1 + y2) / 2; // 定义中心点
draw_primitive_begin(pr_trianglefan)
draw_vertex(xm, ym); draw_vertex(xm, y1)
// 绘制不同的角:
if (v >= 0.125) draw_vertex(x2, y1)
if (v >= 0.375) draw_vertex(x2, y2)
if (v >= 0.625) draw_vertex(x1, y2)
if (v >= 0.875) draw_vertex(x1, y1)
// 计算角度:
vd = pi * (v * 2 - 0.5)
vx = cos(vd)
vy = sin(vd)
// 向量控制
vl = max(abs(vx), abs(vy))
if (vl < 1) {
vx /= vl
vy /= vl
}
draw_vertex(xm + vx * (x2 - x1) / 2, ym + vy * (y2 - y1) / 2)
draw_primitive_end()
示例下载
第一张图中的例子放在网盘了欢迎下载,包含了这个CD时间的脚本以及很粗糙的一个技能拖拽的实现orz
链接:https://pan.baidu.com/s/1bqf44Th 密码:y022
多谢