建议读者对应 hge 的官方的例子:tutorial 02 - using input, sound and rendering 来阅读本文
渲染:
在 hge 中,四边形是一种图元,对应了结构体 hgequad,另外还有三角形图元,对应 hgetriple,为了渲染,我们现在需要使用 hgequad 结构体,这个结构体如下:
struct hgequad
{
hgevertex v[4]; // 顶点描述了这个四边形
htexture tex; // 纹理的句柄或者为0
int blend; // 混合模式(blending mode)
};
hge 中图元对应的结构体总含有这3个部分:顶点,纹理句柄,混合模式
struct hgevertex
float x, y; // 屏幕的 x,y 坐标
float z; // z-order,范围 [0, 1]
dword col; // 顶点的颜色
float tx, ty; // 纹理的 x,y 坐标(赋值前需要规格化坐标间隔,使得 tx,ty 取值范围在[0,1])
规格化坐标间隔在后面的例子中会谈到
1. 颜色的表示:
颜色使用32位表示,从左开始,8位为 alpha 通道,8位红色,8位绿色,8位蓝色
对于后24位,如果全部为0,表示黑色,如果全部为1,表示白色
2. 定义颜色的运算:
我们把颜色看成一个四维向量,即 alpha 通道,红色,绿色,蓝色这四个分量
<1> 颜色是可以相乘的
颜色的相乘是对应的四个分量分别相乘的结果,即:alpha 通道的值与 alpha 通道的值相乘,红色的值与红色的值相乘,绿色的值与绿色的值相乘,蓝色的值与蓝色的值相乘。
<2> 颜色是可以相加的
同上,对应分量相加。
颜色的每个分量使用浮点数表示,范围是[0-1],相加操作可能导致溢出,一种处理的方式就是,如果溢出,则设定值为1。
3. 混合模式:
1)blend_coloradd
表示顶点的颜色与纹理的纹元(texel)颜色相加,这使得纹理变亮,可见顶点颜色为 0x00000000 将不造成任何影响。
2)blend_colormul
表示顶点的颜色与纹理的纹元颜色相乘,这使得纹理变暗,可见顶点颜色为 0xffffffff 将不造成任何影响。
注意:必须在1),2)中做一个选择,且只能选择1),2)中的一个。处理的对象是纹理颜色和顶点颜色。
这里有一个技巧:
如果我们需要在程序中显示一个气球,这个气球的颜色不断变化,这时候我们并不需要准备多张不同颜色的气球纹理,而只需要一张白色的气球纹理,设置 blend 为 blend_colormul,白色的r,g,b值被表示成 1.0,也就是说,纹理颜色和顶点颜色相乘的结果是顶点的颜色,那么就可以通过修改顶点颜色,得到任意颜色的气球了。
3)blend_alphablend
渲染时,将对象的像素颜色(而非顶点的颜色)与当前屏幕的对应像素颜色进行 alpha 混合。alpha 混合使用到 alpha 通道,对于两个像素颜色进行如下操作,得到一个颜色:
r(c)=alpha*r(b)+(1-alpha)*r(a)
g(c)=alpha*g(b)+(1-alpha)*g(a)
b(c)=alpha*b(b)+(1-alpha)*b(a)
这里的blend_alphablend使用的是对象像素的颜色的 alpha 通道。可见如果对象像素颜色 alpha 通道为 0,那么结果就是只有当前屏幕的像素颜色,也就是常常说的 100% 透明,因此,我们可以理解 alpha 混合就是一个是图像透明的操作,0 表示完全透明,255 表示完全不透明。
4)blend_alphaadd
渲染时,将对象的像素颜色与当前屏幕的对应像素颜色相加,结果是有了变亮的效果。
注意:这里的3),4)必选其一,且只能选其一。处理的对象是对象像素颜色和屏幕像素颜色。
5)blend_zwrite
渲染时,写像素的 z-order 到 z-buffer
6)blend_nozwrite
渲染时,不写像素的 z-order 到 z-buffer
这里一样是二者选一
设置举例:
quad.blend=blend_alphaadd | blend_colormul | blend_zwrite; // quad 为 hgequad 变量
4. hge 渲染
1)定义和初始化 hgequad 结构体:
hgequad quad; // 定义四边形
2)初始化 hgequad 变量:
// 设置混合模式
quad.blend=blend_alphaadd | blend_colormul | blend_zwrite;
// 加载纹理
quad.tex = phge->texture_load("particles.png");
注意,读取硬盘上资源的时候,可能会失败,因此通常都需要检查,例如:
if (!quad.tex)
messagebox(null, "load particles.png", "error", 0);
}
// 初始化顶点
for(int i=0;i<4;i++)
// 设置顶点的 z 坐标
quad.v[i].z=0.5f;
// 设置顶点的颜色,颜色的格式为 0xaarrggbb
quad.v[i].col=0xffffa000;
// 这里假定载入的纹理大小为 128*128,现在截取由点(96,64),(128,64),(128,96),(96,96)这四个点围成的图形。
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;
注意,对于 hgequad 结构体,顶点 quad.v[0] 表示左上那个点,quad.v[1] 表示右上的点,quad.v[2] 表示右下的点,quad.v[3] 表示左下的点。
// 设置 hgequad 在屏幕中的位置
float x=100.0f, y=100.0f;
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;
3)设置渲染函数(render function):
system_setstate(hge_renderfunc,renderfunc);
renderfunc 原型和帧函数一样:
bool renderfunc();
4)编写 renderfunc 函数:
bool renderfunc()
phge->gfx_beginscene(); // 在如何渲染之前,必须调用这个函数
phge->gfx_clear(0); // 清屏,使用黑色,即颜色为 0
phge->gfx_renderquad(&quad); // 渲染
phge->gfx_endscene(); // 结束渲染,并且更新窗口
return false; // 必须返回 false
补充:load 函数是和 free 函数成对出现的,即在硬盘上加载了资源之后,需要 free 它们,例如:
quad.tex = phge->texture_load("particles");
// ...
phge->texture_free(quad.tex);
音效:
使用音效是很简单的
1. 载入音效:
heffect heffect = phge->effect_load("sound.mp3");
2. 播放:
phge->effect_playex(heffect);
或者 phge->effect_play(heffect);
1)effect_play 函数只接受一个参数就是音效的句柄 heffect xx;
2)effect_playex 函数较为强大,一共有四个参数:
hchannel effect_playex(
heffect effect, // 音效的句柄
int volume = 100, // 音量,100为最大,范围是[0, 100]
int pan = 0, // 范围是[-100, 100],-100表示只使用左声道,100表示只使用右声道
float pitch = 1.0, // 播放速度,1.0 表示正常速度,值越大播放速度越快,值越小播放越慢。这个值要大于0才有效(不可以等于0)
bool loop = false // 是否循环播放,false表示不循环
);
输入:
仅仅需要调用函数 phge->input_getkeystate(hgek_xxx); 来判断输入,应该在帧函数中调用它,例如:
bool framefunc()
if (phge->input_getkeystate(hgek_lbuttom))
// ...
if (phge->input_getkeystate(hgek_up))