2.0 - Design of the game游戏的设计
Before we get started with programming, we will design the game first.
在我们开始编程前，我们先来设计游戏。
2.1 - Basic idea基本的想法
The idea is to create a simple shuffle-puzzle. An image is divided in tiles which are mixed up, the goal of the game is to shuffle the tiles into place to make the image appear:
就是创建一个简单的拼图游戏。一幅画被分为打乱了的小块。游戏的目的是通过拖动小块到应有的地方使图画出现：
2.2 - Tiles window图块窗口
The window with the tiles will be an ownerdrawn static control, i.e. it's a static control, it just displays something, but it is drawn by the program itself. A bitmap of 200 x 200 pixels is used for the tiles. First, the bitmap is loaded, then the 3D-borders that represent the tiles are drawn over the bitmap. When drawing the tiles, the program finds out which part (tile) of the bitmap should be displayed on a specific tile position, then copied to an image buffer (the backbuffer). When all drawings are done, the backbuffer is copied to the static control and is displayed. The backbuffer prevents flickering when drawing the static control, because all drawing is first done invisible on the backbuffer, then the completed image is displayed on the static control.
包含图块的窗口就是一个自画的静态控件，也就是――一个只是显示一些东西的静态控件但它是由程序自身来画出的。一副200×200的象素的位图被用作图块。首先，装载位图。然后在图的上面画上代表图块的3D边缘。在画图块的时候，程序得出位图的某一部分应显示在哪个特定的图块位置。然后拷贝至图象缓存（backbuffer）。当所有的绘画工作都完成了，backbuffer被拷贝到静态控件并显示。Backbuffer防止了画静态控件的时候的闪烁，因为所有的绘画工作是事先在backbuffer中暗地里完成的。然后完整的图象菜被显示在静态控件上。
2.3 - Tile positions and coordinates图块位置和坐标
The program uses different forms of tile positions and coordinates.
程序使用不同形式的图块位置和坐标
The tiles are indexed like this:
图标编号如下：
(when playing the game with numbers instead of a picture, they are numbered 1..16 of course)
（当然在用数字代替图象玩游戏的时候，他们的数字是1～16）
There are three coordinate systems for the tiles: one in tile coordinates (0,1,2,3), one in real screen coordinates, relative to the left topmost pixel of the image above, and one in the static control coordinates, which includes margins to display the tiles in the center:
对图块由三个坐标系统：一个是图块坐标（0，1，2，3），一个是真实屏幕坐标——相对于图象最左最上的象素，和在静态控件中的坐标，其中包括用于为了把图块显示在中央的留白。
2.4 - Program flow程序流程
The basic program flow will be:
基本的程序流程是：
Display the tiles
The tiles are shuffled according to the difficulty level
One tile is removed (tile 16 at tilepos 15) (otherwise it would be hard to shuffle :)
When the user clicks on the static control, a procedure is called to find out which tile the user clicked on.
The program checks if the tile clicked on can move (i.e. if the empty tile is surrounding the clicked tile)
If not, it does nothing
If yes, it finds out how to move the tiles, does the move and updates the static control to display the change
It checks if the puzzle is solved, if yes the full image is displayed and statistics are shown.
A counter is incremented to count the number of moves the user has taken
A timer starts running when the user makes the first move to measure the amount of time the user took to solve the game
1． 显示图块
2． 根据难度，图块被打乱
3． 一个图块被移走（位于图块位置15的第十六块图块）（否则会很难移动的：）
4． 当用户点击静态控件时，一个过程被调用来找出用户点击了哪个图块。
5． 程序检查被点击的图块时是否可以移动（也就是，是否在点击了的图块周围有空白块）
6． 如果不可，什么事也不做
7． 如果可移动，它找出该怎样移动图块，作出移动并更新静态控件以显示改变。
8． 它检查图迷是否已经被解开，如果是在静态控件上显示完整的图片
9． 一个用于计算用户走的步数的计数器步增。
10. 在用户走出第一步时计时器开始走动了测量用户解决游戏用了多久。
