Android实训案例（八）——单机五子棋游戏，自定义棋盘，线条，棋子，游戏逻辑，游戏状态存储，再来一局

Android实训案例（八）——单机五子棋游戏，自定义棋盘，线条，棋子，游戏逻辑，游戏状态存储，再来一局

阿法狗让围棋突然就被热议了，鸿洋大神也顺势出了篇五子棋单机游戏的视频，我看到了就像膜拜膜拜，就学习了一下，写篇博客梳理一下自己的思路，加深一下印象

一.棋盘

我们一看就知道，我们必须自定义View，这里我们定义一个GameView来做游戏主类，第一步，先测量，我们这里不难知道，五子棋他的棋盘是一个正方形，所以我们需要去测量

 /**
     * 测量
     *
     * @param widthMeasureSpec
     * @param heightMeasureSpec
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

        //获取高宽值
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        int widthMode = MeasureSpec.getMode(widthMeasureSpec);

        int hightSize = MeasureSpec.getSize(heightMeasureSpec);
        int hightMode = MeasureSpec.getMode(heightMeasureSpec);

        //拿到宽和高的最小值，也就是宽
        int width = Math.min(widthSize, heightMeasureSpec);

        //根据测量模式细节处理
        if (widthMode == MeasureSpec.UNSPECIFIED) {
            width = hightSize;
        } else if (hightMode == MeasureSpec.UNSPECIFIED) {
            width = widthSize;
        }

        //设置这样就是一个正方形了
        setMeasuredDimension(width, width);

    }

这里的逻辑还是十分简单的，我们拿到长和宽去比较一下，设置这个View的长宽Wie最小值，就是一个正方形了，所以我们的layout_main.xml是这样写的

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@drawable/main_bg"
    >

    <com.lgl.fiverow.GameView
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

这里我在构造方法中设置了一个半透明的红色背景，是在我们调试的时候可以更加清晰的看清楚GameView的大小，所以，运行的结果

二.线条

这个应该也算是棋盘的一部分吧，就是棋盘上的线条，我们应该怎么去画，首先，我们要去定义一些属性

    //线条数量
    private static final int MAX_LINE = 10;

    //线条的宽度
    private int mPanelWidth;

    //线条的高度
    private float mLineHeight;

然后，我们要去确定大小

/**
     * 测量大小
     *
     * @param w
     * @param h
     * @param oldw
     * @param oldh
     */
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);

        //拿到宽
        mPanelWidth = w;
        //分割
        mLineHeight = mPanelWidth * 1.0f / MAX_LINE;
    }

