Direct-X学习笔记--公告板

传说中的公告板，其实我之前一直以为公告板技术是一项很神秘的技术，但是学习了之后发现公告板技术其实很简单，但是却是一个非常“聪明的”技术，可以用非常小的开销，模拟出不错的效果。

一.简介

公告板技术（Billboard），是一种使用二维纹理模拟表现三维的技术。它可以用一种简单的方式来完成很多特别的效果。例如纹理的Alpha混合与动画 在一起使用，可以实现很多没有固定表面的效果，如烟雾、火焰、爆炸、能量盾、云彩等。在一定程度上来说，这些效果也可以由其他更真实的技术来实现，但公告板技术最吸引人的地方在于实现这些效果时所使用的系统资源极低。

公告板技术的原理其实比较简单，所谓的公告板，正如其名，就是一个二维的纹理平面，说白了就是一个矩形，然后使用Alpha混合，将纹理贴图贴在这个矩形上，使之看起来更加逼真，然后，再实时计算摄像机（或者观察点）的位置，使这个矩形绕着Y轴旋转，正对着摄像机的方向。这样，不管我们怎样在水平方向上旋转摄像机，这个矩形都会以“最佳形态”（面朝观察者）来展示自己，这样，这个物体看起来就像3维的啦。

注意：公告板本身没有使纹理看起来更像三维模型的能力，公告板只不过是通过Alpha透明，去除杂边，并且让它一直朝向我们罢了，所以使用公告板技术时，这个纹理本身必须看起来比较立体。

二.公告板的使用

其实公告板很简单，说白了就是两个三角形，组成一个矩形，然后在矩形上贴上一层纹理。我们先做到这一步，绘制一个地面，然后绘制一个二维的人物。

第一步就是定义灵活顶点格式，然后定义顶点缓冲区：

//------------绘制图形步骤1.定义灵活顶点格式
#define D3DFVF_CUSTOMVERTEX (D3DFVF_XYZ|D3DFVF_TEX1)//坐标为经过变换的屏幕坐标，顶点的颜色


//------------绘制图形步骤2.根据上面定义的顶点格式，创建一个顶点的结构体
struct stVertex
{
	float _x, _y, _z;//位置坐标
	float _u, _v; //纹理坐标


	stVertex(float x, float y, float z, float u, float v) : _x(x), _y(y), _z(z), _u(u), _v(v){}
	stVertex(){}
};

接着，我们初始化顶点缓冲区，并且加载一份人物的纹理：

stVertex vertex[4];


	//顶点数据
	vertex[0] = stVertex(-100.0f,   0.0f, 0.0f, 0.0f, 1.0f);
	vertex[1] = stVertex(-100.0f,   700.0f, 0.0f, 0.0f, 0.0f);
	vertex[2] = stVertex( 100.0f,   0.0f, 0.0f, 1.0f, 1.0f);
	vertex[3] = stVertex( 100.0f,   700.0f, 0.0f, 1.0f, 0.0f);


	//----------绘制图形步骤5.为定点缓冲区分配内存，并将数组中的顶点值拷贝到顶点缓冲区中
	//通过设备指针来创建顶点缓冲区，用来存储顶点数据
	g_pDevice->CreateVertexBuffer(
		sizeof(vertex),//顶点缓冲区大小
		D3DUSAGE_WRITEONLY,//顶点缓冲区作用
		D3DFVF_CUSTOMVERTEX,//通知系统顶点格式
		D3DPOOL_MANAGED,//顶点缓冲区存储位置，此处表示由系统处理
		&g_pVB, //返回顶点缓冲区指针
		NULL //系统保留参数，NULL
		);


	void* pVertices = NULL;


	//锁定顶点缓冲区，向其中拷贝数据
	g_pVB->Lock(
		0, //锁定的偏移量
		sizeof(vertex),//锁定的大小
		&pVertices, //锁定之后存储空间
		0 //锁定的标识，0
		);


	//将数组中的内容拷贝到缓冲区中
	memcpy(pVertices, vertex, sizeof(vertex));


	//解锁
	g_pVB->Unlock();


	//创建纹理
	D3DXCreateTextureFromFile(g_pDevice, TEXT("kelisi.png"), &g_pCharacterTextrue);

然后，按照同样的方法，绘制一个矩形，作为地面，下面就先分别设置一下世界矩阵，然后绘制，看一下结果：

好吧，这真是“公告板”--我们的人物被钉在板子上了。为什么会出现这种情况？

