这次我要介绍一个很好玩的东西——战争迷路。

(小若:喂!迷路?)

笨木头花心贡献,啥?花心?不呢,是用心~
转载请注明,原文地址: http://www.benmutou.com/blog/archives/455   (来自笨木头与游戏开发)

其实这么解释不太好解释,我们举个例子。魔兽争霸相信大家都玩过,游戏开始时,地图上到处都是黑蒙蒙的一片,什么都看不到,我们必须一边走一边探路。

(小若:我知道了!不就是地图探索嘛!)

就是这样,我们来看看下图就更加清楚了(图片资源来自网络):

(小若:我说,你早点放图不就好了,为什么要解释这么多!)

我们即将用Cocos2d-x的CCTMXTiledMap来实现这个功能。

(小若:好棒!)

但是,在这之前,我们得先补点数学理论知识。

(小若:我讨厌数学!)

1. 版权问题

在这之前,我必须要声明,战争迷雾的制作原理参考了以下这篇文章:

http://bbs.9ria.com/thread-157487-1-1.html

这篇文章写得很好,大家感兴趣的可以看看。本教程使用到的理论基础和部分素材均来自这篇文章,特此声明。同时,十分感谢网友的无私奉献。

2. 神奇的数学

我们来看看一张瓦片地图的图素:

至于为什么这么排序,也许不在本教程讨论范围之内,我只给大家介绍这样排序能带来的好处。

(小若:其实你自己也不懂,是不是!)

我们来看看以下编号的4张图片:4号、8号、1号、2号。把这几张小图拼起来刚好是这样的:

也就是说,这四张图刚好是四个白色角落的图。

(小若:那又怎么样?)

现在,我们要做一件很不可理喻的事情,我们把每张小图划分为四个部分,每个部分是一个顶点,顶点默认值都为0,例如下图:

我们把图素白色部分定义为非空,黑色为空,则根据这个定义4、8、2、1号图素的顶点分别如下:

只有这四张图素才这样定义,因为这四张图素可以组合出任意其它的图素。

(小若:噗,我不信。)

举个例子,4号图素和8号图素相加等于什么?看看下图:

我们把四个顶点值相加: 0 + 0 + 8 + 4 = 12

然后我们再回头看看12号图素,是不是和上图非常接近?

同理,我们试试结合4号、8号以及2号图素:0 + 4 + 8 + 2 = 14,我们看看14号图素是不是刚好和4、8、2号图素叠加后的图很接近?

我们需要的一个理论支持就是:将4、8、2、1号图素进行叠加,将叠加后的4个顶点值相加,得到的值即为所需的图素编号。

3. 这又有什么作用

我们花了这么大的功夫去得到这个十分神奇的结论,那,它到底有什么作用呢?而且,旁白为什么没有吐槽呢?

(小若:喂!你不准吐槽我!)

这一切都是为了平滑过渡,不信的话,看看下图,下图就是把图素随机混乱拼接的后果:

我想,这种战争迷雾,我们宁愿不要。

使用前面所说的规则,就可以让图素以最佳效果进行拼接。

具体这个规则怎么使用,我们来看看例子,看下图:

我们只留意图中标明的4个图素格子,当我们点击了左上角的图素格子时,我们做以下操作:

1)当前图素格子右下角的顶点值设为4

2)当前图素格子右边相邻的格子的左下角顶点值设为8

3)当前图素格子下方相邻的格子的右上角顶点值设为1

4)当前图素格子右下方相邻的格子的左上角顶点值设为2

结合上图一起理解会比较好。

(小若:图画得超级丑!你就不能画好点吗?)

现在,大家动手试试点击右上角的格子时,发生什么事情?

我把当前点击的格子用绿色不规则花边标明了。

(小若:我不想吐槽了,你绝对不是做画家的材料!)

我们一步步再按照上面说的四步进行操作,最后格子的顶点数值就如上图一样了。

我们继续关注当前点击的格子,我们计算一下它的四个顶点的和:0 + 0 + 8 + 4 = 12。所以将当前格子的图素换成12号图素。以此类推。

(小若:虽然我不是很明白,但是感觉好神奇的样子!)

好了,理论知识到此结束了。也许大家还很模糊,但是没有关系,用代码实现一遍,就能轻松地理解了。