不要着急，这些都只是一些准备的工作，我们画线条是必须要在onDraw(0方法里的，但是前期我们要准备一只画笔，对吧，所以我们要初始化画笔

     /**
     * 初始化画笔
     */
    private void initPaint() {
        //设置颜色
        mPaint.setColor(0x88000000);
        //抗锯齿
        mPaint.setAntiAlias(true);
        //设置防抖动
        mPaint.setDither(true);
        //设置Style
        mPaint.setStyle(Paint.Style.STROKE);
    }

现在我们可以去绘制了，我们在OnDraw(0方法里写一个drawLine方法来专门绘制线条

 /**
     * 绘制棋盘的方法
     *
     * @param canvas
     */
    private void drawLine(Canvas canvas) {
        //获取高宽
        int w = mPanelWidth;
        float lineHeight = mLineHeight;

        //遍历，绘制线条
        for (int i = 0; i < MAX_LINE; i++) {
            //横坐标
            int startX = (int) (lineHeight / 2);
            int endX = (int) (w - lineHeight / 2);

            //纵坐标
            int y = (int) ((0.5 + i) * lineHeight);

            //绘制横
            canvas.drawLine(startX, y, endX, y, mPaint);
            //绘制纵
            canvas.drawLine(y, startX, y, endX, mPaint);
        }

    }

我们运行一下

好的，这里，注意一下，我在activity_main.xml中定义了一个

android:gravity="center"

属性，所以让他居中，同样的，我们在initPaint中加上点代码让我们看的更加直观一点

//设置颜色
mPaint.setColor(Color.BLACK);
//设置线条宽度
mPaint.setStrokeWidth(3);

同样的，我们把构造法里的设置背景的测试代码注释掉

//测试代码
//setBackgroundColor(0x44ff0000);

这样，我们运行一下

得，我们现在有模有样了

三.棋子

棋子我们事先准备好了两张图片，但是这里我们要考虑他的大小的问题了，我们的思路是让他是行高的四分之三大小，所以先声明

 //黑棋子
 private Bitmap mBlack;

 //白棋子
 private Bitmap mWhite;

//比例，棋子的大小是高的四分之三
 private float rowSize = 3 * 1.0f / 4;

然后我们定义一个方法区初始化Bitmap

     /**
     * 初始化棋子
     */
    private void initBitmap() {
        //拿到图片资源
        mBlack = BitmapFactory.decodeResource(getResources(), R.drawable.stone_black);
        mWhite = BitmapFactory.decodeResource(getResources(), R.drawable.stone_white);
    }

拿到资源之后我们就可以设置大小了，我们在onSizeChanged()里面设置

 //棋子宽度
 int mWhiteWidth = (int) (mLineHeight * rowSize);

 //修改棋子大小
 mWhite = Bitmap.createScaledBitmap(mWhite, mWhiteWidth, mWhiteWidth, false);
 mBlack = Bitmap.createScaledBitmap(mBlack, mWhiteWidth, mWhiteWidth, false);

不过棋子可没我们想象的那么简单，我们要点击一下再去绘制一个棋子，这样的思路该怎么去实现呢？我们实现它的点击事件，这里先定义几个变量

    //存储用户点击的坐标
    private List<Point> mWhiteArray = new ArrayList<>();
    private List<Point> mBlackArray = new ArrayList<>();

    //标记，是执黑子还是白子 ,白棋先手
    private boolean mIsWhite = true;

这样才和触摸事件相得映彰

 /**
     * 触摸事件
     *
     * @param event
     * @return
     */
    @Override
    public boolean onTouchEvent(MotionEvent event) {

        switch (event.getAction()) {
            //按下事件
            case MotionEvent.ACTION_UP:

                int x = (int) event.getX();
                int y = (int) event.getY();

                //封装成一个Point
                Point p = getValidPoint(x, y);

                //判断当前这个点是否有棋子了
                if(mWhiteArray.contains(p) || mBlackArray.contains(p)){

                    //点击不生效
                    return false;
                }

                //判断如果是白子就存白棋集合，反之则黑棋集合
                if (mIsWhite) {
                    mWhiteArray.add(p);
                } else {
                    mBlackArray.add(p);
                }

                //刷新
                invalidate();

                //改变值
                mIsWhite = !mIsWhite;

                break;
        }

        return true;
    }

这样，有几点是要说明一下的，首先我们new Point的时候为了避免重复绘制我们是实现了一个方法

/**
     * 不能重复点击
     *
     * @param x
     * @param y
     * @return
     */
    private Point getValidPoint(int x, int y) {

        return new Point((int) (x / mLineHeight), (int) (y / mLineHeight));
    }

紧接着我们就判断，要是重复点击，返回false,而且我们在action选择也是选择了ACTION_UP，为什么？为什么不是ACTION_DOWN？因为这个毕竟是一个View，父View会拦截（某些场景），所以我们选在UP上才是合情合理的

好的，当我们点击之后就要绘制棋子了，这里我们也写一个方法

 /**
     * 绘制棋子的方法
     *
     * @param canvas
     */
    private void drawPieces(Canvas canvas) {
        for (int i = 0; i < mWhiteArray.size(); i++) {
            //获取白棋子的坐标
            Point whitePoint = mWhiteArray.get(i);
            canvas.drawBitmap(mBlack, (whitePoint.x + (1 - rowSize) / 2) * mLineHeight, (whitePoint.y + (1 - rowSize) / 2) * mLineHeight, null);
        }

        for (int i = 0; i < mBlackArray.size(); i++) {
            //获取黑棋子的坐标
            Point blackPoint = mBlackArray.get(i);
            canvas.drawBitmap(mWhite, (blackPoint.x + (1 - rowSize) / 2) * mLineHeight, (blackPoint.y + (1 - rowSize) / 2) * mLineHeight, null);
        }
    }

OK，我们实际运行一下

四.游戏逻辑

现在什么都有了，基本上都可用玩了，但是还少了重要的一点就是游戏结束，你到了五颗也需要判断是否胜利呀，对吧，我们写一个方法，在每次绘制完成之后就去判断是否有赢家

  /**
     * 判断是否胜利
     */
    private void checkWin() {

        //判断白棋是否有五个相同的棋子相连
        boolean mWhiteWin = checkFiveLine(mWhiteArray);
        //判断黑棋是否有五个相同的棋子相连
        boolean mBlackWin = checkFiveLine(mBlackArray);

        //只要有一个胜利，游戏就结束
        if (mWhiteWin || mBlackWin) {

            mIsGameOver = true;

            mIsWhiteWin = mWhiteWin;

            Toast.makeText(getContext(), mIsWhiteWin ? "白棋胜利" : "黑棋胜利", Toast.LENGTH_SHORT).show();

        }
    }

好的，我们重点逻辑就在checkFiveLine这个方法上了，这里，我们所知道的胜利有四种情况

我们先定义一个常量

    //胜利棋子数量
    private static final int MAX_COUNT_IN_LINE = 5;

OK，接下来我们可以实现以下胜利的逻辑了

 /**
     * //判断棋子是否有五个相同的棋子相连
     *
     * @param points
     * @return
     */
    private boolean checkFiveLine(List<Point> points) {

        //遍历棋子
        for (Point p : points) {
            //拿到棋盘上的位置
            int x = p.x;
            int y = p.y;

            /**
             * 四种情况胜利，横，竖，左斜，右斜
             */

            //横
            boolean win = checkHorizontal(x, y, points);
            if (win) return true;
            //竖
            win = checkVertical(x, y, points);
            if (win) return true;
            //左斜
            win = checkLeft(x, y, points);
            if (win) return true;
            //右斜
            win = checkRight(x, y, points);
            if (win) return true;

        }
        return false;
    }

我们不管哪个方向只要返回true就返回true，然后弹Toast，这里，四个方向的逻辑

  • 横
 /**
     * 判断横向的棋子
     *
     * @param x
     * @param y
     * @param points
     */
    private boolean checkHorizontal(int x, int y, List<Point> points) {

        //棋子标记，记录是否有五个  =1是因为自身是一个
        int count = 1;

        //左
        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x - i, y))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        //右
        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x + i, y))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        return false;
    }
  • 横
 /**
     * 判断纵向的棋子
     *
     * @param x
     * @param y
     * @param points
     */
    private boolean checkVertical(int x, int y, List<Point> points) {

        //棋子标记，记录是否有五个  =1是因为自身是一个
        int count = 1;

        //上
        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x, y - i))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        //下
        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x, y + i))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        return false;
    }
  • 左斜
 /**
     * 判断左斜向的棋子
     *
     * @param x
     * @param y
     * @param points
     */
    private boolean checkLeft(int x, int y, List<Point> points) {

        //棋子标记，记录是否有五个  =1是因为自身是一个
        int count = 1;

        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x - i, y + i))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x + i, y - i))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        return false;
    }
  • 右斜
 /**
     * 判断右斜向的棋子
     *
     * @param x
     * @param y
     * @param points
     */
    private boolean checkRight(int x, int y, List<Point> points) {

        //棋子标记，记录是否有五个  =1是因为自身是一个
        int count = 1;

        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x - i, y - i))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        for (int i = 1; i < MAX_COUNT_IN_LINE; i++) {
            //如果有
            if (points.contains(new Point(x + i, y + i))) {
                count++;
            } else {
                break;
            }
        }

        //有五个就为true
        if (count == MAX_COUNT_IN_LINE) {

            return true;
        }

        return false;
    }