答案是没有进行Alpha混合，Alpha混合就像我们之前GDI的透明遮罩法一样，可以使人物周围的边框去掉，不过前提是纹理图片要有Alpha通道。我们设置一下Alpha混合，在运行一下：

恩，这样就对了，额。。。请忽略抠图时留下的白边。。。

其实公告板所能表现的效果也就是这种效果啦，公告板真正做的不是提升纹理的立体程度，而是让纹理时刻对着我们，否则，如果不用公告板的话，我们将摄像机平移并转动一些角度之后，就会出现下面的情况：

可见，模型被压扁了，还有更狠的：

好了，下面才是公告板技术的核心：

实时获得观察矩阵，并且根据观察矩阵获得公告板矩阵，进行世界变换：

<span style="white-space:pre">	</span>//获得取景变换矩阵
	D3DXMATRIX matView;
	g_pCamera->CalculateViewMatrix(&matView);


	//根据取景变换矩阵构造公告板矩阵0
	D3DXMATRIX matBillboard;
	D3DXMatrixIdentity(&matBillboard);
	matBillboard._11 = matView._11;
	matBillboard._13 = matView._13;
	matBillboard._31 = matView._31;
	matBillboard._33 = matView._33;
	//还需要进行一次逆运算
	D3DXMatrixInverse(&matBillboard, NULL, &matBillboard);
	D3DXMatrixIdentity(&matCharacter);
	matCharacter = matBillboard * matCharacter;

这里的CalculateViewMatrix是之前摄像机类的计算观察矩阵的函数，可以通过这个函数获得观察矩阵，通过上面的公式，转化出公告板的世界矩阵。在绘制之前设置一下即可。这样，不管我们怎么转，得到的都是这样的效果，即人物会一直面向我们：

其实公告板的实现还有一种方式，就是通过观察点和眼睛的位置，计算向量，转动时，计算偏转角度，然后将模型旋转相应的角度，但是个人感觉这个好麻烦，还是算矩阵来的快....

// 通过当前观察方向来构造公告板矩阵
   D3DXMATRIX matBillboard;
   D3DXVECTOR3 vDir = vAt - vEye;
   if( vDir.x > 0.0f )
       D3DXMatrixRotationY( &matBillboard, -atanf(vDir.z/vDir.x)+D3DX_PI/2);
   else
       D3DXMatrixRotationY( &matBillboard, -atanf(vDir.z/vDir.x)-D3DX_PI/2);

三.完整的Demo

下面附上上图效果的完整代码：

// D3DDemo.cpp : 定义应用程序的入口点。
//


#include "stdafx.h"
#include "D3DDemo.h"
#include "DirectInput.h"
#include "Camera.h"




#define MAX_LOADSTRING 100




// 全局变量:
HINSTANCE hInst; // 当前实例
TCHAR szTitle[MAX_LOADSTRING]; // 标题栏文本
TCHAR szWindowClass[MAX_LOADSTRING]; // 主窗口类名


// 此代码模块中包含的函数的前向声明:
HWND                g_hWnd;
ATOM MyRegisterClass(HINSTANCE hInstance);
BOOL InitInstance(HINSTANCE, int);
LRESULT CALLBACK WndProc(HWND, UINT, WPARAM, LPARAM);


//---------改造3D窗口需要的内容------------
LPDIRECT3D9 g_pD3D = NULL; //D3D接口指针
LPDIRECT3DDEVICE9 g_pDevice = NULL; //D3D设备指针
CDirectInput* g_pDirectInput = NULL; //控制指针
CCamera*      g_pCamera      = NULL;    //摄像机指针


LPDIRECT3DTEXTURE9  g_pGroundTexture = NULL; //地面纹理
LPDIRECT3DTEXTURE9  g_pCharacterTextrue = NULL; //人物纹理


//------------绘制图形步骤1.定义灵活顶点格式
#define D3DFVF_CUSTOMVERTEX (D3DFVF_XYZ|D3DFVF_TEX1)//坐标为经过变换的屏幕坐标，顶点的颜色


//------------绘制图形步骤2.根据上面定义的顶点格式，创建一个顶点的结构体
struct stVertex
{
	float _x, _y, _z;//位置坐标
	float _u, _v; //纹理坐标


	stVertex(float x, float y, float z, float u, float v) : _x(x), _y(y), _z(z), _u(u), _v(v){}
	stVertex(){}
};


