Android实训案例(四)——关于Game，2048方块的设计，逻辑，实现，编写，加上色彩，分数等深度剖析开发过程！

Android实训案例(四)——关于Game，2048方块的设计，逻辑，实现，编写。加上色彩。分数等深度剖析开发过程！

一.Score分数

既然是2048游戏。我们也就做一个简单的，他有一个分数，然后就是一个游戏的布局，我们也做一个简单的4*4的游戏，大概的设计图就是这样

二.游戏类：GameView

<com.lgl.game2048.GameView
android:id="@+id/game_view"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />

三.实现交互逻辑

事实上关于MotionEvent的几个方法，大家预计都见怪不怪了。由于用的太多了

// 初始化
private void initView() {
// 识别手势
setOnTouchListener(new OnTouchListener() {

// 起始点和偏移点
private float startX, startY, offsetX, offsetY;

@Override
public boolean onTouch(View v, MotionEvent event) {
/**
* 交互逻辑 :我们事实上仅仅要知道两点，用户手指按下的坐标点和手指离开的坐标点。然后进行比对，就能识别出用户的意图了
*/
switch (event.getAction()) {
// 手指按下
case MotionEvent.ACTION_DOWN:
// 记录按下的x,y坐标
startX = event.getX();
startY = event.getY();

break;
// 手指离开
case MotionEvent.ACTION_UP:
// 手指离开之后计算偏移量(离开的位置-按下的位置在进行推断是往哪个方向移动)
offsetX = event.getX() - startX;
offsetY = event.getY() - startY;

// 開始识别方向
// offsetX 的绝对值大于offsetY的绝对值 说明在水平方向
if (Math.abs(offsetX) > Math.abs(offsetY)) {
// (直接<0 会有些许误差。我们能够 <-5)
if (offsetX < -5) {
// 左
System.out.println("左");
} else if (offsetX > 5) {
// 右
System.out.println("右");
}
// 開始计算垂直方向上下的滑动
} else {
if (offsetY < -5) {
// 上
System.out.println("上");
} else if (offsetY > 5) {
// 下
System.out.println("下");
}
}
break;
}
return true;
}
});
}

上面的逻辑是不是非常的简单，然后我们操作一下，看log

如今手势识别也是非常精准了，当然，我们的代码设计也不能太过臃肿。所以。我们的操作逻辑就不在里面编写了。我们分别实现四个方向的方法

// 左
private void isLeft() {

}

// 右
private void isRight() {

}

// 上
private void isTop() {

}

// 下
private void isButtom() {

}

然后把输出语句替换掉，监听到哪个方向就执行哪个方法

//System.out.println("上，下，左，右");
private void isXXX() {

}

四.实现方块类CardView

我们能够把这一个个卡片看作是一个对象。我们每次操作，他都要进行实例化
首先。我们新建一个类CardView继承自FrameLayout，再里面我们要考虑三点

package com.lgl.game2048;

import android.content.Context;
import android.widget.FrameLayout;
import android.widget.TextView;

public class CardView extends FrameLayout {

// 卡片数量
private int num = 0;
// 卡片文字
private TextView tv_num;

public CardView(Context context) {
super(context);
// 初始化TextView
tv_num = new TextView(getContext());
// 卡片文字大小
tv_num.setTextSize(20);
// 布局控制器，填充满整个父容器
LayoutParams lp = new LayoutParams(-1, -1);
addView(tv_num, lp);

setNum(0);
}

public int getNum() {
return num;
}

public void setNum(int num) {
this.num = num;

// 要呈现出来的文字（这里要注意是String类型的）
tv_num.setText(num + "");
}

// 两卡片同样的比較方法
public boolean equals(CardView card) {

return getNum() == card.getNum();
}

}

五.动态分配方块的宽高以及加入方块

1.动态分配方块的宽高

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
// TODO Auto-generated method stub
super.onSizeChanged(w, h, oldw, oldh);
}

//禁止屏幕横屏
android:screenOrientation="portrait"

再让他除以4。通过这种方式，我们就能够动态平分这个宽度了

int cardWidth = (Math.min(w, h)-10)/4;

2.加入方块

-1.加入卡片

// 加入卡片,參数为卡片的宽高，由于他是正方形，所以宽高都是cardWidth
private void addCard(int cardWidth, int cardHeight) {
// 创建方块
CardView c;
// 循环加入
for (int i = 0; i < 4; i++) {
for (int j = 0; j < 4; j++) {
c = new CardView(getContext());
// num为随机数
c.setNum(2);
addView(c, cardWidth, cardHeight);
}
}
}