这样，我们运行一下

嘿嘿，好玩吧！

五.游戏状态存储

这个就是当我们游戏挂后台之后，再回来游戏就没了，我们应该存储他的状态，让他每一次进入的时候要是上一句没有下完接着下，那我们该怎么去实现呢？和Activity一样，我们View也有存储状态的方法

  /**
     * 存储状态
     *
     * @return
     */
    @Override
    protected Parcelable onSaveInstanceState() {

        Bundle bundle = new Bundle();
        bundle.putParcelable(INSTANCE, super.onSaveInstanceState());
        bundle.putBoolean(INSTANCE_GAMEOVER, mIsGameOver);
        bundle.putParcelableArrayList(INSTANCE_WHITE_ARRAY, mWhiteArray);
        bundle.putParcelableArrayList(INSTANCE_BLACK_ARRAY, mBlackArray);
        return bundle;
    }

    /**
     * 重新运行
     *
     * @param state
     */
    @Override
    protected void onRestoreInstanceState(Parcelable state) {

        //取值
        if (state instanceof Bundle) {
            Bundle bundle = (Bundle) state;
            mIsGameOver = bundle.getBoolean(INSTANCE_GAMEOVER);
            mWhiteArray = bundle.getParcelableArrayList(INSTANCE_WHITE_ARRAY);
            mBlackArray = bundle.getParcelableArrayList(INSTANCE_BLACK_ARRAY);

            //调用
            super.onRestoreInstanceState(bundle.getParcelable(INSTANCE));
            return;
        }
        super.onRestoreInstanceState(state);
    }

