HarmonyOS 鸿蒙Next 涂鸦+缩放功能如何做

HarmonyOS 鸿蒙Next 涂鸦+缩放功能如何做 纯涂鸦功能还好，但是涂鸦+缩放就不知道怎么写

大概场景：

画板涂鸦 - 缩放画板(当前涂鸦跟着缩放) - 然后在基础上继续画板涂鸦 - 继续缩放

基础思路：

涂鸦这方面的思路是通过

this.path2D.moveTo()

然后每次缩放时，会重新绘制

this.ctxDoodle.save();
this.ctxDoodle.clearRect(0, 0, this.displayWidth, this.displayHeight);
// 计算缩放
let scale = xxxxxxxxxx;
this.ctxDoodle.translate(x,y);
this.ctxDoodle.scale(scale, scale);
// 重新绘制
this.ctxDoodle.stroke(this.path2D);
this.ctxDoodle.restore();

现在问题是，图片放大，进行绘制（正常的），然后再次缩放会触发重新绘制，就涂鸦的坐标大小各种错乱了

请问有代码或者相关思路吗


更多关于HarmonyOS 鸿蒙Next 涂鸦+缩放功能如何做的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于HarmonyOS 鸿蒙Next 涂鸦+缩放功能如何做的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS（鸿蒙）系统中实现涂鸦和缩放功能，通常涉及图形界面开发。以下是一个简要的实现思路：

涂鸦功能：

  1. 画布设置：在布局文件中添加一个自定义视图作为涂鸦的画布。
  2. 触摸事件监听：在该自定义视图中监听触摸事件（如ACTION_DOWN、ACTION_MOVE等），记录触摸轨迹。
  3. 绘制涂鸦：在自定义视图的onDraw方法中，根据记录的触摸轨迹使用Paint对象进行绘制。

缩放功能：

  1. 缩放中心确定：确定缩放操作的中心点，可以是触摸点或者视图的中心点。
  2. 缩放比例计算：根据用户的缩放手势（如两指捏合）计算缩放比例。
  3. 画布变换：使用Matrix对象对画布进行缩放变换，根据缩放比例和中心点调整Matrix。
  4. 重绘视图：在缩放操作后，调用invalidate方法重绘视图，应用缩放效果。

请注意，以上实现思路是基于HarmonyOS的原生图形界面开发框架，具体实现可能需要结合实际的开发环境和需求进行调整。

如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html

回到顶部