微信小程序五子棋游戏的悔棋实现方法【附demo源码下载】

本文实例讲述了微信小程序五子棋游戏的悔棋实现方法。分享给大家供大家参考，具体如下：

DEMO下载

五子棋悔棋DEMO

效果图

分析

悔棋功能需要的操作：

1. 判断当前持棋人；
2. 清空棋盘；
3. 将当前持棋人的棋子数组的最后一个棋子还原到全局坐标数组的位置；
4. 删除当前持棋人的棋子数组的该坐标。

js

this.page.changeUndo = function(e){
   if (self.START_GAME){
    var lastM = self.myPoint.length - 1;
    var LastA = self.AIPoint.length - 1;
    self.drawChessboard();
    if (self.boolAI && !self.boolMy && lastM >= 0){
     self.ABSCISSA_ARRAY[self.myPoint[lastM].pointY].push(self.myPoint[lastM]);
     self.myPoint.splice(lastM, 1);
    } else if (!self.boolAI && self.boolMy && LastA >= 0){
     self.ABSCISSA_ARRAY[self.AIPoint[LastA].pointY].push(self.AIPoint[LastA]);
     self.AIPoint.splice(LastA, 1);
    }
    self.drawAll();
   }
  }

注意

1. 判断游戏是否开始，如果没开始，就还没落子，不能悔棋；
2. 判断持棋人，对其数组操作；
3. 同时判断持棋人数组坐标个数，如果没有，则未落子；
4. 重点是重绘棋盘，导致棋盘有一点闪动，未找到原因，哪位大神知道，帮忙解决一下

希望本文所述对大家微信小程序开发有所帮助。

赞 (0)