//----------绘制图形步骤3.声明一个顶点缓冲区指针
LPDIRECT3DVERTEXBUFFER9 g_pVB = NULL;
LPDIRECT3DVERTEXBUFFER9 g_pVBFloor = NULL;


//初始化顶点缓冲区
void initVB()
{
	//----------绘制图形步骤4.定义一个结构体数组用来给每个顶点赋值
	//数组中存储当前程序中顶点的数据



	stVertex vertex[4];


	//顶点数据
	vertex[0] = stVertex(-100.0f,   0.0f, 0.0f, 0.0f, 1.0f);
	vertex[1] = stVertex(-100.0f,   700.0f, 0.0f, 0.0f, 0.0f);
	vertex[2] = stVertex( 100.0f,   0.0f, 0.0f, 1.0f, 1.0f);
	vertex[3] = stVertex( 100.0f,   700.0f, 0.0f, 1.0f, 0.0f);


	//----------绘制图形步骤5.为定点缓冲区分配内存，并将数组中的顶点值拷贝到顶点缓冲区中
	//通过设备指针来创建顶点缓冲区，用来存储顶点数据
	g_pDevice->CreateVertexBuffer(
		sizeof(vertex),//顶点缓冲区大小
		D3DUSAGE_WRITEONLY,//顶点缓冲区作用
		D3DFVF_CUSTOMVERTEX,//通知系统顶点格式
		D3DPOOL_MANAGED,//顶点缓冲区存储位置，此处表示由系统处理
		&g_pVB, //返回顶点缓冲区指针
		NULL //系统保留参数，NULL
		);


	void* pVertices = NULL;


	//锁定顶点缓冲区，向其中拷贝数据
	g_pVB->Lock(
		0, //锁定的偏移量
		sizeof(vertex),//锁定的大小
		&pVertices, //锁定之后存储空间
		0 //锁定的标识，0
		);


	//将数组中的内容拷贝到缓冲区中
	memcpy(pVertices, vertex, sizeof(vertex));


	//解锁
	g_pVB->Unlock();


	//创建纹理
	D3DXCreateTextureFromFile(g_pDevice, TEXT("kelisi.png"), &g_pCharacterTextrue);


	//创建地板的缓冲区及纹理
	stVertex vertexFloor[4];


	vertexFloor[0] = stVertex(-4000.0f, 0.0f, -4000.0f, 0.0f, 1.0f);
	vertexFloor[1] = stVertex(-4000.0f, 0.0f,  4000.0f, 0.0f, 0.0f);
	vertexFloor[2] = stVertex( 4000.0f, 0.0f,  -4000.0f, 1.0f, 1.0f);
	vertexFloor[3] = stVertex( 4000.0f, 0.0f, 4000.0f, 1.0f, 0.0f);


	g_pDevice->CreateVertexBuffer(sizeof(vertexFloor), D3DUSAGE_WRITEONLY, D3DFVF_CUSTOMVERTEX, D3DPOOL_MANAGED, &g_pVBFloor, NULL);


	void* pVerticesFloor;
	g_pVBFloor->Lock(0, sizeof(vertexFloor), &pVerticesFloor, 0);
	memcpy(pVerticesFloor, vertexFloor, sizeof(vertexFloor));
	g_pVBFloor->Unlock();


	D3DXCreateTextureFromFile(g_pDevice, TEXT("floor.jpg"), &g_pGroundTexture);


}






