[置顶] 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,表示这里应该是消除掉了,是空格。

然后删除掉顶点数组,然后调清理图标的函数。

这个连连看的基本功能就完成了。

后面还有倒计时,自动提示两个功能,那么一个完整的连连看就完成了。

你可能感兴趣的:(连连看,cocos2d-x,游戏开发,画线)