2D地图引擎构建（中英文）

admin

DirectDraw: Tile Engine Example
By: Jack Hoxley
Written: June 2000
Download: DD_Tiles.Zip (15kb)

---

Despite the fact that this is extremely simple, I often get emails from people wanting to know how. Either it isn't acually easy or there are some lazy people around (you choose). Because you all seem interested in this aspect of graphics; this tutorial will show you how to knock up a quick 2D tile engine.

尽管事实上建立一个地图引擎是一件再简单不过事,但是我还是经常收到来自不同的人们的各种邮件,询问我应该怎么样去做,或者是我原来的关于建立一个地图引擎是简单不过的事情的想法是错误的吧,也可能是这些向我求问的人本身很懒吧(你说呢?).因为似乎大家都对这个主题比较感兴趣,这章我将详尽地讲解如何建立一个高的效2D地图引擎..

Tiling is often used for generating landscapes in 2D - each tile will represent a different type of land; ie, Sea, Grass, Rock or Sand. Although 3D has taken over with dramatic landscaping techniques, it is still possible to create a dynamic and interesting landscape in 2D. The main advantages being that is is extremely easy, every computer can do it (and get the same output), and compared with 3D it is quite fast.

瓷砖是游戏编程中的专用术语,用来产生2D游戏中的场景,每个瓷砖都对应一种不同的地表结构;比如,海洋,草地,岩石,沙滩.虽然在3D游戏编程中使用了更为先进和生动的场景生成技术,可是运用瓷砖还是能在2D游戏中生成一个较生动和有趣的场景的.相比起来,2D中的这种技术更为容易掌握和应用(而与3D游戏产生的效果是一样的),并且运行得更为快捷..

The main consideration when using a 2D tile engine is the tile size. If they are too big there will be a lack of detail, if they are too small they'll slow the game down. Also, to keep things simple, they should be a multiple of the screen size. ie, X many tiles will fit into the width of the screen exactly Y many times. Use this simple reference table:

其实在所有的工作中,最主要的考虑因素还是瓷砖的大小.如果瓷砖太大,用它来表现的地表可能就不细致,反之如果太小,游戏速度将因此而拖慢(因为同样大小的地面,瓷砖小将使用过多数量的瓷砖),并且考虑到降低问题本身的复杂性的方面,用这些瓷砖组合起来的地图大小要正好是屏幕的倍数.比如,X数量的瓷砖总宽度刚好与y个屏幕的宽度相等.下面提供了一张简单的对应表:

Screen Resolution	Tile Dimensions	Number of Blits required to fill screen.
640x480	5x5	128 tiles wide, 96 tiles high = 12,288 tiles to be drawn •
	10x10	64 tiles wide, 48 tiles high = 3062 tiles to be drawn •
	16x16	40 tiles wide, 30 tiles high = 1200 tiles to be drawn •
	32x32	20 tiles wide, 15 tiles high = 300 tiles to be drawn •
800x600	5x5	160 tiles wide, 120 tiles high = 19,200 tiles to be drawn •
	10x10	80 tiles wide, 60 tiles high = 4800 tiles to be drawn •
	16x16	50 tiles wide, 37.5 tiles high = 1850 tiles to be drawn •
	32x32	25 tiles wide, 18.75 tiles high = 468 tiles to be drawn •
1024x768	5x5	204.8 tiles wide, 153.6 tiles high = 31,212 tiles to be drawn •
	10x10	102.4 tiles wide, 76.8 tiles high = 7752 tiles to be drawn •
	16x16	64 tiles wide, 48 tile high = 3062 tiles to be drawn •
	32x32	32 tiles wide, 24 tiles high = 768 tiles to be drawn •

屏幕大小	瓷砖设置方式	实际要绘制的总瓷砖数.
640x480	5x5	128 tiles wide, 96 tiles high = 12,288 tiles to be drawn •
	10x10	64 tiles wide, 48 tiles high = 3062 tiles to be drawn •
	16x16	40 tiles wide, 30 tiles high = 1200 tiles to be drawn •
	32x32	20 tiles wide, 15 tiles high = 300 tiles to be drawn •
800x600	5x5	160 tiles wide, 120 tiles high = 19,200 tiles to be drawn •
	10x10	80 tiles wide, 60 tiles high = 4800 tiles to be drawn •
	16x16	50 tiles wide, 37.5 tiles high = 1850 tiles to be drawn •
	32x32	25 tiles wide, 18.75 tiles high = 468 tiles to be drawn •
1024x768	5x5	204.8 tiles wide, 153.6 tiles high = 31,212 tiles to be drawn •
	10x10	102.4 tiles wide, 76.8 tiles high = 7752 tiles to be drawn •
	16x16	64 tiles wide, 48 tile high = 3062 tiles to be drawn •
	32x32	32 tiles wide, 24 tiles high = 768 tiles to be drawn •

Note that in some resolutions some tile size don't fit in exactly; this only means that you'll have a few pixels of free space at the edges. I have marked on the table a red dot for those sizes to avoid, and a green dot for those that are good choices, yellow dots are choices that should only be used if necessary.

