这一节来讲地图初始化实现。
连连看地图初始化有很多实现方式，大概会有以下几种：
每一格的位置随机取图片放上去 随机取图片放到随机的位置上去 把图片铺满地图，随机打乱位置
我们采用第三种方式。要注意的是，为了保证最后所有的图片都被消掉，那么所有的图片都要是偶数个。我们采用逐格绘制，每次放两张相同的图片，铺满地图以后，随机打乱。
初始如下：
0
0
0
0
0
0
0
0
0
0
0
1
1
2
2
3
3
4
4
0
0
5
5
6
6
7
7
8
8
0
0
9
9
10
10
11
11
12
12
0
0
13
13
14
14
15
15
16
16
0
0
0
0
0
0
0
0
0
0
0
然后随机打乱就可以了，注意只随机打乱非零的位置。
代码里面如何实现呢，很简单。
定义一个二维数组，地图每一格对应一个值， 其值为0表示是一个空格，其他数字就是图片的id。
数组初始化都是0，然后遍历一遍，四个边框还是零，里面的位置按图片id，成对赋值。
我把地图数组赋值和图片绘制分成两部分，先初始化地图数组，然后再画棋盘。看代码：
void GameScene::initMap()
{
// 这里x用来控制地图数组的每格的值，y用来控制两次反转，即每两个格标记同一个值
int x = 1;
int y = 0;
// 数组下标从0开始，这里从1开始遍历，那么最外面一圈就是0不变
for (int i = 1; i < xCount - 1; i++) {
for (int j = 1; j < yCount - 1; j++) {
// 地图数组赋值
mMap[i][j] = x;
// y控制反转，x控制每格值增加，增大到图片总数后从再1开始递增
if (y == 1) {
x++;
y = 0;
if ( x == iconCount) {
x = 1;
}
}else{
y = 1;
}
}
}
change();
drawMap();
}
上面的 change（）函数就是随机打乱地图数组，drawMap（）函数就是绘制棋盘，讲地图数组对应的图标绘制出来。
接下来看下change（）函数：
// 随机改变一下棋局位置
void GameScene::change()
{
// 随机种子
srand((unsigned int)time(NULL));
// 临时变量，用来交换两个位置的数据
int tempX, tempY, tempM;
// 遍历地图数组，随机交换位置
for (int x = 1; x < xCount - 1 ; x++)
for (int y = 1; y < yCount - 1; y++) {
tempX = 1 + (int)(CCRANDOM_0_1() * (xCount - 2));
tempY = 1 + (int)(CCRANDOM_0_1() * (yCount - 2));
tempM = mMap[x][y];
mMap[x][y] = mMap[tempX][tempY];
mMap[tempX][tempY] = tempM;
}
}
很简单是吧，不说了。
接着看drawMap（）函数：
void GameScene::drawMap()
{
// 绘制棋盘上精灵
for (int x = 0; x < xCount; x++) {
for (int y = 0; y < yCount; y++) {
if (mMap[x][y] > 0) {
char iconName[64] = {0};
// 格式化图片名
sprintf(iconName, %d.png, mMap[x][y]);
auto position = indextoScreen(x, y);
// 所有图片已经加到帧缓存，这里直接用名字取一帧，创建一个精灵
auto icon = Sprite::createWithSpriteFrame(SpriteFrameCache::getInstance()->getSpriteFrameByName(iconName));
//icon->setAnchorPoint(Vec2(0, 0));
icon->setPosition(position);
// 设置一个tag，方便后续识别点击的是那个图标
int tag = (yCount - 2) * ( x - 1 ) + y;
// 这是Z序和tag值，Z序设置大一些确保图标在其他精灵的前面
addChild(icon, 100, tag);
}
}
}
}
代码都加了很多注释，应该很好理解。不过里面有一行注释掉的代码，是设置锚点的。精灵的默认锚点是（0.5，0.5），也就是中心位置，但是我一开始想把它设为左下角，这样地图铺起来就比较直观。做到后来做点击连线的时候发现从中间连线会很麻烦，所以就把这行注释掉了，直接用默认锚点。这样做的话，后面的屏幕坐标和地图数组坐标转换就要做一下处理了。后面再讲。
好了，到这里地图就绘制完成了。
