uview-plus 3.8.106 → 3.8.108

package/changelog.md

@@ -1,3 +1,26 @@
+## 3.8.108（2026-08-18）
+fix: 修复鸿蒙二维码不显示、海报文字不换行等绘图问题
+
+鸿蒙 CanvasContext.measureText 同步返回值恒为 0，真实宽度只通过可选 callback 经 evalJSAsync 异步回传；
+而 uni-app-plus 走 evalJSSync 同步就能拿到真值。这是同样代码在安卓
+正常、鸿蒙异常的根因。
+
+宽度 0 会让 drawTextWithLineClamp 里 `0 <= maxWidth` 恒成立，整段
+文本被当成一行放得下直接输出，标题横穿并压到二维码上。
+
+- u-canvas: 新增 #ifdef APP-HARMONY 的 callback 测量分支；measureText
+  不再把 0 当有效值外传；新增 estimateTextWidth 兜底
+- u-poster: measureTextWidth 拿到非正数宽度时改用估算，不再 `|| 0` 静默吞掉
+- 兜底估算区分全角/半角（全角 1.0、半角 0.56、空白 0.28）。原先的
+  length * fontSize * 0.6 会让中文短算约 40%，仍然不换行
+- callback 超时从 1000ms 降到 300ms，并用 _harmonyMeasureUnavailable
+  锁存状态：一次换行要二分测量十几次，逐次干等会把导出拖成十几秒
+- 新增 verify:harmony-poster-text-wrap 校验脚本
+
+
+## 3.8.107（2026-08-18）
+fix: 修复empty示例页面
+
 ## 3.8.106
 feat: 让 App 原生 nvue 页面完整复用 App.up.vue 根容器
 

package/components/u-canvas/u-canvas.vue

@@ -21,7 +21,7 @@
         />
         <!-- #endif -->
 
-        <!-- #ifdef APP-PLUS -->
+        <!-- #ifdef APP-PLUS || APP-HARMONY -->
         <!-- #ifndef APP-NVUE -->
         <canvas
             class="u-canvas__canvas"