这样就可以了，但是，有一点要知道，不要忘记在布局文件上给控件加上ID，不然状态不会存储哦

 <com.lgl.fiverow.GameView
        android:id="@+id/mGameView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

六.再来一局

既然我们的游戏逻辑差不多了，那我们应该考虑一下当你胜利的时候，你是不是应该再来一局，所以我们还要实现这个逻辑，这个很简单

   /**
     * 再来一局
     */
    public void RestartGame() {
        mWhiteArray.clear();
        mBlackArray.clear();
        mIsGameOver = false;
        mIsWhiteWin = false;
        invalidate();
    }

这样，我们就可以直接调用了，我们来看看MainActivity

package com.lgl.fiverow;

import android.support.design.widget.FloatingActionButton;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;

/**
 * 五子棋游戏
 */
public class MainActivity extends AppCompatActivity {

    //重来按钮
    private FloatingActionButton fab;
    //游戏
    private GameView game;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        game = (GameView) findViewById(R.id.mGameView);
        fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                game.RestartGame();
            }
        });
    }
}

OK，我们最终运行一下

OK,到这里，就算开发完成了

Demo下载：http://download.csdn.net/detail/qq_26787115/9521011

我的群：555974449欢迎你加入！

时间： 2024-10-23 16:49:11

Android实训案例（八）——单机五子棋游戏，自定义棋盘，线条，棋子，游戏逻辑，游戏状态存储，再来一局的相关文章

Android实训案例（六）——四大组件之一BroadcastReceiver的基本使用，拨号，短信，SD卡，开机，应用安装卸载监听

Android实训案例(六)--四大组件之一BroadcastReceiver的基本使用,拨号,短信,SD卡,开机,应用安装卸载监听 Android中四大组件的使用时重中之重,我这个阶段也不奢望能把他所有的原理搞懂,但是最起码的,我要把他的各种使用方法了如指掌才行 BroadcastReceiver 接收系统的广播,比如电话,短信之类的 1.IP拨号器 我们在拨打电话的时候,我们系统也会事先发送一个广播,所以我们可以用广播接收者来接收到这个广播拨打电话的时候在电话号码前面加上一些优惠的长途短号,

【CC2530入门教程-增强版】基础技能综合实训案例（基础版）-终端源码

