Tutorial 02 - Using input, sound and rendering

To render something we will need a hgeQuad structure. Quad is the basic primitive in HGE used for rendering graphics. Quad contains 4 vertices, numbered 0 to 3 clockwise.

Also we'll need a handle for the sound effect.

hgeQuad quad;

HEFFECT snd;

Here go some "gameplay" variables and constants that we will use for our show.

float x=100.0f, y=100.0f;
float dx=0.0f, dy=0.0f;

const float speed=90;
const float friction=0.98f;

Now we create the function that will play collision sound with parameters based on sprite position and speed.

void boom() {
  int pan=int((x-400)/4);
  float pitch=(dx*dx+dy*dy)*0.0005f+0.2f;
  hge->Effect_PlayEx(snd,100,pan,pitch);
}

Now to the frame function. First, we need to know the time elapsed since last call of frame function to adjust our animation speeds to the current frame rate. We obtain it by calling the Timer_GetDelta function.

bool FrameFunc()
{
  float dt=hge->Timer_GetDelta();

Now we process the key presses. We use here Input_GetKeyState function to monitor the keys state. To catch the key clicks you may use Input_GetKey function.

  if (hge->Input_GetKeyState(HGEK_ESCAPE)) return true;
  if (hge->Input_GetKeyState(HGEK_LEFT)) dx-=speed*dt;
  if (hge->Input_GetKeyState(HGEK_RIGHT)) dx+=speed*dt;
  if (hge->Input_GetKeyState(HGEK_UP)) dy-=speed*dt;
  if (hge->Input_GetKeyState(HGEK_DOWN)) dy+=speed*dt;

Now we do some movement calculations and collision detection specific to our example:

  dx*=friction; dy*=friction; x+=dx; y+=dy;
  if(x>784) {x=784-(x-784);dx=-dx;boom();}
  if(x<16) {x=16+16-x;dx=-dx;boom();}
  if(y>584) {y=584-(y-584);dy=-dy;boom();}
  if(y<16) {y=16+16-y;dy=-dy;boom();}

Now we have updated the screen coordinates for our sprite and we should update the quad's vertices to reflect the changes.

  quad.v[0].x=x-16; quad.v[0].y=y-16;
  quad.v[1].x=x+16; quad.v[1].y=y-16;
  quad.v[2].x=x+16; quad.v[2].y=y+16;
  quad.v[3].x=x-16; quad.v[3].y=y+16;

We've done with updating and should return false to continue execution.

  return false;
}

Now to the rendering part. We are going to set up a separate function which will be called by HGE when the application window should be redrawn.

bool RenderFunc()
{

To start rendering we call the Gfx_BeginScene function. Then we clear the screen with a call to Gfx_Clear and render the sprite with Gfx_RenderQuad. Finally we finish rendering and update the screen, calling the Gfx_EndScene function.

  hge->Gfx_BeginScene();
  hge->Gfx_Clear(0);
  hge->Gfx_RenderQuad(&quad);
  hge->Gfx_EndScene();

  return false;
}

The rendering function should always return false.

Now let's see the changes in WinMain function. In this tutorial we set some more system states before HGE initiating. First, we should specify our rendering function. We also turn on the log file support and specify the desired video mode more explicitly:

  hge->System_SetState(HGE_LOGFILE, "hge_tut02.log");
  hge->System_SetState(HGE_FRAMEFUNC, FrameFunc);
  hge->System_SetState(HGE_RENDERFUNC, RenderFunc);
  hge->System_SetState(HGE_TITLE,
           "HGE Tutorial 02 - Using input, sound and rendering");

  hge->System_SetState(HGE_FPS, 100);
  hge->System_SetState(HGE_WINDOWED, true);
  hge->System_SetState(HGE_SCREENWIDTH, 800);
  hge->System_SetState(HGE_SCREENHEIGHT, 600);
  hge->System_SetState(HGE_SCREENBPP, 32);

When HGE is initiated we need to load a texture that holds graphics and a sound effect:

    snd=hge->Effect_Load("menu.wav");
    quad.tex=hge->Texture_Load("particles.png");

Now we should set up the hgeQuad structure that we will use for rendering. The quad's texture is already set up, now we set the blending mode and fill in the vertices array with the desired values.

We don't use z-buffer in this example, so the z-order of vertices is ignored here, and we set it to an arbitrary value in range from 0.0 to 1.0, just to be sure. The format of a vertex color DWORD is 0xAARRGGBB.

The texture coordinates tx and ty for each vertex define the part of the texture to be rendered with this quad. The values are in range 0.0 to 1.0. 0,0 means top left corner and 1,1 - bottom right corner of the texture. Here we have a 128x128 texture and we want to use a 32x32 square part of it starting at 96,64.

    quad.blend=BLEND_ALPHAADD | BLEND_COLORMUL | BLEND_ZWRITE;

    for(int i=0;i<4;i++)
    {
      quad.v[i].z=0.5f;
      quad.v[i].col=0xFFFFA000;
    }

    quad.v[0].tx=96.0/128.0; quad.v[0].ty=64.0/128.0; 
    quad.v[1].tx=128.0/128.0; quad.v[1].ty=64.0/128.0; 
    quad.v[2].tx=128.0/128.0; quad.v[2].ty=96.0/128.0; 
    quad.v[3].tx=96.0/128.0; quad.v[3].ty=96.0/128.0; 

Now we're ready to start the game loop with the System_Start function. When the frame function returns true and the game loop is finished we should free the loaded texture and the sound effect:

    hge->System_Start();

    hge->Texture_Free(quad.tex);
    hge->Effect_Free(snd);

The rest of shutdown process is identical to the one demonstrated in Tutorial 01.

The complete source code with detailed comments for this tutorial you may find in the folder tutorials\tutorial02. The required media files you'll find in the folder tutorials\precompiled.