void onCreatD3D()
{
	g_pD3D = Direct3DCreate9(D3D_SDK_VERSION);
	if (!g_pD3D)
		return;


	//检测硬件设备能力的方法
	/*D3DCAPS9 caps;
	ZeroMemory(&caps, sizeof(caps));
	g_pD3D->GetDeviceCaps(D3DADAPTER_DEFAULT, D3DDEVTYPE_HAL, &caps);*/


	//获得相关信息，屏幕大小，像素点属性
	D3DDISPLAYMODE d3ddm;
	ZeroMemory(&d3ddm, sizeof(d3ddm));


	g_pD3D->GetAdapterDisplayMode(D3DADAPTER_DEFAULT, &d3ddm);




	//设置全屏模式
	D3DPRESENT_PARAMETERS d3dpp;
	ZeroMemory(&d3dpp, sizeof(d3dpp));
	/*d3dpp.Windowed = false;
	d3dpp.BackBufferWidth = d3ddm.Width;
	d3dpp.BackBufferHeight = d3ddm.Height;*/


	d3dpp.Windowed = true;
	d3dpp.BackBufferFormat = d3ddm.Format;
	d3dpp.BackBufferCount = 1;


	d3dpp.SwapEffect = D3DSWAPEFFECT_DISCARD;//交换后原缓冲区数据丢弃


	//是否开启自动深度模板缓冲
	d3dpp.EnableAutoDepthStencil = true;
	//当前自动深度模板缓冲的格式
	d3dpp.AutoDepthStencilFormat = D3DFMT_D16;//每个像素点有16位的存储空间，存储离摄像机的距离



	g_pD3D->CreateDevice(D3DADAPTER_DEFAULT, D3DDEVTYPE_HAL, g_hWnd, D3DCREATE_SOFTWARE_VERTEXPROCESSING, &d3dpp, &g_pDevice);


	if (!g_pDevice)
		return;


	//设置渲染状态，设置启用深度值
	g_pDevice->SetRenderState(D3DRS_ZENABLE, true);


	//设置渲染状态，关闭灯光
	g_pDevice->SetRenderState(D3DRS_LIGHTING, false);


	//设置渲染状态，裁剪模式
	g_pDevice->SetRenderState(D3DRS_CULLMODE, D3DCULL_NONE);


	//g_pDevice->SetRenderState(D3DRS_CULLMODE, D3DCULL_NONE) ;


}

void CreateCamera()
{
	g_pCamera = new CCamera(g_pDevice);
	g_pCamera->SetCameraPosition(&D3DXVECTOR3(0.0f, 200.0f, -1500.0f));
	g_pCamera->SetTargetPosition(&D3DXVECTOR3(0.0f, 200.0f, 0.0f));
	g_pCamera->SetViewMatrix();
	g_pCamera->SetProjectionMartix();
}

void onInit()
{
	//初始化D3D
	onCreatD3D();


	//初始化顶点缓冲区
	initVB();


	//创建摄像机
	CreateCamera();

}


void onDestroy()
{
	if (!g_pDevice)
		g_pDevice->Release();
	g_pDevice = NULL;
}


void onLogic(float fElapsedTime)
{
	//使用DirectInput类读取数据
	g_pDirectInput->GetInput();


	// 沿摄像机各分量移动视角
	if (g_pDirectInput->IsKeyDown(DIK_A))  g_pCamera->MoveAlongRightVec(-10.0f);
	if (g_pDirectInput->IsKeyDown(DIK_D))  g_pCamera->MoveAlongRightVec( 10.0f);
	if (g_pDirectInput->IsKeyDown(DIK_W)) g_pCamera->MoveAlongLookVec( 10.0f);
	if (g_pDirectInput->IsKeyDown(DIK_S))  g_pCamera->MoveAlongLookVec(-10.0f);
	if (g_pDirectInput->IsKeyDown(DIK_I))  g_pCamera->MoveAlongUpVec( 10.0f);
	if (g_pDirectInput->IsKeyDown(DIK_K))  g_pCamera->MoveAlongUpVec(-10.0f);


	//沿摄像机各分量旋转视角
	if (g_pDirectInput->IsKeyDown(DIK_LEFT))  g_pCamera->RotationUpVec(-0.003f);
	if (g_pDirectInput->IsKeyDown(DIK_RIGHT))  g_pCamera->RotationUpVec( 0.003f);
	if (g_pDirectInput->IsKeyDown(DIK_UP))  g_pCamera->RotationRightVec(-0.003f);
	if (g_pDirectInput->IsKeyDown(DIK_DOWN))  g_pCamera->RotationRightVec( 0.003f);
	if (g_pDirectInput->IsKeyDown(DIK_J)) g_pCamera->RotationLookVec(-0.001f);
	if (g_pDirectInput->IsKeyDown(DIK_L)) g_pCamera->RotationLookVec( 0.001f);


	////鼠标控制右向量和上向量的旋转
	//g_pCamera->RotationUpVec(g_pDirectInput->MouseDX()* 0.001f);
	//g_pCamera->RotationRightVec(g_pDirectInput->MouseDY() * 0.001f);


	//鼠标滚轮控制观察点收缩操作
	static FLOAT fPosZ=0.0f;
	fPosZ += g_pDirectInput->MouseDZ()*0.03f;


	//计算并设置取景变换矩阵
	D3DXMATRIX matView;
	g_pCamera->CalculateViewMatrix(&matView);
	g_pDevice->SetTransform(D3DTS_VIEW, &matView);

}


