技术开发 频道

开发Silverlight游戏教程:地图遮罩层

    很明显该地图有三处障碍物,两处遮挡物。障碍物我用绿色区域描绘出来了,遮挡物则为两棵数,我用Photoshop将它们分别截取了出来命名为:Mask1.png和Mask2.png。

     匆忙了点,截得不好可不要见怪哪!谁让这两棵树长得如此奇怪呢?嘿嘿。

    OK,接下我以第九节的代码为基础进行修改,首先构建障碍物:

 //构建障碍物

for (int y = 22; y <= 24; y++) {

for (int x = 5; x <= 16; x++) {

//障碍物在矩阵中用0表示

Matrix[x, y] = 0;

rect = new Rectangle();

rect.Fill = new SolidColorBrush(Colors.GreenYellow);

rect.Opacity = 0.3;

rect.Stroke = new SolidColorBrush(Colors.Gray);

rect.Width = GridSize;

rect.Height = GridSize;

Carrier.Children.Add(rect);

Canvas.SetLeft(rect, x * GridSize);

Canvas.SetTop(rect, y * GridSize);

}

}

for (int y = 11; y <= 14; y++) {

for (int x = 27; x <= 31; x++) {

//障碍物在矩阵中用0表示

Matrix[x, y] = 0;

rect = new Rectangle();

rect.Fill = new SolidColorBrush(Colors.GreenYellow);

rect.Opacity = 0.3;

rect.Stroke = new SolidColorBrush(Colors.Gray);

rect.Width = GridSize;

rect.Height = GridSize;

Carrier.Children.Add(rect);

Canvas.SetLeft(rect, x * GridSize);

Canvas.SetTop(rect, y * GridSize);

}

}

for (int y = 18; y <= 21; y++) {

for (int x = 33; x <= 37; x++) {

//障碍物在矩阵中用0表示

Matrix[x, y] = 0;

rect = new Rectangle();

rect.Fill = new SolidColorBrush(Colors.GreenYellow);

rect.Opacity = 0.3;

rect.Stroke = new SolidColorBrush(Colors.Gray);

rect.Width = GridSize;

rect.Height = GridSize;

Carrier.Children.Add(rect);

Canvas.SetLeft(rect, x * GridSize);

Canvas.SetTop(rect, y * GridSize);

}

}

    三个循环分别构建了上图中的三处障碍物,这几章都对它进行了修改,大家应该再熟悉不过了。接下来就是遮挡物那两棵树了,这里我用Image控件作为遮挡物的容器:

 

//创建遮罩层

Image Mask1 = new Image();

Image Mask2 = new Image();

private void InitMask() {

Mask1.Width = 238;

Mask1.Height = 244;

Mask1.Source = new BitmapImage((new Uri(@"Map\Mask1.png", UriKind.Relative)));

Mask1.Opacity = 0.7;

Carrier.Children.Add(Mask1);

Canvas.SetZIndex(Mask1, 10000);

Canvas.SetLeft(Mask1, 185);

Canvas.SetTop(Mask1, 220);

Mask2.Width = 198;

Mask2.Height = 221;

Mask2.Source = new BitmapImage((new Uri(@"Map\Mask2.png", UriKind.Relative)));

Mask2.Opacity = 0.7;

Carrier.Children.Add(Mask2);

Canvas.SetZIndex(Mask2, 10000);

Canvas.SetLeft(Mask2, 466);

Canvas.SetTop(Mask2, 11);

}

    这样就将遮挡物加入进了游戏窗体。有了前面那么多章节关于Image控件的使用知识,上面的代码应该不难理解。这里特别要说一下的是为什么要将它们的Opacity设置为0.7:因为这样的遮挡物会有一定的透明度,当角色置身其中时会若隐若现,从而达到真实模拟MMORPG的效果。至于为什么要将遮挡物的Zindex属性设置为10000呢?这关系到游戏运行时地图中不光只有一个角色,还会有非常多的物体及对象角色的存在,它们之间也同样有着相互遮挡与被遮挡的关系。而在WPF/Silverlight游戏中,物体的遮挡顺序一样可以使用画家算法,该算法原理简单描述就是近物遮挡远物,幸运的是在WPF/Silverlight中,我们可以很方便的只要动态更新(一个对象的Zindex属性)=(它的Y属性)即可以巧妙的实现此效果,是不是有点邪恶?嘿嘿。所以要将遮盖物的ZIndex设置得足够大以防止任何一个物体它的Y属性大过遮盖物的Zindex属性,从而造成画面显示BUG。

    其他的代码均和第九章的一样,到这,本节的目标已经达到了。那么让我们运行测试一下吧:
 

 


    大家可以随便在地图上点击,会发现只要主角有经过这两棵树的地方都会被树以0.7的透明度遮挡,并且障碍物也同样并行存在着,主角如有经过同样会饶过它。障碍物,人物,遮罩层次分明,互不干预,完美默契的并行着。

    至此,地图引擎就基本完成了。下一节将讲解本节开始所提到的神秘第三层,它在WPF/Silverlight游戏辅助方面起着非常大的拓展作用,敬请关注。

原文地址:http://www.cnblogs.com/alamiye010/archive/2009/06/17/1505343.html

0
相关文章