微信小程序游戏demo：消灭黑暗势力；随机点路径

柿霖不是林 · 发表于 2017-1-9 19:42:06

点评：不多的游戏类demo

[size=0.83em]

123.gif (99.06 KB, 下载次数: 0)

[color=rgb(153, 153, 153) !important]3 天前上传

项目结构：

代码示例：
[AppleScript] [color=rgb(51, 102, 153) !important]纯文本查看 [color=rgb(51, 102, 153) !important]复制代码
//index.js
//获取应用实例
var points = require('../common/points')
var judgeWall = require('../common/judgeWall')
var calculateObs = require('../common/calculateObstacle')
var app = getApp()
Page({
  //  这里声明的是类的全局变量
  data: {
userInfo: {},
circleBlackList: [],          // 黑色圆点位置
circleList: [],             // 圆点数组
colorCircleFirst: '#FFDF2F',  // 圆点颜色1
colorCircleSecond: '#FE4D32', // 圆点颜色2
colorCircleBlack: '#000000',  // 圆点颜色黑色
isRunning: false,          // 是否正在进行
blackCircleIndex: 0,          // 黑色圆点
steps: 0,                   // 点击步数
  },
  //事件处理函数
  bindViewTap: function () {
wx.navigateTo({
   url: '../logs/logs'
})
  },
  // 黄色圆点点击方法
  tapCircle: function (event) {
console.log(event);
var circleID = event.target.id;
var tpCircleColorList = app.globalData.circleColorList;
var tpBlackCircleList = this.data.circleBlackList;
var colorStatus = tpCircleColorList[circleID];
var blackIndex = this.data.blackCircleIndex;

if (!colorStatus) {
   // 将点击的点选中
   tpCircleColorList[circleID] = true;
   app.globalData.circleColorList = tpCircleColorList;

   // 如果是墙则成功找到出口
   var judge = judgeWall.judgeIfWall(blackIndex, true);
   if (judge) {
      var tstep = this.data.steps;
      tstep = tstep + 1;
      this.setData({
      circleColorList: tpCircleColorList,
      steps: tstep,
      });
      return;
   }

   // 判断逃脱路径
   var path = calculateObs.calculatePath(blackIndex);
   // 如果已经没路走了则成功围困
   if (path.length == 0) {
      var tstep = this.data.steps;
      tstep = tstep + 1;
      this.setData({
      circleColorList: tpCircleColorList,
      steps: tstep,
      });
      return
   }
   console.log(path);
   // 有路的话则将  原来黑点还原继续逃出路径的下一点
   tpBlackCircleList[blackIndex] = false;
   blackIndex = path[0];
   tpBlackCircleList[blackIndex] = true;
   // 操作步数
   var tstep = this.data.steps;
   tstep = tstep + 1;

   // 这里是暴露对wxml的数据接口
   this.setData({
      circleColorList: tpCircleColorList,
      circleBlackList: tpBlackCircleList,
      blackCircleIndex: blackIndex,
      steps: tstep,
   });
}
  },

  onLoad: function () {
console.log('onLoad');
var that = this;
var leftCircle = 7.5;
var topCircle = 7.5;
var circleList = [];
var circleMap = {};
var circleColorList = [];
var circleBlackList = [];
var circleBlackIndexList = [];
//调用应用实例的方法获取全局数据
app.getUserInfo(function (userInfo) {
   //更新数据
   that.setData({
      cuserInfo: userInfo
   })
})
// 计算每个圆点的top和left
for (var i = 0; i < 11; i++) {
   for (var j = 0; j < 11; j++) {
      if ((i + 1) % 2 == 0) {
      if (j != 0) {
         leftCircle = (50 + 8) * j + 36;
      } else {
         leftCircle = 36;
      }
      } else {
      leftCircle = 50 * j + 8 * (j + 1);
      }
      topCircle = 50 * i + 8 * (i + 1);
      circleColorList.push(false);
      circleBlackList.push(false);
      circleList.push({ topCircle: topCircle, leftCircle: leftCircle });
   }
}
// 注入黑色圆点初始位置随机点位
circleBlackIndexList = points.blackPoints;
// 生成随机整数
var randomIndex = parseInt(24 * Math.random());
var randomCircleIndex = 60
// circleBlackIndexList[randomIndex];
circleBlackList[randomCircleIndex] = true;

// 构造初始二叉树

// 为全局变量赋值
app.globalData.circleColorList = circleColorList;
that.setData({
   circleColorList: circleColorList,
   circleList: circleList,
   circleBlackList: circleBlackList,
   blackCircleIndex: randomCircleIndex,
})
  }
})

[AppleScript] [color=rgb(51, 102, 153) !important]纯文本查看 [color=rgb(51, 102, 153) !important]复制代码
/*
*二叉树的节点对象
*/
function Node() {
this.content = '';          //节点的文本
this.leftChild = null; //节点的左孩子引用
this.rightChild = null; //节点右孩子引用
}
// 在构建好二叉树节点之后紧接着用递归来构建二叉树
var charecters = ['A', 'B', 'C', 'D', 'E', 'F', 'G',
'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R',
  'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];

function buildTree(node, i) {
var leftIndex = 2*i+1,                         //左孩子节点的索引
      rightIndex = 2*i+2;                      //右孩子节点的索引
if(leftIndex < charecters.length) {          //判断索引的长度是否超过了charecters数组的大小
      var childNode = new Node();                //创建一个新的节点对象
      childNode.text = charecters[leftIndex];    //给节点赋值
      node.leftChild = childNode;                //给当前节点node加入左孩子节点
      buildTree(childNode, leftIndex);          //递归创建左孩子
}
if(rightIndex < charecters.length) {          //下面注释参照上面的构建左孩子的节点
      var childNode = new Node();
      childNode.text = charecters[rightIndex];
      node.rightChild = childNode;
      buildTree(childNode, rightIndex);
}
}
//下面构造二叉树
var node = new Node();
node.text = charecters[0];
buildTree(node, 0); //索引i是从0开始构建

游客，如果您要查看本帖隐藏内容请回复

sniperz · 发表于 2017-7-12 10:17:06

我觉得不错这个

Ywenli · 发表于 2017-8-16 08:57:01

感谢楼主分享

南方刺猬的 · 发表于 2018-11-1 16:04:57

不错不错呀，非常实用

zccc · 发表于 2020-3-16 20:56:26

11111111111111

有量求合作 · 发表于 2020-3-17 17:55:30

专注于与个人游戏开发者合作，有产品的朋友联系微信号jim20180688，详聊

jerry369 · 发表于 2020-3-22 17:57:29

专注于与个人游戏开发者合作，有产品的朋友联系微信号jim20180688，详聊

		自动登录	找回密码
密码			立即注册

微信小程序游戏demo：消灭黑暗势力；随机点路径

本帖子中包含更多资源