From d3c52595ec97a5c6cbbffdc9850ec039902c4adf Mon Sep 17 00:00:00 2001
From: qiang <guoshengqiang@live.com>
Date: Thu, 3 Sep 2020 15:48:25 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20App=E3=80=81H5=20=E7=AB=AF=20CanvasCont?=
 =?UTF-8?q?ext.measureText=20=E6=94=AF=E6=8C=81=E5=BC=82=E6=AD=A5=E8=BF=94?=
 =?UTF-8?q?=E5=9B=9E=E6=95=B0=E6=8D=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/core/service/api/context/canvas.js    | 42 ++++++++++++++---------
 src/core/view/components/canvas/index.vue | 18 +++++++++-
 2 files changed, 42 insertions(+), 18 deletions(-)

diff --git a/src/core/service/api/context/canvas.js b/src/core/service/api/context/canvas.js
index 47a31c3c3..c2941af2e 100644
--- a/src/core/service/api/context/canvas.js
+++ b/src/core/service/api/context/canvas.js
@@ -17,16 +17,6 @@ import {
 
 const canvasEventCallbacks = createCallbacks('canvasEvent')
 
-UniServiceJSBridge.subscribe('onDrawCanvas', ({
-  callbackId,
-  data
-}) => {
-  const callback = canvasEventCallbacks.pop(callbackId)
-  if (callback) {
-    callback(data)
-  }
-})
-
 UniServiceJSBridge.subscribe('onCanvasMethodCallback', ({
   callbackId,
   data
@@ -342,14 +332,32 @@ export class CanvasContext {
     }
   }
 
-  // TODO
-  measureText (text) {
-    if (typeof document === 'object') {
-      var c2d = getTempCanvas().getContext('2d')
-      c2d.font = this.state.font
-      return new TextMetrics(c2d.measureText(text).width || 0)
+  measureText (text, callback) {
+    const font = this.state.font
+    if (__PLATFORM__ === 'h5') {
+      const canvas = getTempCanvas()
+      const c2d = canvas.getContext('2d')
+      c2d.font = font
+      const textMetrics = new TextMetrics(c2d.measureText(text).width || 0)
+      if (typeof callback === 'function') {
+        setTimeout(() => callback(textMetrics), 0)
+      }
+      return textMetrics
     } else {
-      return new TextMetrics(0)
+      const textMetrics = new TextMetrics(0)
+      if (typeof callback === 'function') {
+        const callbackId = canvasEventCallbacks.push(function ({ width }) {
+          callback(new TextMetrics(width))
+        })
+        operateCanvas(this.id, this.pageId, 'measureText', {
+          text,
+          font,
+          callbackId
+        })
+      } else {
+        console.error('warning: measureText missing required arguments: callback')
+      }
+      return textMetrics
     }
   }
 
diff --git a/src/core/view/components/canvas/index.vue b/src/core/view/components/canvas/index.vue
index 913a85136..d37865ef3 100644
--- a/src/core/view/components/canvas/index.vue
+++ b/src/core/view/components/canvas/index.vue
@@ -272,7 +272,7 @@ export default {
         }
       }
       if (!this.actionsWaiting && callbackId) {
-        UniViewJSBridge.publishHandler('onDrawCanvas', {
+        UniViewJSBridge.publishHandler('onCanvasMethodCallback', {
           callbackId,
           data: {
             errMsg: 'drawCanvas:ok'
@@ -280,6 +280,22 @@ export default {
         }, this.$page.id)
       }
     },
+    measureText ({
+      text,
+      font,
+      callbackId
+    }) {
+      const canvas = getTempCanvas()
+      const c2d = canvas.getContext('2d')
+      c2d.font = font
+      UniViewJSBridge.publishHandler('onCanvasMethodCallback', {
+        callbackId,
+        data: {
+          errMsg: 'measureText:ok',
+          width: c2d.measureText(text).width || 0
+        }
+      }, this.$page.id)
+    },
     preloadImage: function (actions) {
       var self = this
       actions.forEach(function (action) {
-- 
GitLab