gg修改器进游戏悬浮窗_gg修改器的悬浮窗

作者：佚名来源：网友分享日期：2024-04-27 05:41:03

大家好，今天小编为大家分享关于gg修改器进游戏悬浮窗_gg修改器的悬浮窗的内容，赶快来一起来看看吧。

牙叔教程简单易懂

效果预览

如上图所示, 一共有三个悬浮存储:

右侧的悬浮球
十字架悬浮窗
翻译的内容悬浮窗

建议只用两个悬浮窗, 也就是把十字架和翻译内容合并为一个悬浮窗, 这样用户在触摸移动的时候,

有更大的触摸区域.

思路

十字架指针确定单词位置
用autojs9提供的插件 MLKitOCR , 识别单词周围的内容
ocr识别的结果中, 带有文字的recct信息,
这些rect信息和十字架的位置对比一下, 就知道是哪个单词了
网上找了个离线的词典, 词汇量几十万
用sqlite查询, 速度很快

离线词典制作教程

请参考: autojs查找相同词根的单词

https://www./yashujs/bfug6u/wbg0or

这个是把csv的单词数据转成了db,

本教程不提供单词数据库, 若有需要, 下载那个开源的单词库, 跟着教程做, 自己转db

多个分辨率保持大致相似的布局

我们来看看多个分辨率的布局是否一样

这是模拟器的三种分辨率, 可以看到布局几乎一模一样, 这是怎么做的呢?

布局的宽高使用的都是px, 按照同样的比例来决定多宽多高,

文字大小使用的也是px; 他们使用的是同一个比例;

let config = { cross: { widthRatio: 0.05, }, text: { sizeRatio: 0.04, }, translationHoveringWindow: { widthRatio: 0.4, heightRatio: 0.2, }, };

因此, 你看到的是同一个比例的布局, 但是是不同的宽高, 达到了在视觉上保持一致的效果

悬浮球

为了尽量少的遮挡用户的屏幕, 我们将其透明度设置为了0.5

alpha=’0.5’

悬浮球随意拖动

他可以随意拖动

这个拖动因为比较常用, 建议大家封装一下;

我的代码已经写完了, 就不改了, 这里可以提供一个封装例子

首先写一个悬浮窗用来测试

let window = floaty.rawWindow( <vertical> <button id="move" text="移动" w="auto" h="auto" /> </vertical> ); setInterval(() => {}, 1000);

然后是封装;

封装不只是移动, 后期可能还要添加各种按下拖动抬起的行为, 因此封装的参数对象有多个属性

let windowData = { window: window, moveViewId: "move", isTouching: false, downCallback: function () {}, moveCallback: function () {}, upCallback: function () {}, onClick: function () {}, };

但是你肯定不想写这么多属性, 只有前两个是必须的, 其他的可有可无, 我们可以设置默认属性, 然后和用户传进来的对象合并

let windowData = { window: window, moveViewId: "move", }; let windowDefaultData = { isTouching: false, downCallback: function () {}, moveCallback: function () {}, upCallback: function () {}, onClick: function () {}, };

Object.assign(windowDefaultData, windowData);

我们要让用户传入的参数对象覆盖掉默认的对象, 因此, 用户的参数作为 Object.assign 第二个参数

接下来是封装触摸移动;

第一: 做参数校验, 如果传递的参数对象没有必备的属性, 我们就抛出错误

