HarmonyOS Canvas如何重置clip

主要代码如下,通过点击事件切换pathType,

1. 初始化运行得到图1,这里是正确的。

2. 点击一下pathType设置为false,得到图2,这里也是正确的。

3. 再次点击pathType设置为true,得到图3,是错误的。正确的应该是和图一一样的。if else里面的clip(path1)同时生效小了。

请问如果才能重置clip,使得if else 里面的path只能生效一个?

if (this.pathType) {  
  let path1 = new Path2D()  
  path1.moveTo(0, 0)  
  path1.lineTo(this.context.width, 0)  
  path1.lineTo(this.context.width * 0.5, this.context.height)  
  path1.lineTo(0, this.context.height)  
  path1.closePath()  
  this.context.clip(path1)  
} else {  
  let path1 = new Path2D()  
  path1.moveTo(0, 0)  
  path1.lineTo(this.context.width * 0.5, 0)  
  path1.lineTo(this.context.width, this.context.height)  
  path1.lineTo(0, this.context.height)  
  path1.closePath()  
  this.context.clip(path1)  
}

图一:

HarmonyOS Canvas如何重置clip-鸿蒙开发者社区

图二:

HarmonyOS Canvas如何重置clip-鸿蒙开发者社区

图三:

HarmonyOS Canvas如何重置clip-鸿蒙开发者社区
HarmonyOS
2024-10-12 11:11:22
浏览
已于2024-10-12 11:13:51修改
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

可以这么写:

if (this.saved){  
     this.context.restore()  
   }  
   else {  
     this.context.save()  
     this.saved = true  
   }

需要把:

if (this.saved){  
    this.context.restore()  
  }  
  else {  
    this.context.save()  
    this.saved = true  
  }

替换为:

this.context.restore()    
this.context.save()
分享
微博
QQ
微信
回复
2024-10-12 16:47:06
相关问题
HarmonyOS如何手动重置自定义组件?
259浏览 • 1回复 待解决
HarmonyOS .clip矩形裁切无法生效
224浏览 • 1回复 待解决
HarmonyOS使用canvas如何使文字垂直居中
480浏览 • 1回复 待解决
组件的通用属性clip有什么作用?
445浏览 • 1回复 待解决
如何操作canvas重新绘制
955浏览 • 1回复 待解决
canvas如何实现水印效果
858浏览 • 1回复 待解决
Canvas绘制内容如何动态更新
1340浏览 • 1回复 待解决
如何使用canvas添加水印
1233浏览 • 1回复 待解决
如何使用canvas绘制圆角矩形
399浏览 • 1回复 待解决
Canvas如何触发刷新重复绘制?
815浏览 • 1回复 待解决
HarmonyOS svg、canvas 的使用详情
345浏览 • 1回复 待解决
如何控制canvas组件的刷新呢
345浏览 • 1回复 待解决
Canvas 中 fillText 如何旋转角度
313浏览 • 1回复 待解决
HarmonyOS canvas支持画圆角矩形吗
244浏览 • 1回复 待解决
Canvas制作图表如何实现滑动惯性?
374浏览 • 1回复 待解决