void onRender(float fElasedTime)
{
	//前两个参数是0和NULL时，清空整个游戏窗口的内容（清的是后台）
	//第三个是清除的对象：前面表示清除颜色缓冲区，后面表示清除深度缓冲区,D3DCLEAR_STENCIL清空模板缓冲区
	g_pDevice->Clear(0, NULL, D3DCLEAR_TARGET|D3DCLEAR_ZBUFFER, D3DCOLOR_XRGB(0,100,100), 1.0f, 0);


	g_pDevice->BeginScene();


	//设置世界矩阵
	D3DXMATRIX matCharacter, matWorld;  
	D3DXMatrixTranslation(&matWorld, 0.0f, 0.0f, 0.0f); 
	D3DXMatrixTranslation(&matCharacter, 0.0f, 0.0f, 0.0f);

	//获得取景变换矩阵
	D3DXMATRIX matView;
	g_pCamera->CalculateViewMatrix(&matView);


	//根据取景变换矩阵构造公告板矩阵0
	D3DXMATRIX matBillboard;
	D3DXMatrixIdentity(&matBillboard);
	matBillboard._11 = matView._11;
	matBillboard._13 = matView._13;
	matBillboard._31 = matView._31;
	matBillboard._33 = matView._33;
	//还需要进行一次逆运算
	D3DXMatrixInverse(&matBillboard, NULL, &matBillboard);
	D3DXMatrixIdentity(&matCharacter);
	matCharacter = matBillboard * matCharacter;



	////----------绘制图形步骤6.设置数据源，设置灵活顶点格式，绘制图元




	//绘制地面
	//设置数据流来源
	g_pDevice->SetStreamSource(
		0, //数据流管道号（0-15）
		g_pVBFloor, //数据来源
		0, //数据流偏移量
		sizeof(stVertex)//每个数据的字节数大小
		);


	//通知系统数据格式，以便解析数据
	g_pDevice->SetFVF(D3DFVF_CUSTOMVERTEX);


	g_pDevice->SetTransform(D3DTS_WORLD, &matWorld);


	//设置纹理
	g_pDevice->SetTexture(0, g_pGroundTexture);


	g_pDevice->DrawPrimitive(D3DPT_TRIANGLESTRIP, 0, 2);


	//绘制人物


	//设置数据流来源
	g_pDevice->SetStreamSource(
		0, //数据流管道号（0-15）
		g_pVB, //数据来源
		0, //数据流偏移量
		sizeof(stVertex)//每个数据的字节数大小
		);


	//通知系统数据格式，以便解析数据
	g_pDevice->SetFVF(D3DFVF_CUSTOMVERTEX);

	g_pDevice->SetTransform(D3DTS_WORLD, &matCharacter);  

	//设置纹理
	g_pDevice->SetTexture(0, g_pCharacterTextrue);


	//开启Alpha Blend
	g_pDevice->SetRenderState(D3DRS_ALPHABLENDENABLE, true);
	g_pDevice->SetRenderState(D3DRS_SRCBLEND, D3DBLEND_SRCALPHA);
	g_pDevice->SetRenderState(D3DRS_DESTBLEND, D3DBLEND_INVSRCALPHA);




	//绘制图元 
	g_pDevice->DrawPrimitive(
		D3DPT_TRIANGLESTRIP,    //三角形列
		0, //起始点编号
		2 //图元数量
		);


	g_pDevice->SetRenderState(D3DRS_ALPHABLENDENABLE, false);


	g_pDevice->EndScene();




	g_pDevice->Present(NULL, NULL, NULL, NULL);
}




int APIENTRY _tWinMain(_In_ HINSTANCE hInstance,
					   _In_opt_ HINSTANCE hPrevInstance,
					   _In_ LPTSTR    lpCmdLine,
					   _In_ int       nCmdShow)
{
	UNREFERENCED_PARAMETER(hPrevInstance);
	UNREFERENCED_PARAMETER(lpCmdLine);


	// TODO: 在此放置代码。
	MSG msg;
	HACCEL hAccelTable;


	// 初始化全局字符串
	LoadString(hInstance, IDS_APP_TITLE, szTitle, MAX_LOADSTRING);
	LoadString(hInstance, IDC_D3DDEMO, szWindowClass, MAX_LOADSTRING);
	MyRegisterClass(hInstance);


	// 执行应用程序初始化:
	if (!InitInstance (hInstance, nCmdShow))
	{
		return FALSE;
	}


	hAccelTable = LoadAccelerators(hInstance, MAKEINTRESOURCE(IDC_D3DDEMO));





	ZeroMemory(&msg, sizeof(msg));
	while (msg.message != WM_QUIT)
	{
		if (PeekMessage(&msg, NULL, 0, 0, PM_REMOVE))
		{
			TranslateMessage(&msg);
			DispatchMessage(&msg);
		}
		else
		{
			static DWORD dwTime = timeGetTime();
			DWORD dwCurrentTime = timeGetTime();
			DWORD dwElapsedTime = dwCurrentTime - dwTime;
			float fElapsedTime = dwElapsedTime * 0.001f;


			//------------渲染和逻辑部分代码----------
			onLogic(fElapsedTime);
			onRender(fElapsedTime);
			//-----------------------------------------
			if (dwElapsedTime < 1000 / 60)
			{
				Sleep(1000/ 60 - dwElapsedTime);
			}
			dwTime = dwCurrentTime;
		}
	}


	onDestroy();
	return (int) msg.wParam;
}