function makeWindowMoveable(windowData) { if (!windowData.window) { throw new Error("windowData.window is undefined"); } if (!windowData.moveViewId) { throw new Error("windowData.moveViewId is undefined"); }

触摸移动的基础封装

var x = 0, y = 0; //记录按键被按下时的悬浮窗位置 var windowX, windowY; //记录按键被按下的时间以便判断长按等动作 var downTime; let view = window[windowData.moveViewId];

view.setOnTouchListener(function (view, event) { switch (event.getAction()) { case event.ACTION_DOWN: x = event.getRawX(); y = event.getRawY(); windowX = window.getX(); windowY = window.getY(); return true; case event.ACTION_MOVE: //移动手指时调整悬浮窗位置 window.setPosition(windowX + (event.getRawX() - x), windowY + (event.getRawY() - y)); return true; case event.ACTION_UP: return true; } return true; });

在该基础上添加各种callback

switch (event.getAction()) { case event.ACTION_DOWN: windowDefaultData.downCallback(); return true; case event.ACTION_MOVE: windowDefaultData.moveCallback(); return true; case event.ACTION_UP: windowDefaultData.upCallback(); return true; }

再加上点击和长按操作

switch (event.getAction()) { case event.ACTION_UP: let upTime = new Date().getTime(); let time = upTime - downTime; // 移动距离 let distance = Math.sqrt(Math.pow(event.getRawX() - x, 2) + Math.pow(event.getRawY() - y, 2)); if (time < 150 && distance < 5) { windowDefaultData.onClick(); } else if (time > 2000 && distance < 5) { windowDefaultData.longClick(); } return true; }

完整封装如下

let window = floaty.rawWindow( <vertical> <button id="move" text="移动" w="auto" h="auto" /> </vertical> ); setInterval(() => {}, 1000);


let windowData = {

    window: window,

    moveViewId: "move",

    downCallback: function () {

        log("downCallback");

    },

    moveCallback: function () {

        log("moveCallback");

    },

    upCallback: function () {

        log("upCallback");

    },

    onClick: function () {

        log("onClick");

    },

    longClick: function () {

        log("longClick");

    },

};

makeWindowMoveable(windowData);

function makeWindowMoveable(windowData) {

    if (!windowData.window) {

        throw new Error("windowData.window is undefined");

    }

    if (!windowData.moveViewId) {

        throw new Error("windowData.moveViewId is undefined");

    }

    let windowDefaultData = {

        isTouching: false,

        downCallback: function () {},

        moveCallback: function () {},

        upCallback: function () {},

        onClick: function () {},

        longClick: function () {},

    };

    Object.assign(windowDefaultData, windowData);

    //记录按键被按下时的触摸坐标

    var x = 0,

        y = 0;

    //记录按键被按下时的悬浮窗位置

    var windowX, windowY;

    //记录按键被按下的时间以便判断长按等动作

    var downTime;

    let view = window[windowData.moveViewId];

view.setOnTouchListener(function (view, event) { switch (event.getAction()) { case event.ACTION_DOWN: windowDefaultData.isTouching = true; x = event.getRawX(); y = event.getRawY(); windowX = window.getX(); windowY = window.getY(); downTime = new Date().getTime(); windowDefaultData.downCallback(); return true; case event.ACTION_MOVE: //移动手指时调整悬浮窗位置 window.setPosition(windowX + (event.getRawX() - x), windowY + (event.getRawY() - y)); windowDefaultData.moveCallback(); return true; case event.ACTION_UP: windowDefaultData.isTouching = false; windowDefaultData.upCallback(); let upTime = new Date().getTime(); let time = upTime - downTime; // 移动距离 let distance = Math.sqrt(Math.pow(event.getRawX() - x, 2) + Math.pow(event.getRawY() - y, 2)); if (time < 150 && distance < 5) { windowDefaultData.onClick(); } else if (time > 2000 && distance < 5) { windowDefaultData.longClick(); } return true; } return true; }); return windowDefaultData; }

这个封装能满足一部分使用需求, 在不同的使用场景仍要按需修改

悬浮窗吸附屏幕边缘

拖动以后会自动吸附到屏幕边缘;

靠近左边就贴到左边;

靠近右边就贴到右边;

位置会记住, 下次重启代码, 悬浮窗还在上次的位置

上面那个触摸还封装了一个是否正在触摸的属性, 为什么要加这个属性呢?

就是为了这个悬浮窗屏幕吸附效果;

吸附屏幕边缘, 我是用的是定时器, 每隔2秒, 检查一次

在我们移动悬浮窗的时候, 我们正在调整悬浮窗位置, 这个时候, 你肯定不想吸附到屏幕边缘;

不然, 他会干扰你调整位置

为了获取悬浮窗的状态, 这个封装方法 makeWindowMoveable 必须返回 windowDefaultData;

return windowDefaultData;

然后在你需要使用触摸状态的地方, 来获取触摸状态: windowDefaultData.isTouching

屏幕吸附边缘, 同样会记忆, 使用storage持久化存储

悬浮窗的实例化

悬浮窗还有各种隐藏, 显示, 以及一些其他方法要写, 因此建议封装为一个类, 这样我们可以更方便的调用各种方法, 而不用到处翻页找方法在哪里,

如果不这样做, 那就会越写越烦躁,一会找这个方法, 一会找那个方法, 烦死了

function CrossWindow() { this.window = floaty.rawWindow(<vertical>...</vertical>); this.isShowing = false; this.storage = storages.create("crossWindow"); } CrossWindow.prototype.getCrossPoint = function () {...}; CrossWindow.prototype.toggle = function () {...}; CrossWindow.prototype.hide = function () {...}; ......

悬浮窗显示和隐藏

隐藏是将悬浮窗移动到屏幕之外来实现的

this.window.setPosition(-10000, -10000);

显示就是移动到屏幕之内;

同样的, 悬浮窗的位置也会记忆, 也是用storage持久化存储

十字架

十字架是一个 frame 布局, 横着一个view, 竖着一个view, 就成了一个十字架

<frame id="cross"> <View layout_gravity="center" w="match_parent"> </View> <View layout_gravity="center" h="match_parent"> </View> </frame>

当然了, 你也可以用图片, 或者canvas自己画

十字架的中心点在屏幕上的位置

获取一个view在屏幕上的位置信息, 我们封装了一个方法

function getViewRect(view) { let locationOnScreen = view.getLocationOnScreen(); let frame = new android.graphics.Rect(); view.getHitRect(frame); let width = frame.width(); let height = frame.height(); return { x: locationOnScreen[0], y: locationOnScreen[1], width: width, height: height, }; }

获取十字架中心点, 就在获取位置信息后, 加减乘除, 很简单就不说了

点击翻译按钮, 识别单词

点击翻译按钮后, 我们先获取十字架的中心点, 然后调用autojs9

提供的插件 MLKitOCR , 这个是谷歌开发的工具, 识别英文效果又快又好,

ocr的识别结果带有单词的rect矩形坐标数据, 我们和十字架中心点对比,

谁包含十字架, 谁就是十字架指向的单词

封装的方法是判断一个点, 是否在一个rect中

function isPointInRect(point, rect) { let x = point.x; let y = point.y; let x1 = rect.left; let y1 = rect.top; let x2 = rect.right; let y2 = rect.bottom; if (x >= x1 && x <= x2 && y >= y1 && y <= y2) { return true; } return false; }