1. 程式人生 > >【笨木頭Cocos2dx 038】戰爭迷霧效果 第01章_要探索,不要地圖全開!

【笨木頭Cocos2dx 038】戰爭迷霧效果 第01章_要探索,不要地圖全開!

這次我要介紹一個很好玩的東西——戰爭迷路。

(小若:喂!迷路?)

其實這麼解釋不太好解釋,我們舉個例子。魔獸爭霸相信大家都玩過,遊戲開始時,地圖上到處都是黑濛濛的一片,什麼都看不到,我們必須一邊走一邊探路。

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

就是這樣,我們來看看下圖就更加清楚了(圖片資源來自網路):

(小若:我說,你早點放圖不就好了,為什麼要解釋這麼多!)

我們即將用Cocos2d-x的CCTMXTiledMap來實現這個功能。

(小若:好棒!)

但是,在這之前,我們得先補點數學理論知識。

(小若:我討厭數學!)

1. 版權問題

在這之前,我必須要宣告,戰爭迷霧的製作原理參考了以下這篇文章:

這篇文章寫得很好,大家感興趣的可以看看。本教程使用到的理論基礎和部分素材均來自這篇文章,特此宣告。同時,十分感謝網友的無私奉獻。

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_探索不要地圖

這次我要介紹一個很好玩的東西——戰爭迷路。 (小若:喂!迷路?) 其實這麼解釋不太好解釋,我們舉個例子。魔獸爭霸相信大家都玩過,遊戲開始時,地圖上到處都是黑濛濛的一片,什麼都看不到,我們必須一邊走一邊探路。 (小若:我知道了!不就是地圖探索嘛!) 就是這樣,我們來看看

木頭Cocos2dx 039戰爭迷霧效果 02_先把地圖加進來

 錯過了前面章節? 沒關係,傳送門在這: 正文: 現在我們要載入一張TMX地圖,這張地圖有點複雜,大家打起精神。 (小若:吼!) 1. 建立TMX地圖 現在,開啟我們的Tiled地圖編輯器,新建一個地圖:【新建】->【新建檔案】,地圖寬為10,地圖高為10。

(轉載)木頭Lua專欄基礎補充20:面向對象——類和繼承

笑話 ava span 生成 code BE 手機 情況 忽略 終於來了,在Lua中的面向對象編程,相信目前學習Lua的大部分人都是為了開發手機網遊吧。而且基本都是奔著腳本語言的熱更新特性去的,所以全腳本開發變得十分流行。 對於普及不太廣的Lua(相對於C++、Java等主

(轉載)木頭Lua專欄基礎補充22:弱引用table

ive AC -c 所在 lan contain 函數 貢獻 缺陷 這次要介紹的內容比較少,就一個——弱引用table 笨木頭花心貢獻,哈?花心?不,是用心~ 轉載請註明,原文地址:http://www.benmutou.com/archives/1808 文章來源:

(轉載)木頭Lua專欄基礎補充21:面向對象——多重繼承、私密性

子類 先來 nta 參數 hive lua 封裝 完成 存在 在Lua中的多重繼承和私密性可能用得比較少,也可能只是我個人用得比較少。 本來想偷懶不寫這文章的,因為我今天剛買了個漂移板,連起步都還沒學會啊,想多學一會。 咳咳,本著堅持不懈、負責到底的態度,我還是決定隨便寫幾

木頭Lua專欄基礎補充01:巧說table的幾種構造方式

之前對於Lua的研究都是紙上談兵,沒有真正的專案練手,現在公司的專案基本上都是用Lua開發,是時候補充一下我那蹩腳的Lua知識了。 基礎資料型別、表示式、迴圈結構什麼的我就不說了,這麼簡單的東西說了也要被大家噴。 今天我想說說table的幾種構造方式。 本文來自[

最高補貼3萬微信支付18年校招開始了快發簡歷來

騰訊2018年校園招聘即將開始,2019年畢業的同學歡迎自薦,有親朋好友明年畢業的話也歡迎推薦。 微信支付今年招聘各個崗位的優秀人才,在這裡你可以接觸最前沿的網際網路產品形態,可以學習和使用最先進的網際網路技術,可以接觸到和消費相關的各行各業。在這裡你可以和優秀的同事們一起努力,讓微信支付

廖雪峰python3.0-課後習題:5:高階特性

#5.1切片 # 利用切片操作,實現一個trim()函式,去除字串首尾的空格,注意不要呼叫str的strip()方法: def trim(s): if(s[:1]==" "):

木頭Unity入門之旅010(完結):Demo之四處找死(五)_UI

UI是遊戲裡必不可少的元素,在Unity裡新增UI是比較輕鬆的事情,但要玩好它,可就不那麼輕鬆了。 沒關係,先入門。   笨木頭花心貢獻,啥?花心?不,是用心。 轉載請註明,原文地址:http://www.benmutou.com/archives/2196

方法學PAT對字串的reverse

一、reverse string s; reverse(s.begin(),s.end()); 標頭檔案:#include<algorithm> 二、程式碼 #include<iostream> #include<string> #incl

方法學PAT1013 Battle Over Cities(25 分)

一、題目 It is vitally important to have all the cities connected by highways in a war. If a city is occupied by the enemy, all the highways from/towa

方法學PAT1012 The Best Rank(25 分)

一、題目 To evaluate the performance of our first year CS majored students, we consider their grades of three courses only: C - C Programmin

方法學PAT1011 World Cup Betting(20 分)

一、題目 With the 2010 FIFA World Cup running, football fans the world over were becoming increasingly excited as the best players from the best teams

方法學PAT1010 Radix(25 分)

一、題目 Given a pair of positive integers, for example, 6 and 110, can this equation 6 = 110 be true? The answer is yes, if 6 is a decimal numbe

方法學PAT1009 Product of Polynomials(25 分)

一、題目 This time, you are supposed to find A×B where A and B are two polynomials. Input Specification: Each input

方法學PAT1008 Elevator(20 分)

一、題目 The highest building in our city has only one elevator. A request list is made up with N positive numbers. The numbers denote at wh

cocos2dx 實現戰爭迷霧效果

遊戲裡面的戰爭迷霧或者刮刮樂效果可以用下面的方法實現 function MainScene:onCreate() local strVertSource = "attribute vec4 a_position;\n".. "attribute vec2 a_te

三、辦法學python學習隨筆之一:格式化字元

python中的格式化字元 語法 我們舉個例子來說明格式化字串的語法 \>>> 'Hello, %s' % 'world' 'Hello, world' \>>> 'Hi, %s, you have $%d.' % ('Michael

未完成方法學PAT1018 Public Bike Management (30 分)

一、題目 There is a public bike service in Hangzhou City which provides great convenience to the tourists from all over the world. One may rent a bike

方法學PAT1149 Dangerous Goods Packaging (25 分)

一、題目 When shipping goods with containers, we have to be careful not to pack some incompatible goods into the same container, or we might get ourse