[CC2530入门教程-增强版]基础技能综合实训案例(基础版)-终端源码 广东职业技术学院 欧浩源 一.关于硬件电路 关于这个综合实训案例,具体需求详见<[CC2530入门教程-增强版]基础技能综合实训案例(基础版)-题目需求>. 我自己实在"全国职业院校技能大赛--物联网技术应用赛项"的Zigbee模块上实现的.该模块的电路应该和TI公司官方评估板的推荐电路差不多,我想现在市面上很多开发板也是参考这样的电路设计,只要您使用的开发板上有LED灯.按键输入.串口输出和一路A/

澄迈NIIT Android 实训 后5天学习android的基础

使用集成的 android-adt-bundle Android 项目目录说明 常用ui属性 用来选颜色不错 做ui的需要把l m h x几种规格的图片 控件学习参考资料主要看,比较详细 http://www.cnblogs.com/menlsh/tag/Android/ 后面资料文档老师没有上传QAQ  很尴尬

VRRP实训案例配置

案例(一)任务要求:VRRP单备份组配置举例? ? Host A 需要访问 Internet 上的 Host B,Host A 的缺省网关为 10.1.1.111/24:? ? 当 Switch A 正常工作时,Host A 发送给 Host B 的报文通过 Switch A 转发:当 Switch A 出现故障时,Host A 发送给 Host B 的报文通过 Switch B 转发.任务实施:1.配置Switch A配置VLAN2 ,创建备份组1,并配置备份组1的虚拟IP地址为10.1.1.

澄迈NIIT Android 实训 前3天复习java的基础

属于查漏补缺 Java源文件经过编译生成一个class文件/字节码文件,帮你实现真正的跨平台.一个class编译后生成一个class文件.然后通过JVM(java虚拟机)解释执行. java的8个基本数据类型: 四个整数类型: byte(1 字节数不同且范围不同2^7~2^7), short(2), int(4), long(8) 两个浮点类型:float(4), double(8) 布尔类型:boolean(1) 字符类型:char(2) Java规范 *一个java文件里可定义多个类,但是只

MSTP实训案例配置

任务要求:MSTP配置任务实施:一.配置 VLAN 和端口请按照图1-12在Device A和Device B上分别创建VLAN 10.20和30,在Device C上创建VLAN 10.20 和 40,在Device D上创建VLAN 20.30 和 40:将各设备的各端口配置为Trunk端口并允许相应的VLAN通过,具体配置:1.Device A2.Device B3.Device C4.Device D二.配置Device A1.配置 MST 域的域名为 example,将 VLAN 10

OSPF实训案例配置

组网需求1.所有的交换机都运行 OSPF,整个自治系统划分为 3 个区域.2.其中 Switch A 和 Switch B 作为 ABR 来转发区域之间的路由.3.在 Switch C 上配置为 ASBR 引入外部路由(静态路由),且路由信息可正确的在 AS 内传播.一.OSPF(一)任务实施:1.配置各接口的IP地址.Switch ASwitch BSwitch CSwitch D2.配置OSPF基本配置.Switch ASwitch BSwitch CSwitch D3.验证配置1).查看S

OSPF实训案例配置（二）

任务要求:配置OSPF发布聚合路由 1.Switch A 和 Switch B 位于 AS 200 内,AS 200 内使用 OSPF 作为 IGP 协议.2.Switch C.Switch D 和 Switch E 位于 AS 100 内,AS 100 内使用 OSPF 作为 IGP 协议.3. Switch B 和 Switch C 之间建立 EBGP 连接,配置 BGP 引入 OSPF 和直连路由,配置 OSPF进程引入 BGP 路由.4. 为了减小 Switch A 的路由表规模,在 S

《JAVA程序设计》实训第一天——《猜猜看》游戏

课程实训是做一个猜猜看的小游戏.对于对代码不熟悉不了解的我来说的确挺难的.但是我还是会努力的. import java.awt.EventQueue; import javax.swing.JFrame; import javax.swing.JPanel; import javax.swing.border.EmptyBorder; import javax.swing.JButton; import javax.swing.JTextField; import javax.swing.JLa