相关推荐

  • 微信小程序五子棋游戏AI实现方法【附demo源码下载】

    微信小程序五子棋游戏AI实现方法【附demo源码下载】

    本文实例讲述了微信小程序五子棋游戏AI实现方法.分享给大家供大家参考,具体如下: DEMO下载 五子棋AI篇DEMO 效果图 原理 1. 将棋盘中能够胜利的五子连珠方法遍历一个数组: 2. 当AI持棋时,遍历棋盘中所有棋子的空位: 3. 如果用户落子该位置,给用户该位置的五连珠方式进行加分:1连10分,2连20分,3连40分,4连80分: 4. 如果AI落子该位置,给AI该位置的五连珠方式进行加分:1连15分,2连25分,3连45分,4连85分: 5. 最后对该位置的分值进行比较,取最大分值位置

  • JS+canvas实现的五子棋游戏【人机大战版】

    JS+canvas实现的五子棋游戏【人机大战版】

    本文实例讲述了JS+canvas实现的五子棋游戏.分享给大家供大家参考,具体如下: 运行效果图: html代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>五子棋</title> <link rel="stylesheet" type="text/css" href="css

  • 纯JS实现五子棋游戏兼容各浏览器(附源码)

    纯JS实现五子棋游戏兼容各浏览器(附源码)

    纯JS五子棋(各浏览器兼容) 效果图:  代码下载 HTML代码 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html;"> <title>五子棋</title> <link rel="stylesheet" type="text/

  • 微信小程序—微信跳一跳,Android游戏助手(外挂)使用教程详解

    微信小程序—微信跳一跳,Android游戏助手(外挂)使用教程详解

    作为一名有着丰富实战经验的Android开发人员,作为一个有着一定基础和实战的逆向新司机,第一次面对github上的这个项目自己也是懵的,即使看完了README,也还是不知道从何下手.在此之前玩游戏从未使用过游戏助手之类的.那么我在想,作为小半个专业选手尚且这样,广大小白又能比我好到哪里去呢? 以前我也曾经是个单纯的好骚年啊! 后来经过仔细阅读README,加上摸索,和查看源码,才慢慢走上正途:下面记录一下,以备你查看: 成果 图片说明:本人排行第二,记得我自己才跳了昨天一百七十多分,大多数都是

  • 微信小程序版翻牌小游戏

    本文实例为大家分享了微信小程序翻牌游戏的具体代码,供大家参考,具体内容如下 一.新建一个quick start项目看看结构 在微信开发工具点击添加项目,选择 无appid,勾上"在当前目录中创建quick start 项目". 可以看到一共有两个目录 pages和utils,和根目录下的3个app文件.pages存放的是小程序的页面,每个也面都有自己独立的文件夹. 一个页面由4文件构成,js文件是程序逻辑:wxss是微信定义的样式文件,语法跟css一样,支持的样式要少一些:wxml文件

  • 微信小程序实现的贪吃蛇游戏【附源码下载】

    本文实例讲述了微信小程序实现的贪吃蛇游戏.分享给大家供大家参考,具体如下: 先来看看运行效果: 具体代码如下: 界面布局 pages/snake/snake/snake.wxml: <!--snake.wxml--> <view class="control" bindtouchstart="tapStart" bindtouchmove="tapMove" bindtouchend="tapEnd">

  • H5+C3+JS实现五子棋游戏（AI篇）

    H5+C3+JS实现五子棋游戏（AI篇）

    本文实例为大家分享了H5+C3+JS实现五子棋游戏的具体代码,供大家参考,具体内容如下 新增全局变量 <script> //所有赢法总和 var count = 0; //容纳所有赢法的三维数组 var allWin = []; for(var i =0; i <15; i++){ allWin[i] = []; for(var j=0; j <15; j++){ allWin[i][j] = []; } } //横线赢法 for(var i =0; i <15; i++){

  • Javascript和HTML5利用canvas构建Web五子棋游戏实现算法

    Javascript和HTML5利用canvas构建Web五子棋游戏实现算法

    这只是一个简单的JAVAscript和HTML5小程序,没有实现人机对战. 五子棋棋盘落子点对应的二维数组.数组的元素对应落子点.比如数组元素值为0表示该元素对应的落子点没有棋子,数组元素值为1表示该元素对应的落子点有白棋子,数组元素值为2表示该元素对应的落子点有黑棋子: 判断五子棋赢棋的算法是通过对五子棋棋盘落子点对应的二维数组的操作来实现的. 判断五子棋赢棋算法 下边的函数可以实现判断五子棋赢棋的算法,也可以按照教材中相应的算法实现. 其中函数的参数xx.yy为数组下标,chess数组实现五

  • 微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧

    前言 小程序跳一跳最近很火,之前爆出微信游戏小程序漏洞,网上也不乏大神.这里就用一大神的python脚本来刷下高分. 跳一跳python脚本传送门 配置过程 注: 电脑环境未配置python环境,请自行谷歌或者百度配置,这里不再做叙述. 1. 将上述传送门整个项目拷贝到本地(用git命令,或者直接压缩包下载,这里大家随意).比如我这里下载压缩包,解压我电脑以下的目录. 2. 楼主用的是 ios , 操作起来比较繁琐,也懒得找测试要 Android 测试机,所有就下了模拟器测试,首推雷电模拟器,安

  • H5+C3+JS实现双人对战五子棋游戏（UI篇）

    H5+C3+JS实现双人对战五子棋游戏（UI篇）

    本篇文章实现的是双人对战模式,主要是实现除人机AI算法和判断输赢之外的其他功能,下一篇将会发布AI 框架搭建 <!Doctype html> <html> <head> <!-- 百度爬虫优化 --> <meta http-equiv="author" content="成兮,缘分五月" /> <meta http-equiv="Keywords" cotent="五子棋

  • 微信小程序五子棋游戏的棋盘，重置，对弈实现方法【附demo源码下载】

    微信小程序五子棋游戏的棋盘，重置，对弈实现方法【附demo源码下载】

    本文实例讲述了微信小程序五子棋游戏的棋盘,重置,对弈实现方法.分享给大家供大家参考,具体如下: DEMO下载 五子棋对弈.悔棋DEMO 效果图 分析 1. 采用微信小程序的canvas制作五子棋: 2. 确定棋盘大小及格数: 3. 绘制棋盘--通过棋盘宽高和格数计算间距,同时保存坐标点: 4. 黑方和白方下子--定义一个布尔变量代表各自的身份: 5. 重置棋盘--重新开始: 6. 通过判断当前棋手,悔棋时进行改变. 绘制棋盘 drawLine(arr){ arr.forEach(current

随机推荐