hykwf678233
hykwf678233

相互支持,有拍必回。

用Gamemaker S2

我就给大家介绍一下,用GMS2来做一款填色游戏。在GMS2里我们可以对素材的碰撞范围设置为精准(如图)

![1.png](https://cdn.steemitimages.com/DQmWySJ8GHBPrQaqg3n3tDK6Jhn3RX7xC4xNCtep3gjGp1C/1.png)

这样就可以避免素材重叠导致的冲突。

然后嘛,填色游戏,当然要添加一个着色器啦,在右边栏着色器分栏上右键新建一个着色器,名字随便,但跟下面使用的时候要对应,如果你直接复制我的代码,那名字就改为:shdrColorOverlay.

![2.png](https://cdn.steemitimages.com/DQmSLF3uSeM4A5Y8manokbbipSSqeDvBJJYjJP12U5GBGBY/2.png)

在shdrColorOverlay.vsh页里添加代码如下

~~~

//

// Color Overlay

//

attribute vec3 in_Position; // (x,y,z)

attribute vec2 in_TextureCoord; // (u,v)


varying vec2 v_vTexcoord;


void main()

{

vec4 object_space_pos = vec4( in_Position.x, in_Position.y, in_Position.z, 1.0);

gl_Position = gm_Matrices[MATRIX_WORLD_VIEW_PROJECTION] * object_space_pos;

v_vTexcoord = in_TextureCoord;

}

~~~

再在shdrColorOverlay.fsh页里加如下代码:

~~~


//

// Color Overlay

//

varying vec2 v_vTexcoord;


uniform vec4 u_color;


void main()

{

vec4 texColor = texture2D(gm_BaseTexture, v_vTexcoord);

gl_FragColor = vec4(u_color.rgb, texColor.a);

}

~~~


好啦,着色器设置到此结束,我们先添加一个全局变量吧,这个变量是用来记录我们选择了什么颜料的。

我们在房间里属性里,找到创建代码这一栏。

![3.png](https://cdn.steemitimages.com/DQmZcpWfJomaVJTpKr6VPAshoRg9ctZfZEQkfKpVAko3HtH/3.png)

并在里面添加代码

~~~

globalvar yanse;//***全局变量函数

yanse=0;

~~~

在这里globalvar是全局变量函数,不加这个函数,添加进去的就不是全局变量了。


现在我们就来添加一个颜料吧。

新建一个物体,在【创建】事件里添加代码:

~~~

_uniColor = shader_get_uniform(shdrColorOverlay, "u_color");

_color = [1.0, 0.0, 0.0, 1.0];

~~~

这里[1.0, 0.0, 0.0, 1.0],前三组数字其实就是对应RGB颜色的三组数字1=255,0.1=25,所以[1.0, 0.0, 0.0, 1.0]其实就是对应RGB颜色里就255,0,0(红色),最后一个数字是透明度1=100%。


然后添加一个【步】事件

~~~

if mouse_check_button_pressed(mb_left) && collision_point(mouse_x,mouse_y,id,true,0)

{

yanse=1;

}

~~~

代码的意思是说,如果鼠标的指针指在该物体上,并按下鼠标左键的话,颜料全局变量就为1也就是红色;

特比要注意的一点就是,collision_point(mouse_x,mouse_y,id,true,0)里true是精准碰撞的意思,如果不需要精准碰撞就设置为0。


剩下的就是给这个物体加一个【绘制】事件了,这个事件是用来绘制颜色的,用来显示我们这个颜料的颜色。

~~~

shader_set(shdrColorOverlay);

shader_set_uniform_f_array(_uniColor, _color);

draw_self();

shader_reset();

~~~

在这里面shdrColorOverlay就是你刚才着色器的名字,如果你不是写的这个名字,就要改为你自己设置的名字了。


用同样的方法我们再增加几个颜料的话,只需把【创建】事件里的颜色代码改一下,还有【步】事件里的全局变量代码改一下就可以了,那么我就不多说了。


是时候到填充的素材了,你会发现,其实这里的设置是跟颜料里的大同小异,添加一个相同于颜料的【创建】事件,只是把里面的颜色代码改为白色,白色的RGB代码是255,255,255所以我们只需把颜色代码改为_color = [1.0, 1.0, 1.0, 1.0];就可以了

~~~

_uniColor = shader_get_uniform(shdrColorOverlay, "u_color");

_color = [1.0, 0.0, 0.0, 1.0];

~~~


步事件当然不一样啦,刚才颜料里是让我们选择颜色,现在是时候告诉这个物体,我们刚才选的是什么颜料了。

~~~

if mouse_check_button_pressed(mb_left) && collision_point(mouse_x,mouse_y,id,true,0)//鼠标点击组合

{

if yanse=1 _color = [1.0, 0.0, 0.0, 1.0];

if yanse=2 _color = [0.0, 1.0, 0.0, 1.0];

if yanse=3 _color = [0.0, 0.0, 1.0, 1.0];

}

~~~

鼠标指针指在物体上并按下鼠标左键,如果颜料变量等于1就改为红色,2=绿色,3=蓝色,当然你可以添加更多颜色,我只是做个范例。


【绘制】事件也和颜料里的一样

~~~

shader_set(shdrColorOverlay);

shader_set_uniform_f_array(_uniColor, _color);

draw_self();

shader_reset();

~~~


至此,一个填色游戏的框架就基本完成了

![4.png](https://cdn.steemitimages.com/DQmQY2yJoC1ZEMktbb3MEomS2AnpMtNC6zrtHVheq8UhHH8/4.png)

轻轻一点就涂上颜色,小朋友最爱的游戏。

![5.png](https://cdn.steemitimages.com/DQmZhMQuoRCdLHTY2XpAAX4kD8VMYY9gRegN4sEnjhZdsbF/5.png)

CC BY-NC-ND 2.0 版权声明

喜欢我的文章吗?
别忘了给点支持与赞赏,让我知道创作的路上有你陪伴。

加载中…

发布评论