@@ -203,7 +203,7 @@ export default {
                                 size: true
                             },
                             (res) => {
-                                // #ifdef APP-PLUS
+                                // #ifdef APP-PLUS || APP-HARMONY
                                 resolve(res || {
                                     width: this.actualWidth,
                                     height: this.actualHeight
@@ -232,7 +232,7 @@ export default {
             return this._webViewContext;
             // #endif
 
-            // #ifdef APP-PLUS
+            // #ifdef APP-PLUS || APP-HARMONY
             return uni.createCanvasContext(this.canvasId, this);
             // #endif
 
@@ -364,7 +364,7 @@ export default {
                     measureText: (text, state) => {
                         const matched = String(state.font || '').match(/(\d+(?:\.\d+)?)px/);
                         const fontSize = matched ? Number(matched[1]) : this.fontSize;
-                        return { width: String(text).length * fontSize * 0.6 };
+                        return { width: this.estimateTextWidth(text, fontSize) };
                     }
                 });
                 this.ctx = this._webViewContext;
@@ -646,18 +646,77 @@ export default {
             }
             return this.callContext('strokeText', String(text), x, y, maxWidth);
         },
+        /**
+         * 按字形宽度估算文本宽度
+         * @description 当平台无法给出真实测量值时的兜底。必须区分全角/半角：
+         *   汉字、假名、全角标点约占一个字号，按半角的 0.6 估算会短 40%，
+         *   中文海报因此算出"整段都放得下"而不换行。
+         * @param {String} text 待测量文本
+         * @param {Number} [fontSize] 字号，默认取组件当前字号
+         * @returns {Number} 估算宽度(px)
+         * @author jry ijry@qq.com
+         */
+        estimateTextWidth(text, fontSize) {
+            const size = Number(fontSize) || Number(this.fontSize) || 12;
+            const FULL_WIDTH = /[ᄀ-ᅟ⺀-〾ぁ-㏿㐀-䶿一-鿿ꀀ-꓏가-힣豈-﫿︰-﹯＀-｠￠-￦]/;
+            return Array.from(String(text)).reduce((width, char) => {
+                if (FULL_WIDTH.test(char)) return width + size;
+                if (/\s/.test(char)) return width + size * 0.28;
+                return width + size * 0.56;
+            }, 0);
+        },
         measureText(text) {
             if (this.ctx && typeof this.ctx.measureText === 'function') {
-                return this.ctx.measureText(String(text));
+                const metrics = this.ctx.measureText(String(text));
+                const width = Number(metrics && metrics.width);
+                // 鸿蒙同步测量恒为 0（真实值只走 callback），上下文未就绪时其他
+                // 平台也可能返回 0。绝不能把 0 交给调用方——换行逻辑会把它当成
+                // "宽度足够"，于是整段文本挤成一行。
+                if (width > 0) return metrics;
             }
             return {
-                width: String(text).length * this.fontSize * 0.6
+                width: this.estimateTextWidth(text)
             };
         },
         measureTextAsync(text) {
             if (this.ctx && typeof this.ctx.measureTextAsync === 'function') {
                 return this.ctx.measureTextAsync(String(text));
             }
+
+            // #ifdef APP-HARMONY
+            // 鸿蒙的 CanvasContext.measureText 同步返回值恒为 0，真实宽度只通过
+            // callback(webview.evalJSAsync) 回传，因此必须走回调形式。
+            if (this.ctx && typeof this.ctx.measureText === 'function' && !this._harmonyMeasureUnavailable) {
+                return new Promise((resolve) => {
+                    let settled = false;
+                    // evalJSAsync 并非所有鸿蒙版本都提供，回调可能永远不来，
+                    // 必须兜底避免上层 await 永久挂起。且一旦超时就标记为不可用：
+                    // 单次换行要二分测量十几次，逐次干等会把导出拖成十几秒。
+                    const timer = setTimeout(() => {
+                        if (settled) return;
+                        settled = true;
+                        this._harmonyMeasureUnavailable = true;
+                        resolve({ width: this.estimateTextWidth(text) });
+                    }, 300);
+                    const done = (metrics) => {
+                        if (settled) return;
+                        settled = true;
+                        clearTimeout(timer);
+                        const width = Number(metrics && metrics.width);
+                        resolve({ width: width > 0 ? width : this.estimateTextWidth(text) });
+                    };
+                    try {
+                        const sync = this.ctx.measureText(String(text), done);
+                        // 若该平台其实同步返回了有效值，直接采用
+                        const syncWidth = Number(sync && sync.width);
+                        if (syncWidth > 0) done(sync);
+                    } catch (error) {
+                        done(null);
+                    }
+                });
+            }
+            // #endif
+
             return Promise.resolve(this.measureText(text));
         },
         createLinearGradient(x0, y0, x1, y1) {
@@ -800,8 +859,8 @@ export default {
                 let destWidth = hasDestWidth ? options.destWidth : width;
                 let destHeight = hasDestHeight ? options.destHeight : height;
 
-                // MP、H5 和 APP-PLUS 保持逻辑绘制坐标，只提升默认导出像素。
-                // #ifdef MP || H5 || APP-PLUS
+                // MP、H5、APP-PLUS 和 APP-HARMONY 保持逻辑绘制坐标，只提升默认导出像素。
+                // #ifdef MP || H5 || APP-PLUS || APP-HARMONY
                 if (!hasDestWidth) {
                     destWidth = Math.round(width * this.dpr);
                 }

package/components/u-poster/u-poster.vue

@@ -360,6 +360,16 @@ export default {
 			const lines = [];
 			const ellipsis = '...';
 			const measurementCache = new Map();
+			const fontSize = css.fontSize ? this.convertRpxToPx(css.fontSize) : 20;
+			// 兜底估算：全角字符约占一个字号，半角约 0.56。测量失败时若按半角估算，
+			// 中文会短算 40% 而不换行，所以必须区分宽度。
+			const estimateWidth = (value) => Array.from(String(value)).reduce((width, char) => {
+				if (/[ᄀ-ᅟ⺀-〾぀-㏿㐀-䶿一-鿿ꀀ-꓏가-힣豈-﫿︰-﹯＀-｠￠-￦]/.test(char)) {
+					return width + fontSize;
+				}
+				if (/\s/.test(char)) return width + fontSize * 0.28;
+				return width + fontSize * 0.56;
+			}, 0);
 			const measureTextWidth = async (value) => {
 				if (measurementCache.has(value)) {
 					return measurementCache.get(value);
@@ -370,7 +380,12 @@ export default {
 				} else {
 					metrics = ctx.measureText(value);
 				}
-				const measuredWidth = Number(metrics && metrics.width) || 0;
+				let measuredWidth = Number(metrics && metrics.width) || 0;
+				// 测量不可用时(鸿蒙同步 measureText 恒返回 0)必须改用估算：
+				// 把 0 当作真实宽度会让下面的 <= maxWidth 恒成立，整段文本挤成一行。
+				if (!(measuredWidth > 0) && value) {
+					measuredWidth = estimateWidth(value);
+				}
 				measurementCache.set(value, measuredWidth);
 				return measuredWidth;
 			};
@@ -475,15 +490,33 @@ export default {
 		 */
 		convertRpxToPx(rpxValue) {
 			if (typeof rpxValue === 'number') return rpxValue;
-			
+
 			// 使用rpx2px方法
 			if (typeof rpxValue === 'string' && rpxValue.endsWith('rpx')) {
 				const value = parseFloat(rpxValue);
-				return rpx2px(value);
+				return value * this.getRpxRatio();
 			}
-			
+
 			return parseFloat(rpxValue) || 0;
 		},
+
+		/**
+		 * 获取 rpx -> px 的统一换算比例
+		 * @description uni.upx2px 对每个值单独判断设备宽度：当 windowWidth 超过
+		 *   rpxCalcMaxDeviceWidth(默认960)时，只有恰好等于 750 的值使用真实设备宽度，
+		 *   其余值回退到 rpxCalcBaseDeviceWidth(默认375)。海报需要所有尺寸共用同一
+		 *   比例，逐值换算会让宽高用上不同基准而破坏宽高比：鸿蒙 windowWidth 上报为
+		 *   物理像素1084，750rpx算得1084、1114rpx算得557，海报因此变成横向。
+		 *   这里只取一次比例，且刻意用非 750 的值探测，避开上面的特例分支，
+		 *   使超宽设备统一走 baseWidth，避免画布被放大到数十MB。
+		 * @returns {Number} 每 1rpx 对应的 px 值
+		 * @author jry ijry@qq.com
+		 */
+		getRpxRatio() {
+			const PROBE = 1000; // 不能用 750，750 是 upx2px 的特例值
+			const ratio = rpx2px(PROBE) / PROBE;
+			return ratio > 0 ? ratio : 1;
+		},
 		
 		/**
 		 * 绘制渐变背景

package/package.json

@@ -2,7 +2,7 @@
   "id": "uview-plus",
   "name": "uview-plus",
   "displayName": "零云®uview-plus3.0重磅发布，全面的Vue3鸿蒙跨端移动组件库，组件丰富维护更新稳定。",
-  "version": "3.8.106",
+  "version": "3.8.108",
   "description": "零云®uview-plus已兼容vue3支持多语言，120+全面的组件和便捷的工具会让您信手拈来。近期新增拖动排序、条码、图片裁剪、下拉刷新、虚拟列表、签名、Markdown等。",
   "keywords": [
     "uview",
@@ -11,7 +11,7 @@
     "echarts",
     "ui",
     "可视化"
-  ],
+],
   "main": "index.js",
   "repository": "https://github.com/ijry/uview-plus",
   "engines": {