好的，我们来执行一下（换个AS2.0的模拟器感觉萌萌哒）

-2.方块换行

你会发现。并没有4*4，而且一排没有换行，我们回到GameView的initView()方法中加入

//换行
setColumnCount(4);

如今再看看

-3.文字居中

如今我们调整一下。让文字居中。在CardView中

//文字居中
tv_num.setGravity(Gravity.CENTER);

如今是不是好看多了

-4.方块颜色

既然是玩2048我们怎么能少了颜色尼，我们就依据这

//设置文字背景(暗卡其色)
tv_num.setBackgroundColor(0xffBDB76A);

-5.方块间距

既然是方块间隔。我们还是回到CardView里面，还记得我们设置的LayoutParams吗？你可能想到了吧，我们用Margins

//设置间距
lp.setMargins(10, 10, 0, 0);

-6.记忆方块

我们所操作之后，会有新生成的卡片，为了不重合，我们得做一个记忆功能

// 记录卡片的二维数组
private CardView[][] cards = new CardView[4][4];

然后在addCard()方法中

//记忆
cards[j][i] = c;

六.随机数

// 要呈现出来的文字（这里要注意是String类型的）
if (num <= 0) {
tv_num.setText("");
} else {
tv_num.setText(num + "");
}

然后把刚才的文字设置换成0

// c.setNum(2);
c.setNum(0);

然后我们就能够加入随机数了。我们新建一个方法addRandom();

// 随机数
private void addRandom() {
// 我们新建一个lsit存放空的方块，操作之前清空
point.clear();
// 对全部的位置进行遍历
for (int i = 0; i < 4; i++) {
for (int j = 0; j < 4; j++) {
// 空方块才干够加入数字，有值我们就不加入
if (cards[j][i].getNum() <= 0) {
point.add(new Point(j, i));
}
}
}
// for循环走完之后我们要取方块
Point p = point.remove((int) (Math.random() * point.size()));
// 我们用Math.random()返回一个0-1的数。当大于0.1的时候是2否则就是4，也就是4出现的概率为十分之中的一个
cards[p.x][p.y].setNum(Math.random() > 0.1 ? 2 : 4);
}

这个时候我们就能够開始游戏了。为了方便等下我们须要又一次開始游戏，我们就新建一个startGame()方法，让他在onSizeChanged()调用

// 开启游戏
private void startGame() {
// 既然是開始游戏，我们就要对全部的值进行清理
for (int i = 0; i < 4; i++) {
for (int j = 0; j < 4; j++) {
cards[j][i].setNum(0);
}
}
// 又一次加入随机数
addRandom();
// 我们要加入两个
addRandom();
}

好的，我们如今执行一下啊

这正是我们要的效果，每次进入游戏随机生成两个方块，他会出如今不同的位置，而且会出现2和4，4的概率小非常多

七.实现方块滑动。递加逻辑

好的，最终到了核心的东西了，这次我们就要用到之前所写的上下左右方向方法了

// 左
private void isLeft() {
/**
* 这里的逻辑有三种情况 1.左边为空。直接左滑到最后一格 2.左边碰到的第一个数是相等的，就相加 3.左边碰到的第一个数是不相等的。靠在旁边
*/
for (int i = 0; i < 4; i++) {
for (int j = 0; j < 4; j++) {
// 往左滑是一行一行去遍历的
for (int j2 = j + 1; j2 < 4; j2++) {
// 假设说遍历到值
if (cards[j2][i].getNum() > 0) {
// 假设当前位置上为0,就放在这个位置上去
if (cards[j][i].getNum() <= 0) {
cards[j][i].setNum(cards[j2][i].getNum());
// 把原来位置上的数字清除
cards[j2][i].setNum(0);
// 让图形继续遍历
j--;

// 有值，而且还同样
} else if (cards[j][i].equals(cards[j2][i])) {
// 合并,这里做了一个非常巧妙的写法。我们相加。事实上2048方块上的数字都是双倍的。所以我们仅仅要原数据*2就能够了
cards[j][i].setNum(cards[j][i].getNum() * 2);
// 把原来位置上的数字清除
cards[j2][i].setNum(0);

}
break;
}
}
}
}
}

