autojs连连看脚本可视化

牙叔教程 简单易懂

我用autojs写了一个连连看app, 然后我又写了一个连连看脚本,

效果展示

下面来看看连连看脚本的制作思路

采集画面原始信息

1. 游戏区域的左上角和右下角坐标
2. 游戏的行列的数量
3. 格子的原始图片

调整数据结构

我把小小的格子定义为一个Cell类, 然后所有属性都挂到他上面, 方便调用

function Cell(row, column) {
  this.row = row;
  this.column = column;
  this.state = Cell.state.NORMAL;
  this.width = 0;
  this.height = 0;
  this.centerX = 0;
  this.centerY = 0;
  this.left = 0;
  this.top = 0;
  this.right = 0;
  this.bottom = 0;
  this.canvas = null;
  this.number = null;
  this.originalImg = null;
  this.img = null;
  this.paint = paint;
}
复制代码

判断格子是否连通

这个是该教程的重点, 网上已经有很多的方法了, 大家可以博采众长, 然后写出自己的脚本.

下面来看看这个脚本是怎么判断的

连通类别我分为三种

图形化展示三种连通分类

第一种: 两个格子紧挨着

第二种: 一个格子周围的空格和另一个格子周围的空格有交集

第三种: 一个格子周围的空格集合A,

另一个格子周围的空格集合B,

集合B周围的空格集合C,

集合A和集合C有交集

几个小问题

1 怎么判断格子是不是空的

Celll有一个属性originalImg, 保存的是游戏刚开始格子里面的图片,

截图以后, 拿当前的图片和原始图片做对比, 不一样的话, 就是格子就是空的

2 怎么判断两个格子图片是不是一样的

我用的是多点比色, 在一张图中取多个点的颜色数据, 然后去另一张图中找;

能找到符合条件的多个点, 就说明两张图一样.

function isSameTwoImg(img1, img2) {
  // 在图中间找固定数量的点, 然后去大图里面多点找色
  let colorDataList = getColorDataList(img1);
  // [图片与颜色 - Images](https://pro.autojs.org/docs/#/zh-cn/images?id=imagesfindmulticolorsimg-firstcolor-colors-options)
  let firstColor = colorDataList[0][2];
  let colors = colorDataList.slice(1);
  try {
    let p = images.findMultiColors(img2, firstColor, colors);
    return p;
  } catch (error) {
    log("error", error);
  }
}
function getColorDataList(img) {
  let count = 25;
  let row = Math.sqrt(count);
  let column = Math.sqrt(count);
  let padding = 10;
  let width = img.getWidth();
  let height = img.getHeight();
  let contentWidth = width - padding * 2;
  let contentHeight = height - padding * 2;
  let unitWidth = contentWidth / (row - 1);
  let unitHeight = contentHeight / (column - 1);
  let colorDataList = [];
  let rowIndex = 0;
  let columnIndex = 0;
  let firstPoint;
  for (let i = 0; i < count; i++) {
    let x = padding + unitWidth * rowIndex;
    let y = padding + unitHeight * columnIndex;
    if (i === 0) {
      firstPoint = {
        x: x,
        y: y,
      };
    }
    let color = images.pixel(img, x, y);
    let relativeX = x - firstPoint.x;
    let relativeY = y - firstPoint.y;
    colorDataList.push([relativeX, relativeY, color]);
    rowIndex++;
    if (rowIndex === row) {
      rowIndex = 0;
      columnIndex++;
    }
  }
  return colorDataList;
}
复制代码

3 调试脚本怎样可视化

调试的时候, 我会增加一个悬浮窗, 在符合条件的格子上方涂上颜色

Cell.prototype.renderDebug = function (color) {
  color = color || "#33f44336";
  paint.setColor(colors.parseColor(color));
  paint.setStrokeWidth(1);
  // paint.setStyle(Paint.Style.STROKE);
  paint.setStyle(Paint.Style.FILL);
  paint.setXfermode(null);
  let left = this.left;
  let top = this.top;
  let right = this.right;
  let bottom = this.bottom;
  let rect = new RectF(left, top, right, bottom);
  this.canvas.drawRect(rect, paint);
  // this.canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
};
复制代码

function renderTwoCell(emptyCell, currentCell, cellList) {
  let emptyCellRow = emptyCell.row;
  let emptyCellColumn = emptyCell.column;
  let currentCellRow = currentCell.row;
  let currentCellColumn = currentCell.column;
  if (emptyCellRow === currentCellRow) {
    if (emptyCellColumn < currentCellColumn) {
      let len = currentCellColumn - emptyCellColumn;
      for (let i = 0; i < len; i++) {
        let cell = cellList[emptyCellRow][emptyCellColumn + i];
        cell.renderDebug();
      }
    } else {
      let len = emptyCellColumn - currentCellColumn;
      for (let i = 0; i < len; i++) {
        let cell = cellList[emptyCellRow][emptyCellColumn - i];
        cell.renderDebug();
      }
    }
  } else if (emptyCellColumn === currentCellColumn) {
    if (emptyCellRow < currentCellRow) {
      let len = currentCellRow - emptyCellRow;
      for (let i = 0; i < len; i++) {
        let cell = cellList[emptyCellRow + i][emptyCellColumn];
        cell.renderDebug();
      }
    } else {
      let len = emptyCellRow - currentCellRow;
      for (let i = 0; i < len; i++) {
        let cell = cellList[emptyCellRow - i][emptyCellColumn];
        cell.renderDebug();
      }
    }
  }
}
复制代码

也可以打印格子的状态

function printCellData(cellList) {
  let str = "";
  for (var i = 0; i < cellList.length; i++) {
    let cellRow = cellList[i];
    for (var j = 0; j < cellRow.length; j++) {
      let cell = cellRow[j];
      str += cell.isEmpty() ? "X" : "O";
    }
    str += "\n";
  }
}
复制代码

XOOOOXOX
XOOOOXOX
XOOOOXXX
XOOOOXXX
XOOOOOOX
XOOOOOOX
XXXXXXXX
复制代码

4 autojs8和9模块导出格式不一样

autojs8

module.exports = {
  viewImg: viewImg,
  isSameTwoImg: isSameTwoImg,
};
复制代码

autojs9

module.exports = {
  viewImg,
  isSameTwoImg,
};
复制代码

备注

如果你要使用脚本的话, 你要修改config.js里面的

left, top, right, bottom
复制代码

因为手机不一样, 游戏的显示区域就不一样

环境

手机: Mi 11 Pro

Android版本: 12

Autojs版本: 9.1.3

名人名言

思路是最重要的, 其他的百度, bing, stackoverflow, github, 安卓文档, autojs文档, 最后才是群里问问 --- 牙叔教程

声明

部分内容来自网络 本教程仅用于学习, 禁止用于其他用途

微信公众号 牙叔教程