牙叔教程 簡單易懂

我用autojs寫了一個連連看app, 然后我又寫了一個連連看腳本,

效果展示

效果.gif

下面來看看連連看腳本的制作思路

01.png

采集畫面原始信息

1. 游戲區(qū)域的左上角和右下角坐標
2. 游戲的行列的數(shù)量
3. 格子的原始圖片

調(diào)整數(shù)據(jù)結構

我把小小的格子定義為一個Cell類, 然后所有屬性都掛到他上面, 方便調(diào)用

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;
}

判斷格子是否連通

這個是該教程的重點, 網(wǎng)上已經(jīng)有很多的方法了, 大家可以博采眾長, 然后寫出自己的腳本.

下面來看看這個腳本是怎么判斷的

連通類別我分為三種

03.png

圖形化展示三種連通分類

第一種: 兩個格子緊挨著

04.jpg

第二種: 一個格子周圍的空格和另一個格子周圍的空格有交集

05.jpg

第三種:
一個格子周圍的空格集合A,

另一個格子周圍的空格集合B,

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

集合A和集合C有交集

06.jpg

幾個小問題

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

Celll有一個屬性originalImg, 保存的是游戲剛開始格子里面的圖片,

截圖以后, 拿當前的圖片和原始圖片做對比, 不一樣的話, 就是格子就是空的

2 怎么判斷兩個格子圖片是不是一樣的

我用的是多點比色, 在一張圖中取多個點的顏色數(shù)據(jù), 然后去另一張圖中找;

能找到符合條件的多個點, 就說明兩張圖一樣.

function isSameTwoImg(img1, img2) {
  // 在圖中間找固定數(shù)量的點, 然后去大圖里面多點找色
  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 調(diào)試腳本怎樣可視化

調(diào)試的時候, 我會增加一個懸浮窗, 在符合條件的格子上方涂上顏色

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();
      }
    }
  }
}

也可以打印格子的狀態(tài)

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

因為手機不一樣, 游戲的顯示區(qū)域就不一樣

環(huán)境

手機: Mi 11 Pro

Android版本: 12

Autojs版本: 9.1.3

名人名言

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

聲明

部分內(nèi)容來自網(wǎng)絡
本教程僅用于學習, 禁止用于其他用途