斜二视图:斜视角视图( 2)

on 2008-12-14 in 游戏开发 | 0 Comment
( 现在开始我们绘制时候我将把图形块用 /\\ 来表示)
( \\/ )


如果你稍微研究下这个形状你就会发现他们可以很容易摆在起画完个图形块时向右走16个象素向下走8个元素再画下个于是个如此绘制完屏幕就象下图所示:
+-----------+
|/\\/\\ |
|\\/\\/\\ |
|/\\/\\/\\ |
|\\/\\/\\/\\ |
|/\\/\\/\\/\\ |
|\\/\\/\\/\\/\\ |
|/\\/\\/\\/\\/\\ |
+-----------+

但是你如何知道那块画在哪儿呢？再看下屏幕这次放大地图x和y轴坐标:(上面数字是x轴下面是y轴)
+-------------------+
| /\\ |
| / 0 \\ |
|/\\ 0 /\\ | 注意:
| 0 \\/ 1 \\ |
| 1 /\\ 0 /\\ | / \\
|\\/ 1 \\/ 2 \\ | Y /\\ X
| \\ 1 /\\ 0 /\\ | / /\\/\\ \\
| 1 \\/ 2 \\/ 3 \\ | /\\/\\/\\
| 2/ \\ 1 /\\ 0 / \\ | \\/\\/\\/
+-------------------+

所以在张地图中就是这样:
-X-
| 0 1 2 3
Y 1 X X X
| 2 X X X
3 X X X

现在看起来我们好象要向右下方画了但是不这并不是绘制最佳方式事实上我们仍然可以从左向右从上向下画什么？我想你在说这个思路方法行不通吧好这里有点区别当我们从左向右绘制时候我们图形块空出了32个象素距离当我们从上向下移动时我们次只要移8个象素每换行我们先向
左移动16个象素以使它们恰好拼接在起于是我们绘制屏幕就是这样了:(数字表示图形块绘制顺序)

+-----------------+
|0 /\\ 1 /\\ 2 /\\|3
| / \\/ \\/ |
4|/\\ 5 /\\ 6 /\\ 7 | 8
| \\/ \\/ \\/|
|9 /\\ 10 /\\ 11 /\\|12
|\\/ \\/ \\/ |
13|/\\14 /\\15 /\\16 |17
| \\/ \\/ \\/|
|18 /\\19 /\\20 / |21
+-----------------+

些图形块会被屏幕边界“切除”我们把它们修剪掉你会注意到每隔行我们都会多画个图形块这是这些是预先向左移动后所画图形块我们需要为此做出补偿
明白了吗？尽管这样绘制很容易但我们不能用这种思路方法来更新地图坐标那么我们如何做呢？好吧回去看眼放大后地图坐标当你向右移动时候注意x和y轴坐标你会看到每移动个图形块x轴增加了1而y轴则减少了1从上向下则有所区别我们象这样沿着每个垂直方向图形块前进:

\\ 0,0
\\ 地图坐标: 1,0 <---- 增加x
/ 1,1 <-- 增加 y
\\ 2,1 <---- 增加 x
/ 2,2 <-- 增加 y

我们每移动个垂直图形块就需要轮流增加x轴和y轴值这个方式意思就是如果垂直方向上图形块计数是偶数那么当我们向下移动时就增加地图x轴值如果图形块计数是奇数当我们向下移动时就增加地图y轴值因此现在我们就知道了如何绘制屏幕和如何跟踪地图坐标以确定每个绘制图形块
接下来是困难部分把这些放到的中使它工作起来使用你喜欢地图存储方式(固定可变链表等等)我们将编写个简单绘图在解说过程中我将使用个固定我们将使用10x10地图它可以使图形块以区别高度叠放起来这使我们能够组合图形块并创建个新图块
在例子中我们需要个墙和个有蜡烛墙我们不是创建两个墙图形块而是创建个墙和个蜡烛你绘制墙的后再在它顶部绘制蜡烛如果你要在其他地方使用蜡烛将它覆盖上去即可
所以我们需要分配个来存放图形块编号和高度在C语言表示如下:

struct MAP_STRUCTURE {
char num_tiles;
char tiles[10]; // 假设每个地图坐标上最多绘制10个图形块
char height[10]; // 也假设为10
};

以及个地图:

MAP_STRUCTURE map[10][10];

我们在地图中需要 3种区别对象:
0)草
1)墙
2)高墙

看下我们例子地图:

0 1 2 3 4 5 6 7 8 9
0 O O O O O O O O O O
1 O . . . . . . . . O
2 O . . . . . . . . O . = 草 (0)
3 O . . o o o o . . O o = 墙 (1)
4 O . . o . . o . . O O = 高墙 (2)
5 O . . o . . o . . O
6 O . . o o o o . . O
7 O . . . . . . . . O
8 O . . . . . . . . O
9 O O O O O O O O O O


(未完)
Tags:  三视图 二视图 第二视角 斜二视图

延伸阅读

最新评论

发表评论