收藏
回答

canvas 2d开发者工具中可以得到actualBoundingBoxAscent但真机调试没有?

const ctx = canvas.getContext("2d");
const text = ctx.measureText("foo"); // returns TextMetrics object
text.actualBoundingBoxAscent; // 15.633333333333333;  开发者工具中有值,但微信真机调试没有这个属性值


对应的test.js文件是:
 wx.createSelectorQuery()
    .select('#secondCut'// 在 WXML 中填入的 id
    .fields({ nodetruesizetrue })
    .exec((res) => {
        const canvas = res[0].node
        const cdx = canvas.getContext('2d')
        // Canvas 画布的实际绘制宽高 
        let width = res[0].width
        let height = res[0].height
     
        // 初始化画布大小
        const dpr = wx.getWindowInfo().pixelRatio 
        canvas.width = width * dpr
        canvas.height = height * dpr
        cdx.scale(dpr, dpr)
              
        cdx.clearRect(00, width, height)
        cdx.rect(00, width, height);
        cdx.fillStyle="white"; 
        cdx.fill(); 
        
        //绘制标题
        cdx.font="200px bolder";
        cdx.fillStyle = "black"; 
        cdx.textAlign="center";   
        let measureText=cdx.measureText("测试文字")
        console.log(measureText)
               //measureText.actualBoundingBoxAscent; // 开发者工具中有值,但微信真机调试则没有这个actualBoundingBoxAscent属性
 
    })  
  },
对应的test.wxml内容是:
 


最后一次编辑于  02-16
回答关注问题邀请回答
收藏

3 个回答

  • 社区技术运营专员--Demons
    社区技术运营专员--Demons
    02-16

    请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    02-16
    有用
    回复 12
    查看更多(7)
  • 慢慢。
    慢慢。
    04-03

    用 Android 和 iOS 真机试了,是没有,开发工具是有的。

    真机只有:width、fontBoundingBoxAscent、fontBoundingBoxDescent

    开发工具:width、fontBoundingBoxAscent、fontBoundingBoxDescent、actualBoundingBoxAscent、actualBoundingBoxDescent、...

    04-03
    有用
    回复
  • 丛伟
    丛伟
    03-07

    问题解决了吗?模拟器有actualBoundingBoxAscent和actualBoundingBoxDescent属性 但是真机没有

    03-07
    有用
    回复 1
    • 丛伟
      丛伟
      03-07
      我用得fontBoundingBoxAscent和fontBoundingBoxDescent 也可以实现
      03-07
      回复
登录 后发表内容