autojs量角器-相机背景

牙叔教程 简单易懂

界面展示

在这里插入图片描述

环境

手机: Mi 11 Pro

Android版本: 12

Autojs版本: 9.1.6

你将学到以下知识点

  • 全屏
  • 相机的基本使用
  • canvas画线, 画圆
  • canvas裁剪
  • canvas平移旋转
  • 两条线计算夹角

代码讲解

1. ui界面
ui.layout(
  <frame fitsSystemWindows="false" id="parentView">
    <Camera2View id="camera2_view" layout_width="match_parent" layout_height="match_parent" />
    <canvas id="board" w="*" h="*"></canvas>
  </frame>
);

帧布局, 底层是相机背景, 上层是画板canvas

2. 触摸监听, 更新角度
function getTouchListener() {
  let touchListener = function (view, event) {
    let x = event.getX();
    let y = event.getY();
    touchX = x;
    touchY = y;
    angle = parseInt(get2PointAngle({ x: 0, y: circle.y - circle.radius }, { x: x, y: y }, { x: 0, y: circle.y }));
    return true;
  };
  return touchListener;
}
3. 显示半圆, 半圆之外, 模糊背景
path.addCircle(circle.x, circle.y, circle.radius, circle.dir);
canvas.clipPath(path, Region.Op.DIFFERENCE);
4. 绘制顺序
board.on("draw", (canvas) => {
  canvas.save();
  canvas.clipPath(path, Region.Op.DIFFERENCE);
  canvas.drawColor(colors.parseColor(config.mainColor));
  canvas.restore();
  drawScale(canvas);
  drawSlideBar(canvas);
  drawValueDisplayArea(canvas);
});

绘制半圆–> 绘制刻度–> 绘制滑杆–> 绘制角度数值

5. 绘制角度
function drawValueDisplayArea(canvas) {
  let circle = config.circle;
  let x = circle.x + circle.radius / 2;
  let y = circle.y;
  let radius = circle.radius / 9;
  canvas.drawCircle(x, y, radius, ValueDisplayAreaPaint);
  canvas.save();
  canvas.translate(x, y);
  canvas.rotate(90);
  canvas.drawText(angle + "", 0, ValueDisplayAreaTextHeight / 2, config.ValueDisplayAreaTextPaint);
  canvas.restore();
}
  • 绘制一个小圆, 作为角度数值的背景
  • canvas平移至小圆圆心
  • 旋转90度, 因为我们的显示器是横屏
  • 绘制文字, 让文字居中
6. 文字高度计算
ValueDisplayAreaTextPaint.setTextSize(70);
let rect = new Rect();
ValueDisplayAreaTextPaint.getTextBounds("1", 0, 1, rect);
ValueDisplayAreaTextHeight = rect.height();

设置文字大小之后, 再去计算文字高度

相关教程

canvas常用方法
autojs之悬浮窗, 给我待在屏幕里面
autojs-camera2-自动对焦且无拉伸变形
autojs-camera2-照相机-实现单拍和连拍
会呼吸的悬浮窗
autojs优秀UI-自定义控件

名人名言

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

声明

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

bilibili

牙叔教程

微信公众号 牙叔教程

在这里插入图片描述

QQ群

747748653
在这里插入图片描述

完整源码

AutoJS中安装Android-Proxy-Switcher库通常需要借助第三方插件管理器,比如Cordova或一些特定的AutoJS插件市场。由于AutoJS本身并不支持原生的npm(Node.js包管理器),所以你需要在支持插件管理的环境里进行安装。 以下是基本步骤,假设你在使用Cordova CLI(命令行工具): 1. **确保环境准备**:首先确保你的项目根目录下有一个`cordova.json`文件,并且已安装了Cordova CLI。如果没有,可以全局安装它: ```bash npm install -g cordova ``` 2. **创建Cordova项目**:如果尚未创建,先使用Cordova初始化一个新的项目: ```bash cordova create myApp com.example.myapp MyApp cd myApp ``` 3. **添加插件市场源**:因为AutoJS插件可能不在默认源里,你需要添加一个支持AutoJS插件的源,如GitHub或自定义仓库。这取决于插件的具体位置: ```bash cordova plugin add https://github.com/corona-warn-app/cwa-autojs-plugins.git ``` 4. **安装Android-Proxy-Switcher插件**: ```bash cordova plugin add cordova-plugin-android-proxy-switcher ``` 5. **集成到AutoJS脚本**:安装完成后,在你的AutoJS文件(`.auto.js`或`.autoai.js`)中引入并使用该插件,示例: ```javascript var ProxySwitcher = require('cordova-plugin-android-proxy-switcher'); ProxySwitcher.setProxy('http', 'your_proxy_address:port'); ``` 6. **打包和运行**:最后,你可以使用Cordova的构建工具(如`cordova build android`)打包并安装到Android设备上测试。 注意:实际过程可能会因项目结构、插件市场变化等原因有所不同,建议查看相关插件的官方文档或更新指南。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

牙叔教程

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值