//
//  函数: MyRegisterClass()
//
//  目的: 注册窗口类。
//
ATOM MyRegisterClass(HINSTANCE hInstance)
{
	WNDCLASSEX wcex;


	wcex.cbSize = sizeof(WNDCLASSEX);


	wcex.style = CS_HREDRAW | CS_VREDRAW;
	wcex.lpfnWndProc= WndProc;
	wcex.cbClsExtra= 0;
	wcex.cbWndExtra= 0;
	wcex.hInstance= hInstance;
	wcex.hIcon = LoadIcon(hInstance, MAKEINTRESOURCE(IDI_D3DDEMO));
	wcex.hCursor = LoadCursor(NULL, IDC_ARROW);
	wcex.hbrBackground= (HBRUSH)(COLOR_WINDOW+1);
	wcex.lpszMenuName= MAKEINTRESOURCE(IDC_D3DDEMO);
	wcex.lpszClassName= szWindowClass;
	wcex.hIconSm = LoadIcon(wcex.hInstance, MAKEINTRESOURCE(IDI_SMALL));


	return RegisterClassEx(&wcex);
}


//
//   函数: InitInstance(HINSTANCE, int)
//
//   目的: 保存实例句柄并创建主窗口
//
//   注释:
//
//        在此函数中，我们在全局变量中保存实例句柄并
//        创建和显示主程序窗口。
//
BOOL InitInstance(HINSTANCE hInstance, int nCmdShow)
{


	hInst = hInstance; // 将实例句柄存储在全局变量中


	g_hWnd = CreateWindow(szWindowClass, szTitle, WS_OVERLAPPEDWINDOW,
		CW_USEDEFAULT, 0, CW_USEDEFAULT, 0, NULL, NULL, hInstance, NULL);


	if (!g_hWnd)
	{
		return FALSE;
	}


	//初始化DirectInput类
	g_pDirectInput = new CDirectInput();
	g_pDirectInput->Init(g_hWnd, hInst, DISCL_FOREGROUND|DISCL_NONEXCLUSIVE, DISCL_FOREGROUND|DISCL_NONEXCLUSIVE);


	SetMenu(g_hWnd, NULL);
	ShowWindow(g_hWnd, nCmdShow);
	UpdateWindow(g_hWnd);


	onInit();


	return TRUE;
}


//
//  函数: WndProc(HWND, UINT, WPARAM, LPARAM)
//
//  目的: 处理主窗口的消息。
//
//  WM_COMMAND - 处理应用程序菜单
//  WM_PAINT - 绘制主窗口
//  WM_DESTROY - 发送退出消息并返回
//
//
LRESULT CALLBACK WndProc(HWND g_hWnd, UINT message, WPARAM wParam, LPARAM lParam)
{
	switch (message)
	{
	case WM_KEYDOWN:
		if (wParam == VK_ESCAPE)
			PostQuitMessage(0);
		break;
	case WM_CLOSE:
		DestroyWindow(g_hWnd);
		break;
	case WM_DESTROY:
		PostQuitMessage(0);
		break;
	default:
		return DefWindowProc(g_hWnd, message, wParam, lParam);
	}
	return 0;
}

四.扩充

1.公告板其实更适合那种方向不敏感的东东，比如一棵树，从哪个方向看都差不多的，正好适合公告板。

2.据说有更加高级的公告板技术，十字交叉公告板：所谓十字交叉公告板既是在公告板的基础上再将矩形旋转90度，使得两个公告板交叉。十字交叉公告板比单纯公告板表现效果更好。