【笨木头Cocos2dx 038】战争迷雾效果 第01章_要探索,不要地图全开!相关推荐

  1. 【笨木头Cocos2dx 041】战争迷雾效果 第4章_真正的迷雾来了!

    错过了前面章节? 没关系,传送门在这: 战争迷雾效果 第1章_要探索,不要地图全开! 战争迷雾效果 第2章_先把地图加进来 战争迷雾效果 第3章_准确地获取屏幕上的瓦片位置 经过这么多铺垫,我们要来正 ...

  2. 战争迷雾效果 第4章_真正的迷雾来了!

    原文地址:http://www.benmutou.com/blog/archives/485 经过这么多铺垫,我们要来正式编写实现迷雾效果的代码了. (小若:快点开始写,别唠叨了!) 笨木头花心贡献, ...

  3. 战争迷雾效果 第05章 项目源码下载

    笨木头花心贡献,啥?花心?不呢,是用心~ 转载请注明,原文地址:http://www.benmutou.com/blog/archives/502 正文: 关于战争迷雾效果的项目源码一直没有放出来,原 ...

  4. cocos2dx 实现战争迷雾效果

    游戏里面的战争迷雾或者刮刮乐效果可以用下面的方法实现 function MainScene:onCreate()local strVertSource = "attribute vec4 a ...

  5. Unity3D技术开发之战争迷雾效果

    相信玩过Dota,英雄联盟等即时竞技类游戏的朋友都知道战争迷雾,这次做了一个战争迷雾的效果: 战争迷雾大家应该很熟悉了,一开始地图全部都是黑的,只有主角的一定范围内能看得到.随着主角的移动,未探索的区 ...

  6. Unity3D战争迷雾效果

    战争迷雾demo视频 这次做了一个战争迷雾的效果: 战争迷雾大家应该很熟悉了,一开始地图全部都是黑的,只有主角的一定范围内能看得到.随着主角的移动,未探索的区域变成了可见. 我这个demo还做了视角切 ...

  7. 【笨木头Cocos2d-x 042】一个函供应多个菜单回调——UserObject自定义数据

    笨木头花心贡献,啥?花心?不呢,是用心~ 转载请注明,原文地址:http://www.benmutou.com/blog/archives/596 正文: 1.Java的菜单点击事件实现方式 我是个J ...

  8. Unity MOBA类型游戏的战争迷雾效果

    基于视野(FOV)的战争迷雾,例如LOL的视野:鼠标右键点击地板,目标移动,同时显示角色周围视野,鼠标滚轮可以调节远近. Unity版本:2019.4.1f1 1.新建工程---右键3D Object ...

  9. 2D游戏的战争迷雾实现方式

    转自: http://bbs.gameres.com/forum.php?mod=viewthread&tid=201878&extra=page%3D16%26filter%3Dso ...

  10. 游戏地图拼接与战争迷雾的实现

    在开发游戏的过程中,特别是地图编辑器中,需要利用最少的资源,实现最丰富的地形地貌.虽然现在众多的RPG开始使用整图,但是我们偶尔还是需要能够让玩家自己编辑地图,或者其他需要自动进行地图构建的功能. 另 ...

最新文章

  1. Nginx源码分析--字符串处理
  2. VMware虚拟机安装WIN7
  3. html月球绕地球转,CSS3地球公转,月球绕地球转
  4. DUILIB中获取flash,webbrowser control的方法
  5. 直接运行PowerShell脚本
  6. getline及读文件总结
  7. C++ Primer 5th笔记(chap 13 拷贝控制)=default
  8. 赛普拉斯 12864_如何使用赛普拉斯自动化辅助功能测试
  9. DSO windowed optimization 代码 (3)
  10. 程序员谈谈我的职场观(一)
  11. mysql replace into语句学习
  12. artcam2008 stp 教程_ArtCAM_中文版使用教程
  13. 【C004】VB - 数据文件(一)顺序文件
  14. Eclipse下载与安装及汉化(详解版)
  15. C语言--求质数(详解)(筛选求质数)
  16. Java 链表元素如何从键盘输入 面试 笔试高频
  17. linux setlocale函数,linux setlocale用法
  18. DASCTF Sept X 浙江工业大学秋季挑战赛wp
  19. SpringBoot 与 Kotlin 完美交融
  20. 用Java实现代码字符画效果

热门文章

  1. dispatch_once造成的死锁问题
  2. dispatch_group_async
  3. 使用 Ubuntu 搭建 Minecraft 官方或Mod(Forge)服务器
  4. Unity3d——UGUI学习笔记
  5. debian7开机启动
  6. FileZilla查看站点隐藏文件
  7. 【历史上的今天】4 月 3 日:亚马逊卖出第一本书;世界上第一通手机电话;IBM 计算机先驱出生
  8. Uni-app 实现离线打包 安卓篇
  9. I3D【Inflated 3D ConvNet】——膨胀卷积网络用于行为识别
  10. react应用结构框架图