cocos2d-x3.6 連連看連通畫線，cocos2d-x3.6連連看

cocos2d-x3.6 連連看連通畫線，cocos2d-x3.6連連看

我的部落格：http://blog.csdn.net/dawn_moon

網上看到很多人寫的連連看，都沒有畫連線的實現，其實要話連線挺簡單的。cocos2d-x 提供了一個很方便的畫圖形的類，DrawNode。這個類封裝了很多畫線條，多邊形的方法，很方便，很好用，很強大。

DrawNode的使用很簡單，我使用一個成員變數來儲存這個DrawNode，因為會一直重複使用。

mDraw = DrawNode::create();addChild(mDraw, 1000);

它的使用跟精靈一樣，create出來以後，add到當前層。

void GameScene::drawLine(){    // 畫線    if (mPath.size() >= 2) {        Vec2 *vecs = new Vec2[mPath.size()];        for (int i = 0 ; i < mPath.size(); i++) {            vecs[i] = indextoScreen(mPath.at(i).x, mPath.at(i).y);        }        // 隨機給線條一個顏色        auto color = CCRANDOM_0_1();        // 迴圈畫線段，只有線段可以設定線條寬度        for (int i = 0 ; i < mPath.size(); i++) {            if ( i > 0) {                mDraw->drawSegment(vecs[i-1], vecs[i], 5, Color4F(color, color, color, 1));            }        }        // 連通的兩個表徵圖對應的地圖數組置0        Vec2 p1 = mPath.front();        mMap[(int)p1.x][(int)p1.y] = 0;        Vec2 p2 = mPath.back();        mMap[(int)p2.x][(int)p2.y] = 0;        // 刪掉線段的頂點數組        delete []vecs;        // 清除連通的表徵圖，同時清除路徑點        scheduleOnce(SEL_SCHEDULE(&GameScene::clearMatched), 0.2);    }}

前面講了，我們將兩個表徵圖連通的路徑關鍵點存在了一個容器mPath裡面，至少會有2個點，最多4個點。

然後我們用DrawNode裡面的drawSegment（）函數來畫連線。

這個函數是畫線段的，就是兩個點一條線，為什麼要用這個函數。DrawNode裡面還有一個函數可以用來畫多角形，原型如下：

void drawPoly(const Vec2 *poli, unsigned int numberOfPoints, bool closePolygon, const Color4F &color);

這個函數參數有個bool closePolygon，可以用來畫閉合或開放多角形，簡直一步到位了。但是它不能設定線條寬度，畫出來的線條很細，預設的寬度，不太合適。

然後我採用了畫線段的函數，將路徑裡面的點，迴圈取出來，兩個點畫一個線段，原型：

void drawSegment(const Vec2 &from, const Vec2 &to, float radius, const Color4F &color);

第一個參數，開始頂點，第二參數，目的頂點，第三個參數，線條寬度，第四個參數，線條顏色。

畫完連線以後呢，將兩個表徵圖的數組置0，表示這裡應該是消除掉了，是空格。

然後刪除掉頂點數組，然後調清理表徵圖的函數。

這個連連看的準系統就完成了。

後面還有倒計時，自動提示兩個功能，那麼一個完整的連連看就完成了。