// 右
private void isRight() {
/**
* 这里的逻辑有三种情况 1.左边为空，直接左滑到最后一格 2.左边碰到的第一个数是相等的，就相加 3.左边碰到的第一个数是不相等的，靠在旁边
*/
for (int i = 0; i < 4; i++) {
for (int j = 3; j >= 0; j--) {
// 往左滑是一行一行去遍历的
for (int j2 = j - 1; j2 >= 0; j2--) {
// 假设说遍历到值
if (cards[j2][i].getNum() > 0) {
// 假设当前位置上为0,就放在这个位置上去
if (cards[j][i].getNum() <= 0) {
cards[j][i].setNum(cards[j2][i].getNum());
// 把原来位置上的数字清除
cards[j2][i].setNum(0);
// 让图形继续遍历
j++;

// 有值，而且还同样
} else if (cards[j][i].equals(cards[j2][i])) {
// 合并,这里做了一个非常巧妙的写法，我们相加，事实上2048方块上的数字都是双倍的，所以我们仅仅要原数据*2就能够了
cards[j][i].setNum(cards[j][i].getNum() * 2);
// 把原来位置上的数字清除
cards[j2][i].setNum(0);

}
break;
}
}
}
}
}

// 上
private void isTop() {
/**
* 这里的逻辑有三种情况 1.左边为空，直接左滑到最后一格 2.左边碰到的第一个数是相等的，就相加 3.左边碰到的第一个数是不相等的，靠在旁边
*/
for (int j = 0; j < 4; j++) {
for (int i = 0; i < 4; i++) {
// 往左滑是一行一行去遍历的
for (int i2 = i + 1; i2 < 4; i2++) {
// 假设说遍历到值
if (cards[j][i2].getNum() > 0) {
// 假设当前位置上为0,就放在这个位置上去
if (cards[j][i].getNum() <= 0) {
cards[j][i].setNum(cards[j][i2].getNum());
// 把原来位置上的数字清除
cards[j][i2].setNum(0);
// 让图形继续遍历
i--;

// 有值。而且还同样
} else if (cards[j][i].equals(cards[j][i2])) {
// 合并,这里做了一个非常巧妙的写法，我们相加，事实上2048方块上的数字都是双倍的。所以我们仅仅要原数据*2就能够了
cards[j][i].setNum(cards[j][i].getNum() * 2);
// 把原来位置上的数字清除
cards[j][i2].setNum(0);

}
break;
}
}
}
}
}

// 下
private void isButtom() {
/**
* 这里的逻辑有三种情况 1.左边为空。直接左滑到最后一格 2.左边碰到的第一个数是相等的。就相加 3.左边碰到的第一个数是不相等的，靠在旁边
*/
for (int j = 0; j < 4; j++) {
for (int i = 3; i >= 0; i--) {
// 往左滑是一行一行去遍历的
for (int i2 = i - 1; i2 >= 0; i2--) {
// 假设说遍历到值
if (cards[j][i2].getNum() > 0) {
// 假设当前位置上为0,就放在这个位置上去
if (cards[j][i].getNum() <= 0) {
cards[j][i].setNum(cards[j][i2].getNum());
// 把原来位置上的数字清除
cards[j][i2].setNum(0);
// 让图形继续遍历
i++;

// 有值，而且还同样
} else if (cards[j][i].equals(cards[j][i2])) {
// 合并,这里做了一个非常巧妙的写法。我们相加，事实上2048方块上的数字都是双倍的，所以我们仅仅要原数据*2就能够了
cards[j][i].setNum(cards[j][i].getNum() * 2);
// 把原来位置上的数字清除
cards[j][i2].setNum(0);

}
break;
}
}
}
}
}

四个方法的逻辑都是大同小异的，只是逻辑性还是非常强的，大家能够适当的去研究一下然后我们多添加几个方块先来模拟下效果

八.计分

方块的逻辑几乎相同写完了，我们先来就在MainActivity里面来实现我们的Score计分

MainActivity

package com.lgl.game2048;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;

public class MainActivity extends Activity {

private TextView tv_score;
//外界能够訪问的实例
private static MainActivity mainActivity = null;
//积分器
private int score = 0;

public MainActivity() {
mainActivity = this;
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

tv_score = (TextView) findViewById(R.id.tv_score);

}
public static MainActivity getMainActivity() {
return mainActivity;
}
public static void setMainActivity(MainActivity mainActivity) {
MainActivity.mainActivity = mainActivity;
}

//清除分数
public void clearScore(){
score = 0;
showScore();
}
//分数
public void showScore(){
tv_score.setText("分数:"+score);
}

public void addScore(int s){
score += s;
showScore();
}
}

