2048的游戏逻辑比较简单,向四个方向移动单元格,若相邻的单元格数字相同,则合并成一个新的单元格,且数字为之前的两倍;若不同,则移动到目的方向上的首个非空位置;
当盘面没有空格,且无法移动时(即不存在两个相同的单元格相邻)游戏结束
游戏逻辑的代码主要在GameLayer类中实现,包括绘制背景,管理Grid,移动事件监听和执行
#pragma once
#include "cocos2d.h"
#include "Grid.h"
USING_NS_CC;
class GameLayer :
public cocos2d::Layer
{
public:
static GameLayer* getInstance();
virtual bool init();
virtual void initBg();
void initGrids();
void loadGrids(int type);
void clearGrids();
void restartGame();
void undoGame();
void randGenGrid();
virtual void onEnter() override;
virtual void onExit() override;
bool onTouchBegan(Touch *touch, Event* event);
void onTouchMoved(Touch* touch, Event* event);
void onTouchEnded(Touch* touch, Event* event);
Grid* _grids[4][4];
int _lastGrids[4][4];
private:
CREATE_FUNC(GameLayer);
void clearLastGrids();
void saveLastGrids();
void recoverLastGrids();
// move function
bool moveToTop();
bool moveToBottom();
bool moveToRight();
bool moveToLeft();
int getPreGridIndex(const int direction, int row, int column);
int moveGrid(const int direction, int row, int column, int targetRow, int targetColumn);
void moveAndUpdate(int value, int targetRow, int targetColumn);
void moveOnly(int row, int column, int targetRow, int targetColumn);
void moveAndClear(int row, int column, int targetRow, int targetColumn);
bool ifOver();
Vec2 _begin;
Vec2 _end;
bool _isOver;
static GameLayer* _instance;
};
enum Direction
{
LEFT,
RIGHT,
UP,
DOWN
};
头文件如上,首先我们对其进行简单的分析
1. 基本功能设计
在init函数中实现背景的绘制,即一个大背景和4x4个小的单元格背景, 均使用LayerColor类完成
bool GameLayer::init()
{
do{
CC_BREAK_IF(!Layer::init());
this->setContentSize(Size(300, 300));
this->setPosition(10, 65);
initBg();
}while(0);
return true;
}
void GameLayer::initBg()
{
// init the rand seed
struct timeval now;
gettimeofday(&now, NULL);
srand((unsigned int)(now.tv_sec * 1000 + now.tv_usec / 1000));
auto bg = LayerColor::create(Color4B(186,172,159,255), 300, 300);
this->addChild(bg);
for(int i = 0; i < 4; i++)
{
for(int j = 0; j < 4; j++)
{
auto cellBg = LayerColor::create(Color4B(213, 205, 194, 255), 65, 65);
cellBg->setPosition(73 * j + 8, 73 * i + 8);
this->addChild(cellBg);
}
}
//first start, recover the stat from the locord file
loadGrids(UserDefault::getInstance()->getIntegerForKey("type"));
}
代码比较简单,看一下里面的随机数种子设置,使用当前的时间作为随机数种子,对于cocos2dx的随机数使用可以参考http://blog.csdn.net/liuyueyi25/article/details/45248179
2. _grids数组操作
_grids数组存放了4x4盘面上的对象,有数字的Grid对象和无数字的nullptr, 从前面的头文件也可以看出,这里主要有三个函数与数组相关
从上面的initGrids函数中可以看出,initGrids的处理功能有 初始数组, 清零LastGrids, 在盘面上随机生成两个单元格,这也是游戏起始时需要完成的工作
void GameLayer::initGrids()
{
for(int row = 0; row < 4; row++)
{
for(int column = 0; column < 4; column++)
{
_grids[row][column] = nullptr;
}
}
clearLastGrids();
randGenGrid();
randGenGrid();
}
loadGrids函数其实也包括了加载lastGirds数组,即从存储文件中恢复之前的游戏状态,包括当前的游戏格局(_grids[][]), 其一步状态(_lastGrids[][]), 当然还有分数最高分,只不过这些放在了各自的类函数中实现了
简单分析一下上面流程,首先是判断存储状态是否存在,不存在时直接调用initGrids来初始化游戏状态;否则从文件中恢复
void GameLayer::loadGrids(int type)
{
_isOver = false;
auto f = UserDefault::getInstance();
if(!f->isXMLFileExist() || !f->getBoolForKey(Value(type).asString().append("exits").c_str(), false))
return initGrids();
int value = 0;
for(int i = 0; i < 4; i++)
{
for(int j = 0; j < 4; j++)
{
value = f->getIntegerForKey(Value(type*3).asString().append(Value(100+i*4+j).asString()).c_str());
if(value == -1)
_grids[i][j] = nullptr;
else
{
_grids[i][j] = Grid::create();
_grids[i][j]->initValue(value, i, j);
this->addChild(_grids[i][j]);
}
_lastGrids[i][j] = f->getIntegerForKey(Value(type*3).asString().append(Value(i*4+j).asString()).c_str());
}
}
}
清除数组对象函数,当数组单元内容非空时,移除并设置为空即可
void GameLayer::clearGrids()
{
for(int row = 0; row < 4; row++)
{
for(int column = 0; column < 4; column++)
{
if(_grids[row][column] != nullptr)
_grids[row][column]->removeFromParent();
_grids[row][column] = nullptr;
}
}
}
下面看一下重新开始游戏的函数,当新开局一次游戏时,初始化各种变量,并在盘面上新增两个单元格
void GameLayer::restartGame()
{
_isOver = false;
GameTool::getInstance()->resetScore();
clearGrids();
clearLastGrids();
randGenGrid();
randGenGrid();
}
3. _lastGrids数组操作
_lastGrids是保存上一步布局状态的int数组,其中的内容为-1, -2, 或者grids->getValue()值(>=0)
#define EMPTY -1 // 表示lastGrids中保存的是上次的布局
#define DOUBLE_EMPTY -2 // 表示_lastGrids中保存的是初始化的结果
首先我们看一下初始函数clearLastGrids, 取名不怎么贴切,当时编码时直接考虑的是将_lastGrids数组置空,设置为初始状态… 代码如下,比较容易理解;这里需要说明的是EMPTY和DOUBLE_EMPTY之间的区别,当盘面的某个单元格为空时,保存的是EMPTY或者DOUBLE_EMPTY, 其中前者表示_lastGrids中存放有效信息,即上一步的状态,而后者则表示_lastGrids中的内容为初始值,没有意义;
简单来说,开始一局游戏时,_lastGrids中的信息无效,点击undo无效;当至少移动一次之后,_lastGrids信息有效了,因此点击undo后恢复到之前的游戏状态
void GameLayer::clearLastGrids()
{
for(int row = 0; row < 4; row++)
{
for(int column = 0; column < 4; column++)
{
_lastGrids[row][column] = DOUBLE_EMPTY;
}
}
}
当移动了当前的单元格之后,就需要保存之前的游戏状态,其函数代码如下, 这里需要确定只有移动了单元格的时候才能更新_lastGrids,且只执行一次, 因此前面的if语句必不可少;然后就是调用该函数的时机,在滑动屏幕之后,实现移动单元格之前调用, 查看代码会发现在MoveOnly和MoveAndClear函数中调用,而且还是首行调用
void GameLayer::saveLastGrids()
{
if(++isMove != 1)
return;
for(int row = 0; row < 4; row++)
{
for(int column = 0; column < 4; column++)
{
if(_grids[row][column] != nullptr)
_lastGrids[row][column] = _grids[row][column]->getScoreValue();
else
_lastGrids[row][column] = EMPTY;
}
}
}
保存后就是恢复之前的状态了,当然是在菜单的undo点击后的触发事件了,代码如下
void GameLayer::recoverLastGrids()
{
for(int row = 0; row < 4; row++)
{
for(int column = 0; column < 4; column++)
{
if(_lastGrids[row][column] > EMPTY)
{
_grids[row][column] = Grid::create();
_grids[row][column]->initValue(_lastGrids[row][column], row, column);
this->addChild(_grids[row][column]);
}
else
_grids[row][column] = nullptr;
}
}
}
在这里再看一下undoGame的代码,仅当_lastGrids信息有效时才能恢复到之前的状态,该函数处理两件事,显示清除当前的_grids数组对象,然后恢复之前的状态
void GameLayer::undoGame()
{
if(_lastGrids[0][0] != DOUBLE_EMPTY)
{
clearGrids();
recoverLastGrids();
}
}
4. 注册滑动监听事件
当手指在屏幕滑动时调用相关的函数如何实现?本小节则主要对这方面进行说明
EventListenerTouchOneByOne是我们主要使用的类,首先是注册相关事件,在onEnter函数中实现,该类有三个函数指针onTouchBegan, onTouchMoved, onTouchEnded
void GameLayer::onEnter()
{
Layer::onEnter();
auto listener = EventListenerTouchOneByOne::create();
listener->setSwallowTouches(true);
listener->onTouchBegan = CC_CALLBACK_2(GameLayer::onTouchBegan, this);
listener->onTouchMoved = CC_CALLBACK_2(GameLayer::onTouchMoved, this);
listener->onTouchEnded = CC_CALLBACK_2(GameLayer::onTouchEnded, this);
_eventDispatcher->addEventListenerWithSceneGraphPriority(listener, this);
}
4.1 onTouchBegan函数
onTouchBegan表示刚开始触摸屏幕时调用,会返回一个bool型变量,为false时该次触摸结束;为true时继续,也是后续调用onTouchMoved和onTouchEnded的前提
bool GameLayer::onTouchBegan(Touch* touch, Event* event)
{
if(_isOver)//if game over, then restart the game
{
auto fail = this->getChildByName("fail");
fail->setVisible(false);
restartGame();
return false;
}
_begin = touch->getLocation();
auto rect = Rect(this->getPosition().x, this->getPosition().y, this->getContentSize().width, this->getContentSize().height);
return rect.containsPoint(_begin); // means only touch the game box, then response
}
以上代码中,我们首先查看onTouchBegan,第一步获得触摸点的坐标 _begin = touch->getLocation(); ,然后判断该坐标是否在盘面内,即表示只有在盘面内滑动才有效,这里的判断方法是调用Rect的containPoint函数,实际上使用下面的代码可以直接实现相同的功能。
bool GameLayer::onTouchBegan(Touch* touch, Event* event)
{
if(_isOver)//if game over, then restart the game
{
auto fail = this->getChildByName("fail");
fail->setVisible(false);
restartGame();
return false;
}
return this->getBoundingBox().containsPoint(_begin); // means only touch the game box, then response
}
4.2 onTouchMoved函数
这个函数更多的使用在拖拽某个对象的时候使用,如拖动某个单元,使其跟随手指的移动而移动,即一个动态改变对象坐标的过程,当然本游戏中并没有涉及到这一块,因此查看代码的时候会看到函数体是空的,其实在代码中,完全可以不写该函数的 这里我贴一下cocos例子中的函数代码,实现了一个动态修改对象坐标的功能
void TestController::onTouchMoved(Touch* touch, Event *event)
{
auto touchLocation = touch->getLocation();
float nMoveY = touchLocation.y - _beginPos.y;
auto curPos = _itemMenu->getPosition();
auto nextPos = Vec2(curPos.x, curPos.y + nMoveY);
if (nextPos.y < 0.0f)
{
_itemMenu->setPosition(Vec2::ZERO);
return;
}
if (nextPos.y > ((g_testCount + 1)* LINE_SPACE - VisibleRect::getVisibleRect().size.height))
{
_itemMenu->setPosition(0, ((g_testCount + 1)* LINE_SPACE - VisibleRect::getVisibleRect().size.height));
return;
}
_itemMenu->setPosition(nextPos);
_beginPos = touchLocation;
s_tCurPos = nextPos;
}
4.3 onTouchEnded函数
手指离开屏幕后调用的函数,这里当进入该函数后,就需要判断调用相应的移动方向函数了(moveToXXX),代码容易理解,直接贴出, 加了一个防误触发判断机制,当手指滑动距离过小时,不响应
void GameLayer::onTouchEnded(Touch* touch, Event* event)
{
_end = touch->getLocation();
auto value = _end - _begin;
if(abs(value.x) > abs(value.y)) // left or right move
{
if(value.x - 5 > 0) // to right
moveToRight();
//else if(value.x + 5 < 0) // to left
else if(value.x + 5 < 0)
moveToLeft();
else
return;
}
else
{
if(value.y - 5 > 0) // to up
moveToTop();
else if(value.y + 5 < 0)
moveToBottom();
else
return;
}
if(isMove > 0) // if moved, then add a new Grid item
randGenGrid();
// judge if game over
_isOver = ifOver();
}
5. 移动单元格
移动单元格可以说是2048的主要逻辑算法体现所在了,这里以向右移动为代表进行详细说明,下图中由图一向右移动为图二的状态
向右移动,即每一行的单元格“尽可能”的向右移动,因此我们以行为单位进行判断,在某一行的判断逻辑为:
1. 选择最右的非空单元格 ---》
2. 找到该单元格紧临的非空单元格 ---》
3. 判断两者是否可以消除 -----》
4.1 可以则合并两个单元格,返回前一个单元格索引 –1
4.2 不可以则将该单元格”尽可能”的右移,并返回前一个单元格的索引
5. 执行步骤2
这里查看moveToRight代码如下
bool GameLayer::moveToRight()
{
auto target = 3;
auto preColumn = 0;
for(int row = 0; row < 4; row ++)
{
target = 3;
for(int column = 3; column >= 0; column --)
{
if(_grids[row][column] == nullptr)
continue;
preColumn = moveGrid(Direction::LEFT, row, column, row, target);
if(preColumn == ERRORINDEX)
break;
target--;
}
}
return isMove>0;
}
该函数内部直接调用了moveGrid函数,而moveGrid就实现了单元格的移动,并且返回下一个开始判断的位置,到这里再看上面的代码,preColumn有半毛钱的用… 改改改,新的代码如下:
bool GameLayer::moveToRight()
{
auto target = 3;
for(int row = 0; row < 4; row ++)
{
target = 3;
for(int column = 3; column >= 0; column --)
{
if(_grids[row][column] == nullptr)
continue;
column = moveGrid(Direction::LEFT, row, column, row, target);
if(column == ERRORINDEX)
break;
target--;
}
}
return isMove>0;
}
ok,更新上面的代码,接着研究moveGrid函数,该函数实现将_grids[row][column]移动到_grids[row][target]的位置上
moveGrid函数逻辑为:
// move the grid to target place and return the pre_grid index
int GameLayer::moveGrid(const int direction, int row, int column, int targetRow, int targetColumn)
{
int addScore = 0;
int preColumnOrRow = getPreGridIndex(direction, row, column);
if(preColumnOrRow == ERRORINDEX)
{
moveOnly(row, column, targetRow, targetColumn);
return ERRORINDEX;
}
int preRow, preCol;
int tag = -1;
switch(direction)
{
case Direction::LEFT:
tag = 1;
case Direction::RIGHT:
preRow = row;
preCol = preColumnOrRow;
break;
case Direction::DOWN:
tag = 1;
case Direction::UP:
preRow = preColumnOrRow;
preCol = column;
break;
}
if(_grids[row][column]->compareTo(_grids[preRow][preCol])) // can merge two number
{
auto value = _grids[row][column]->getScoreValue();
moveAndClear(row, column, targetRow, targetColumn);
moveAndClear(preRow, preCol, targetRow, targetColumn);
moveAndUpdate(++value, targetRow, targetColumn);
GameTool::getInstance()->updateScore(pow(2, ++value));
return preColumnOrRow;
}
moveOnly(row, column, targetRow, targetColumn);
return preColumnOrRow + tag;
}
下面则分析getPreGridIndex函数,获得前一个非空单元格的索引值,在向右移动的示例中,也就是获得目标单元格左边非空单元格的column值,所以代码如下
#define ERRORINDEX -1
int GameLayer::getPreGridIndex(const int direction, int row, int column)
{
switch(direction)
{
case Direction::LEFT:
while(--column >= 0)
if(_grids[row][column] != nullptr)
return column;
break;
case Direction::RIGHT:
while(++column <= 3)
if(_grids[row][column] != nullptr)
return column;
break;
case Direction::UP:
while(++row <= 3)
if(_grids[row][column] != nullptr)
return row;
break;
case Direction::DOWN:
while(--row >= 0)
if(_grids[row][column] != nullptr)
return row;
break;
}
return ERRORINDEX;
}
接着就是 moveGrid中调用的移动函数了,其中 moveOnly是单纯的移动单元格到目的地
void GameLayer::moveOnly(int row, int column, int targetRow, int targetColumn)
{
if(row == targetRow && column == targetColumn)
return;
saveLastGrids(); //save current _grids state in _lastGrids[][]
//auto action = MoveTo::create(0.1f, Vec2(73*targetColumn + 8, 73*targetRow+ 8));
_grids[row][column]->moveOnly(targetRow, targetColumn);
_grids[targetRow][targetColumn] = _grids[row][column];
_grids[row][column] = nullptr;
}
moveAndClear, moveAndUpdate函数则是移动合并,直接调用grid对应的函数即可,这里也体现了之前设计grid将所有的动画封装到该类中的优越性了
void GameLayer::moveAndUpdate(int value, int targetRow, int targetColumn)
{
auto temp = Grid::create();
temp->initValue(value, targetRow, targetColumn);
_grids[targetRow][targetColumn] = temp;
this->addChild(_grids[targetRow][targetColumn]);
temp->moveAndUpdate();
}
void GameLayer::moveAndClear(int row, int column, int targetRow, int targetColumn)
{
saveLastGrids();
_grids[row][column]->moveAndClear(targetRow, targetColumn);
_grids[row][column] = nullptr;
}
到这里,2048的主逻辑判断已经讲述完毕,单元格的移动合并判断是整个游戏中的难点了,上面的设计中也算是较为清晰的描述了整个过程,具体的项目工程可以参考: https://github.com/liuyueyi/2048 若测试有bug欢迎指针
后面剩下的就是保存数据到文件,音乐,android编译,加广告几个附属功能的介绍了,当然在代码中其实也没有实现….. 后面再看啥时候补全-.-||