注意到在某些解决方法中有些瓷砖的组合并不与屏幕大小真正切合;这表明你将需要一些额外的像素来填充这些地图(瓷砖的组合)边缘空出来的屏幕部分.我在上面的表中已经用红点注明了这些需要避免出现空白的解决方法,用绿点注明了那些合适的解决方法,用黄点注明了那些需要在必要的时候才应该使用的解决方法.

This table is irrelevent if you aren't using any of these resolutions, or if you are using windowed mode; but the formulas are the same; and as a general rule: Above 1000 tiles and below 5000 tiles will give you good speed to looks ratio.

如果你不打算用上面这些解决方法中的任何一种或者在你使用DX的窗口模式下的情况下,上面这张表对你是没有意义的;但是大体上这些解决方法与其它解决方法都是一样的(都按同一个公式来计算),都遵循一个通用的原则:只有那些瓷砖数在1000-5000之间的解决方法都是可选的,多于这个数目的瓷砖数将会使要形成的地图引擎的运行速度打折扣..

Tiling is extremely simple; and there are two main ways it can be achieved.

实际的组合瓷砖形成地图的方法很简单;这里有介绍二种主要用到的方法:

1. At runtime, render the map onto a single surface - therefore only requiring one render. If done this way, the table above is fairly irrelevent. However, it may well prove to be difficult to do Z-Ordering and overlaps.

程序运行时,组合瓷砖生成地图内容到一个单独的绘图页上-因此这种方法只涉及到一个生成过程.如果采用这种方法,以上提供的表项将完全无一可用.并且,采用这种方法可能会对接下来的Z轴转换和遮盖处理带来困难..

2. At runtime render the map on each loop. This can seriously cut down the frame rate, even on the faster computers. With some clever optimisation it can still be done with a reasonable frame rate. This allows you to animate, alpha blend, do transparencies all with great ease.

程序运行时,在一个循环里生成地图.这会在很大程序上降低帧的播放速率(fps,frame per second),在快一点的机器上会更明显.但是在一些优化工作后可以达到一个合理的播放速率.这种方法允许你轻松地生成动画,进行混合处理,透明处理..

We will be using a very simple loop to render the map; this can be called either at runtime or before hand:

我们在接下来的程序中将使用一个简单的循环来组合生成地图;以下实现的组合生成地图的过程可以说是在当前程序运行时完成的,也可以说是在文章最后面链接的那个程序中进行的:

Sub RenderMap(NumTilesX as integer,NumTilesY as integer, TileWidth as integer,TileHeight as integer _ _ TileSourcesurf as DirectDrawSurface7, TileDestSurf as DirectDrawSurface7) Dim X as integer, Y as integer, r as RECT, retVal as long For X = 0 to NumTilesX For Y = 0 to NumTilesY 'Create our Rectangle. r.Left = 'Left coordinate for Tile on source surface r.Top = 'Top coordinate for Tile on Destination surface r.Right = r.Left + TileWidth r.Bottom = r.Top + TileHeight 'This is where we copy the tile from the source to the destination retVal = TileDestSurf.BltFast(int(X * TileWidth), int(Y * TileHeight), TileSourceSurf, r, DDBLTFAST_WAIT) Next Y Next X End Sub

That will now render a tiled map. There are several things that could be changed to speed this up if it were to be done on every loop:

以上函数将完成一个生成地图的过程.我们可以对它作一些改变以加快地图在每一个循环里被生成的速度.

1. Remove the Multiplications. There are 6 different maths functions in the above code. This could possibly be cut down. Using Multiplication and/or division is quite costly on a loop basis. The easiest way that this can be done is by using a lookup table. On the first loop we calculate ALL the coordinates and store them in an array, then on subsequent loops we just look at this array and the calculation will be done; this is known as a lookup table.

移除乘法运算(而改用加法或使用其它办法).以上的子程序用到了6个不同的数学函数.实际上这可以被精简.使用乘法运算和逻辑运算将在一个循环的主体里花费不少的系统占用.最直观和简单的方法是使用一个对照表..

2. Only Draw if necessary. This is the simplest way of speeding things up. The Fruitworld game does this, all the tiles are represented by a number in an array, if this array has changed since the last loop it will draw it, otherwise it moves onto the next iteration. This can easily be combined with the lookup table suggested above.

只在需要绘制的时候进行实际的绘制.这是最让人信服的提速的方法了.游戏"水果世界"的源代码使用了这个方法,所有的瓷砖都对应一个索引值被存放在一个数组里以供调用..

The other aspect of using tiles is actually drawing them. The most important thing is that they join together perfectly - and you cant see the joins between them, this is called a seamless pattern, and you can use PaintShop Pro to generate one for you. The next aspect is what they look like; although detail is important, there is a fine line. Assuming that you are drawing generic landscape (Grass, Sand, Water) - you dont want the user's eye to be focused on it; the grass, water and sand are the background, not the foreground.

使用瓷砖的另外一个方面是实际绘制它们.最重要的事是要保证它们之间是无缝拼合的,你至少不能看到明显的缝隙,这就是人们常说的"无缝拼接",

You can download a working example fromt the top of this page, or you can get it from the downloads page.

huan1983

希望能看到更多的技术性文章，感谢楼主