GDI双缓冲
GDI双缓冲
翻译自Double buffering，原作者Dim_Yimma_H
语言：C
（原文写的是C++，实际上是纯C）
推荐知识：
- 构建程序
- 函数
- 结构体
- 变量和条件语句
- switch语句
- 循环
- 指针
- 创建窗口
教程
为了构建这个应用，你需要链接这两个库：User32.lib, Gdi32.lib。
你也需要把开发环境中的字符集设定为多字节，因为如果字符集是Unicode的话，MessageBox和CreateWindow都会有不同的定义。如果你在用Visual C++ 2005，你可以这样做：打开菜单"Project"，点击"Properties"，点开"Configuration Properties"，选择"General"，看到"Character Set"右边，把它从"Use Unicode Character Set"改成"Use Multi-Byte Charater Set"，点击"OK"。
双缓冲的优势是消除闪烁(flickering)。当持续的直接绘制东西到一个窗口上，并且在绘制完成前就更新窗口，导致当前一次更新后有一部分画面不可见，就产生了闪烁。在下一次更新期间，另一部分又会不可见。为了得到一个更稳定的更新，我们把需要绘制的全部内容都绘制到一个备用缓冲(backbuffer)上，然后backbuffer会被绘制到窗口上。闪烁问题于是被解决：因为不再有部分画面不可见的问题了。同时也带来了另一个问题：水平撕裂（horizontal tearing）。当窗口的一半是现在更新的，而另一半是上次更新的，就出现了horizontal tearing。不过这通常来说是可以接受的。
本教程包括基本的Win32图形编程(Win32 graphics programming)以及如何使用backbuffer。我会分段解释相关代码，文末则给出完整代码。其中一部分是Win32 API，它的目的是处理图形设备(graphics devices) - GDI (graphics device interface)。每个窗口有一个设备上下文(device context)，它描述了窗口属性（例如像素格式）。在调用绘制函数时，device context也被用作窗口和位图的标识符。因此，如果我们想在窗口中绘制像素、形状或者位图，我们需要先找到它的device context。通过调用GetDC函数，它返回的是一个HDC(handle to a device context)，可以得到这个窗口的device context。GetDC函数需要的参数：一个HWND，也就是我们想要获取context device的那个窗口的HWND。在我们的函原型部分，我们会声明一个函数，后面会用到它，现在则不用想太多。我们同时定义两个宏，表示窗口的宽度和高度，后面用起来会很方便。
#define WINDOW_WIDTH 640
#define WINDOW_HEIGHT 480
// function prototype - PaintRectangle
int PaintRectangle(SHORT left,
SHORT top,
USHORT width,
USHORT height,
COLORREF color,
HDC hDstDC);
我们的backbuffer是一个位图。CreateCompatibleBitmap()函数返回一个HBITMAP，因此通过调用CreateCompatibleBitmap()来获取位图。CreateCompatibleBitmap 函数有三个参数：第一个是HDC类型，描述了我们想要bitmap兼容到的窗口。另外两个参数是位图的宽度和高度。我们现在声明这些变量，以及一个rectangle，这个rectangle后续会被backbuffer绘制出来。
// GDI related variables
HWND hWnd; // handle to the main window
HBITMAP hBackbuffer; // handle to the backbuffer bitmap
HDC hWndDC; // handle to the device context of the main window
HDC hBackbufferDC; // handle to the device context of the backbuffer
// rectangle variables
int left = 0, top = 0; // upper left corner
USHORT width=32, height=24; // size of the rectangle
COLORREF color=RGB(255, 255, 255); // create a 32-bit color using the RGB macro
我们将对主窗口类的style成员做一点小的调整：要求这个窗口指定唯一的device context。
wc.style = CS_OWNDC | CS_HREDRAW | CS_VREDRAW;
当窗口被创建后，一个好的做法是获取它的device context，并创建一个backbuffer和相应的device context。这个backbuffer位图并不会自动有相应的device context，而是要通过CreateCompatibleDC来创建。然后通过调用SelectObject()来描述这个backbuffer。SelectObject()函数的第一个参数是这个HDC，第二个参数是一个GDI对象，例如HBITMAP。
/*
Retrieve the window device context,
and create a device compatible with it.
Then select it to describe hBackbuffer.
*/
hWndDC = GetDC(hWnd);
hBackbuffer = CreateCompatibleBitmap(hWndDC, WINDOW_WIDTH, WINDOW_HEIGHT);
hBackbufferDC = CreateCompatibleDC(hWndDC);
SelectObject(hBackbufferDC, hBackbuffer);
为了真的用上double buffering，我们的程序将会是一个实时应用（real time application）。因而，需要修改我们的消息循环相应代码：GetMessage()会休眠，直到获取到一个message；我们换用PeekMessage()，它如果没有得到一个message，就立即返回。注意到也有可能一连串message被一起发送过来，因此Windows有过一个消息队列(message queue)。我们在调用PeekMessage()时指定最后一个参数为PM_REMOVE，作用是删除那些已经被接收到的消息，而不是处理它们两次。
// message loop
while (true)
{
// peek messages for all windows belonging to this thread
// PM_REMOVE specifies that
if (PeekMessage(&msg, NULL, 0, 0, PM_REMOVE))
{
if (msg.message === WM_QUIT) // the window has been destroyed
break;
DispatchMessage(&msg); // send the message to the window procedure
}
else
{
// idle process - do the drawing here
消息循环的这一部分被叫做idle process（空闲进程），因为当前没有消息被接收到。我们知道，窗口最上面的像素数量最少，越往下越多。第一个if条件语句判断的是，我们创建的矩形（前面有提到过一次）是否为挨着窗口右边，如果是的话就随机生成一个位置、尺寸和颜色；而如果矩形还在窗口内，则通过不断的增加“left”变量的值来让矩形向右滑动。
if (left >= WINDOW_WIDTH)
{
// randomize the color of the rectangle
color = RGB(rand() % 255, rand() % 255, rand() % 255);
// randomize the width and height of the rectangle
width = rand() % WINDOW_WIDTH
height = rand() % WINDOW_HEIGHT
// randomize the positioon of the rectangle
left = - width;
top = rand() % (WINDOW_HEIGHT - height);
}
else
{
left += 2; // move rectangle to the right
}
// clear the backbuffer by painting a blank (0) rectangle over it
PaintRectangle(0, 0, WINDOW_WIDTH, WINDOW_HEIGHT, 0, hBackbufferDC);
// paint the moving rectangle onto the backbuffer
PaintRectangle(left, top, width, height, color, hBackbufferDC);
GDI提供了一个叫做BitBlt的函数，它做的是bit-block transfer（拷贝一个bitmap到另一个）。我们要做的是拷贝backbuffer到窗口，BitBlt函数对此来说是完美的。BitBlt的函数参数如下：目标device context，left, top, width, height， 源device context, 源left, 源top, 光栅操作标识符(raster operation flag)。我们把光栅操作标识符设定为SRCCOPY来表示说我们只想把源BITMAPk(backbuffer)拷贝到窗口。此外还有其他的光栅操作标识符类型，都是使用位操作来结合位图的像素，从而创建不同的效果。
// copy the whole backbuffer to the main window
BitBlt(hWndDC, 0, 0, WINDOW_WIDTH, WINDOW_HEIGHT,
hBackbufferDC, 0, 0,
SRCCOPY);
// drawing is complete, pause the program for 30 ms by calling Sleep
// thie limits the speed and lowers the CPU usage
Sleep(30);
}
// end of message loop
}
我们创建的对象，一旦用完就应该删掉，因此当结束程序之前我们删掉backbuffer和相应的device context，因为它们是我们手动创建的。窗口的device context则应该被释放而不是删除，因为它是被找到的(retrieved)而不是被创建的(created)。
// this should be done before exiting the program:
ReleaseDC(hWnd, hWndDC); // retrieved device contexts are just released
DeleteDC(hBackbufferDC); // created device contexts must be deleted
DeleteObject(hBackbuffer); // created objects must be deleted
最后，我们过一遍PaintRectangle函数。之所以现在才看这个函数，是因为觉得对应该对device context有一个整体的印象。PaintRectangle函数有两个位置参数：left和top。如果它们俩都等于0，那么会在左上角绘制。width和height则表示了矩形框的尺寸，颜色参数表示整个框的颜色；hDstDC参数则是目标device context的句柄。因此如果它是backbuffer的device context的话，那么就绘制矩形框到backbuffer上。使用了两种新的数据类型：一个是RECT，是矩形的left、top、right、bottom的简单封装的结构体；另一个是HBRUSH，它是brash的句柄。brush意思是刷子，是按指定的颜色来填充指定区域的。HBRUSH是一个GDI对象，我们通过CreateSolidBrush来创建，而当用完的时候，通过DeleleObject来释放它。为了绘制真正的矩形，需要调用FillRect函数。FillRect函数的第一个参数是目标device context，第二个参数则是RECT的地址，RECT表示了需要绘制的区域；最后一个参数则是brush句柄。FillRect返回了一个int变量，随后被PaintRectangle返回，如果成功的话它的值非0。
int PaintRectangle(SHORT left, SHORT top, USHORT width, USHORT height, COLORREF color, HDC hDstDC)
{
if (hDstDC == NULL)
{
return -1; // no device context specified - return
}
int returnValue;
// RECT struct instance to paint
RECT rect = {left, top, left+width, top+height};
HBRUSH hBrush;
hBrush = CreateSolidBrush(color);
returnValue = FillRect(hDstDC, &rect, hBrush);
DeleteObject(hBrush);
return returnValue;
}
搞定！完整代码如下
（简单起见，我把入口函数从WINMAIN改成main，因此直接创建VS的控制台程序即可）
//from http://www.geocities.ws/dim_yimma_h/cdoublebuffering.htm
#include <stdio.h>
#include <stdbool.h>
#include <windows.h>
#define WINDOW_WIDTH 640
#define WINDOW_HEIGHT 480
//function prototype - PaintRectangle
int PaintRectangle(SHORT left,
SHORT top,
USHORT width,
USHORT height,
COLORREF color,
HDC hDstDC);
//declare window procedure
LRESULT WINAPI MainWndProc(HWND hWnd, UINT uMsg, WPARAM wParam, LPARAM lParam);
int main()
{
HINSTANCE hInstance = GetModuleHandle(0);
MSG msg; //a message struct instance
WNDCLASS wc; //a window class instance
//GDI related variables
HWND hWnd; //handle to the main window
HBITMAP hBackbuffer; //handle to the backbuffer bitmap
HDC hWndDC; //handle to the device context of the main window
HDC hBackbufferDC; //handle to the device context of the backbuffer
//rectangle variables
int left = 0, top = 0; //upper left corner
USHORT width = 32, height = 24; //size of the rectangle
COLORREF color = RGB(255, 255, 255); //create a 32-bit color using the RGB macro
//set the member variables of the main window class instance
wc.lpszClassName = "MainWindowClass"; //string identifier for this class instance
wc.lpfnWndProc = MainWndProc; //the name (address) of the window procedure
/* CS_HREDRAW and CS_VREDRAW specifies the window should be redrawn,
both when resized horizontally and vertically.
hInstance specifies program instance a created window belongs to. */
wc.style = CS_OWNDC | CS_HREDRAW | CS_VREDRAW;
wc.hInstance = hInstance;
/* Load the icon displayed in the corner of the window,
the first argument specifies the HINSTANCE of the icon resource,
since IDI_WINLOGO is a standard icon ID no HINSTANCE is specified.
Also load the mouse cursor displayed when hovering over the window. */
wc.hIcon = LoadIcon(NULL, IDI_WINLOGO);
wc.hCursor = LoadCursor(NULL, IDC_ARROW);
//brushes are used to specify fill color (in this case the background)
//the the color of a window is explicitly converted into a HBRUSH
wc.hbrBackground = (HBRUSH)(COLOR_WINDOW + 1);
wc.lpszMenuName = NULL; //name of window menu, we won't be creating one so it's NULL
//the following two members specifies extra bytes to allocate for the window instance
wc.cbClsExtra = 0;
wc.cbWndExtra = 0;
if (RegisterClass(&wc) == 0)
{
//we have no window yet thus the HWND for the messagebox is set to NULL
//MB_ICONERROR specifies an error icon should be displayed in the messagebox
MessageBox(NULL, "RegisterClass failed.", "Double buffering", MB_ICONERROR);
return 0; //no window has been created so return without destroying it
}
/* create the window using the registered class,
the first message for this window is sent now,
it was the WM_CREATE message (see MainWndProc) */
hWnd = CreateWindow("MainWindowClass", //our window class identifier
"Double buffering", //caption
WS_OVERLAPPEDWINDOW | WS_VISIBLE,
0, //left edge position
0, //top edge position
WINDOW_WIDTH, //width of the window
WINDOW_HEIGHT, //height of the window
NULL, //parent HWND is NULL since this is the only window
NULL, //handle to the menu of the window
hInstance, //specifies which program instance window shall belong to
NULL);
//the last parameter can be a pointer to be sent with the WM_CREATE message
//test whether the window failed to be created - in that case return 0
if (hWnd == NULL) //if no handle was recieved
{
MessageBox(NULL, "CreateWindow failed.", "Double buffering", MB_ICONERROR);
return 0;
}
/* Retrieve the window device context,
and create a device context compatible with it.
Then select it to describe hBackbuffer. */
hWndDC = GetDC(hWnd);
hBackbuffer = CreateCompatibleBitmap(hWndDC, WINDOW_WIDTH, WINDOW_HEIGHT);
hBackbufferDC = CreateCompatibleDC(hWndDC);
SelectObject(hBackbufferDC, hBackbuffer);
//message loop
while (true)
{
//peek messages for all windows belonging to this thread
//PM_REMOVE specifies that
if (PeekMessage(&msg, NULL, 0, 0, PM_REMOVE))
{
if (msg.message == WM_QUIT) //the window has been destroyed
break;
DispatchMessage(&msg); //send the message to the window procedure
}
else
{
//idle process - do the drawing here
if (left >= WINDOW_WIDTH)
{
//randomize the color of the rectangle
color = RGB(rand() % 255, rand() % 255, rand() % 255);
//randomize the width and height of the rectangle
width = rand() % WINDOW_WIDTH;
height = rand() % WINDOW_HEIGHT;
//randomize the position of the rectangle
left = -width;
top = rand() % (WINDOW_HEIGHT - height);
}
else
{
left += 2; //move the rectangle to the right
}
//clear the backbuffer by painting a black (0) rectangle over it
PaintRectangle(0, 0, WINDOW_WIDTH, WINDOW_HEIGHT, 0, hBackbufferDC);
//paint the moving rectangle onto the backbuffer
PaintRectangle(left, top, width, height, color, hBackbufferDC);
//copy the whole backbuffer to the main window
BitBlt(hWndDC, 0, 0, WINDOW_WIDTH, WINDOW_HEIGHT,
hBackbufferDC, 0, 0,
SRCCOPY);
//drawing is complete, pause the program for 30 ms by calling Sleep
//this limits the speed and lowers the CPU usage
Sleep(20);
}
} //end of message loop
//this should be done before exiting the program:
ReleaseDC(hWnd, hWndDC); //retrieved device contexts are just released
DeleteDC(hBackbufferDC); //created device contexts must be deleted
DeleteObject(hBackbuffer); //created objects must be deleted
//return the last handled message to the caller (exit the program)
return msg.wParam;
} //end of WinMain
LRESULT WINAPI MainWndProc(HWND hWnd, UINT uMsg, WPARAM wParam, LPARAM lParam)
{
//switch statement to determine the current message
switch (uMsg)
{
case WM_CLOSE:
DestroyWindow(hWnd); //destroys this window and send WM_DESTROY message
return 0;
case WM_DESTROY:
PostQuitMessage(0); //send WM_QUIT message with the return code 0
return 0;
}
//send any unhandled messages to the default window procedure by calling DefWindowProc
return DefWindowProc(hWnd, uMsg, wParam, lParam);
}
int PaintRectangle(SHORT left, SHORT top, USHORT width, USHORT height, COLORREF color, HDC hDstDC)
{
if (hDstDC == NULL)
return -1; //no device context specified - return
int returnValue;
//RECT struct instance to paint
RECT rect = { left, top, left + width, top + height };
HBRUSH hBrush;
hBrush = CreateSolidBrush(color);
returnValue = FillRect(hDstDC, &rect, hBrush);
DeleteObject(hBrush);
return returnValue;
}
