Creating a wavy screen using surfacesSo I was experimenting with surfaces recently and I remembered seeing a few games that had effects in hot areas or other places where the screen would get all distorted and wavy. So I decided that I'd try and figure out how to recreate that. After a bit of work, I managed to get something decent looking.
It turns out it's not really all that difficult and once you know how to do it, and you can even create a bunch of other neat effects as well if you mess around with a few little things.
How to: Okay, first make sure you have Game Maker 8.1 Standard. GM 8 Pro and maybe GM 7 Pro will probably work too, because i don't know if i used anything exclusive to GM 8.1. Then, if you haven't already, read
this tutorial by ChevyRay on how to use surfaces, as well as
this one on how to do scaling using surfaces . I learned most of what i know about surfaces from his surface tutorials, so it'd probably help to read them.
Next, open up a game and create a few sprites, a background, really anything to get something that is visible other than flat color when the game starts. Or just put this into an existing game, it shouldn't screw anything up if you aren't using surfaces already (Even then it might not. I don't know I haven't tested that out).
Now create three scripts (screen_init, screen_begin, and screen_end), and put the following into each (I commented these a lot, so an explanation shouldn't be needed):
In screen_init://GENERAL SURFACE STUFF
screen_x = 0;
screen_y = 0;
screen_w = 480;
screen_h = 360;
screen_scale_w = 1;
screen_scale_h = 1;
graphx=0
//EFFECT STUFF
global.effect="wave vertical"/*Sets the type of effect on the screen at the moment. Their variables need to be set below.
Effects: "none", "wave vertical", "wave horizontal"
*/
//For "wave horizontal"
part_num[1] = 900; //Amount of parts to the wave. it doesn't make a difference after you go over the width/height of the room
wave_width[1]=.2 //how far the wave goes out left and right
wave_height[1]=.9 //how long it takes the wave to go back and forth
part_thickness[1]=(room_height/part_num[1])
//Creating parts of the waves for "wave horizontal"
for (i = 0; i < part_num[1]; i += 1)
{
part[1,i] = (room_width/part_num[1])*i;
}
//For "wave vertical"
part_num[2] = 900;
wave_width[2]=.2 //how far the wave goes out up and down
wave_height[2]=.9
part_thickness[2]=(room_width/part_num[2])
//Creating parts of the waves for "wave vertical"
for (i = 0; i < part_num[2]; i += 1)
{
part[2,i] = (room_height/part_num[2])*i;
}
// create a surface for the whole screen to be drawn on
//FOR EFFECT 'NONE'
screen[0,0] = surface_create(screen_w,screen_h);
//FOR WAVE EFFECTS
screen[1,0]= surface_create(screen_w,screen_h);
screen[1,1]= surface_create(screen_w,screen_h);
// this will destroy the screen object if surfaces are not supported on the graphics card, reverting to the viewport method
if screen = -1{instance_destroy();}
graphx+=1
surface_reset_target();
draw_clear(c_black)
draw_set_blend_mode_ext(bm_one, bm_zero);
surface_reset_target()
switch (global.effect) //Chooses a screen effect based on the value of global.effect
{
/*This is the basic screen-scaling effect. nothing fancy, but very helpful.
I didn't create this effect; credit goes to ChevyRay, whose surface tutorial made it possible for me to figure out how to do
anything at all with surfaces. For more on how to use this effect and other stuff about surfaces check out his
tutorial: http://forums.tigsource.com/index.php?topic=3142.msg86809#msg86809
*/
case "none":
{
draw_surface_stretched(screen[0,0],screen_x,screen_y,screen_w*screen_scale_w,screen_h*screen_scale_h);
surface_reset_target()
break;
}
/*The horizontal wave effect. With this effect, the screen gets a wavey effect across it.
This is based on a few variables. wave_height[#], which determines how far the waves go out in either direction; wave_width[#], which
determines how long of a distance it takes for the waves to go back and forth; part[#,i], which determines the location of the surfaces
used to make the waves(x if using vertical waves, y if horizontal waves); part_thickness[#], which determines the how tall or wide
or how smooth the waves are( part_thickness is changed using part_num (a smaller number equals thicker waves)); and finally, graphx,
which is used to make the waves move (increase the number added to make faster waves).
*/
case "wave horizontal":
{
surface_set_target(screen[1,1])
for (i = 0; i < part_num[1]; i += 1)
{
draw_surface_part(screen[1,0],0,part[1,i],room_width,part_thickness[1],(wave_height[1]*sin((graphx*wave_width[1])+part[1,i])),part[1,i])
}
surface_reset_target()
draw_surface(screen[1,1],0,0)
break;
}
/*This is basically the same as the horizontal wave effect, except that the waves move up and down. Just change the variables for it
in screen_init().
*/
case "wave vertical":
{
surface_set_target(screen[1,1])
for (i = 0; i < part_num[2]; i += 1)
{
draw_surface_part(screen[1,0],part[2,i],0,part_thickness[2],room_height,part[2,i],(wave_height[2]*sin((graphx*wave_width[2])+part[2,i])))
}
surface_reset_target()
draw_surface(screen[1,1],0,0)
break;
}
}
draw_set_blend_mode(bm_normal)
screen_refresh();
In screen_end:
switch (global.effect)
{
case "none":
{
surface_set_target(screen[0,0])
break;
}
case "wave horizontal":
{
surface_set_target(screen[1,0])
break;
}
case "wave vertical":
{
surface_set_target(screen[1,0])
break;
}
}
Now that the scripts are created, create an object called something along the lines of obj_SCREEN. Make that object persistent, and put the scripts into the events they need to go into. screen_init goes into the Create event, screen_begin goes into the Begin Step event, and screen_end goes into the Begin Step event.
Place this object into the very first room of your game, and you should be ready to go.
I tried to make the effects easily editable, so try some things out with it. Try editing the wave heights, widths, the amount of parts to a wave, or anything else really in screen_init and see what happens. Have fun!
If you're having any problems or there's anything wrong with the code or tutorial, let me know and I'll try to get it fixed.
Special thanks to vinheim3 and caiys for helping me out when i really needed to simplify some things, as well as ChevyRay for his surface tutorials, and everyone i talked to on Twitter and Skype about this.
Community