这是我们计分的过程。我们思考一下在什么时候计分呢？想想就知道在滑动的时候俩值相加的时候開始计分，所以我们在四个滑动方法有值的推断句中加入

//開始计分                                     MainActivity.getMainActivity().addScore(cards[j][i].getNum());

同一时候。我们在開始游戏的时候要清零，所以我们在startGame方法中要加入

//计分清零
MainActivity.getMainActivity().clearScore();

九.滑动后添加方块

我们默认进来是两个方块。可是滑动之后我们应该也要随机添加方块才干达到游戏的逻辑。你说是吧！

所以。仅仅要你滑动了。我们就要加入。一直到gameover结束为止。那我们依旧在那四个方向方法里写

private void isxx(){
// 加个推断能否够加入
boolean isAdd = false;
for(....){
for(....){
for(....){
if(....){
if(....){
....
// 能够加入
isAdd = true;
}else if(....){
....
// 能够加入
isAdd = true;
}
}
}
}
}
// 開始进行推断
if (isAdd) {
// 假设能够合并，我们加入随机数
addRandom();
}
}

好的。我们如今来执行一下

游戏如今大体上是OK的了

十.游戏结束

游戏有始有终，我们如今就来推断游戏结束，游戏结束有两个前提
1.16个格子都是满的
2.上下左右相邻的格子都不同样
这种话我们就能够写一个endGame方法。然后让他在每次添加方块的时候调用了

// 游戏结束
private void endGame() {
// 在每次加入新的方块的时候推断一下
// 是否结束？
boolean isEnd = true;
ALL: // 标签，让break跳出整个循环
for (int i = 0; i < 4; i++) {
for (int j = 0; j < 4; j++) {
// 等于0的话游戏没有结束,或者上下左右还是有同样的数
if (cards[j][i].getNum() == 0
// 左
|| (j > 0 && cards[j][i].equals(cards[j - 1][i]))
// 右
|| (j < 3) && cards[j][i].equals(cards[j + 1][i])
// 上
|| (i > 0 && cards[j][i].equals(cards[j][i - 1]))
// 下
|| (i < 3 && cards[j][i].equals(cards[j][i + 1]))) {
// 说明游戏没有结束
isEnd = false;
break ALL;

}
}
}
if (isEnd) {
// 当isEnd = true的时候游戏结束
new AlertDialog.Builder(getContext())
.setTitle("Sorry。游戏结束！

")
.setMessage("是否又一次開始？")
.setPositiveButton("是",
new DialogInterface.OnClickListener() {

@Override
public void onClick(DialogInterface dialog,
int which) {
// 又一次開始
startGame();
}
})
.setNegativeButton("否",
new DialogInterface.OnClickListener() {

@Override
public void onClick(DialogInterface dialog,
int which) {
}
}).show();
}
}

好的，如今我们能够来检測一下了

十一.优化之色块

我们的数字每一个数字代表一种颜色。这里我就简单的写点颜色，你们要是喜欢能够自己想改什么就改什么
在CardView中setnum方法里

switch (num) {
case 0:
tv_num.setBackgroundColor(0xffBDB76A);
break;
case 2:
tv_num.setBackgroundColor(0xffeee4da);
break;
case 4:
tv_num.setBackgroundColor(0xffede0c8);
break;
case 8:
tv_num.setBackgroundColor(0xfff2b179);
break;
case 16:
tv_num.setBackgroundColor(0xfff59563);
break;
case 32:
tv_num.setBackgroundColor(0xfff67c5f);
break;
case 64:
tv_num.setBackgroundColor(0xfff65e3b);
break;
case 128:
tv_num.setBackgroundColor(0xffedcf72);
break;
case 256:
tv_num.setBackgroundColor(0xffedcc61);
break;
case 512:
tv_num.setBackgroundColor(0xffedc850);
break;
case 1024:
tv_num.setBackgroundColor(0xffedc53f);
break;
case 2048:
tv_num.setBackgroundColor(0xffedc22e);
break;
default:
tv_num.setBackgroundColor(0xff3c3a32);
break;
}

我们执行下

Demo下载地址：http://download.csdn.net/detail/qq_26787115/9409068