dcloudio / dcloudio/uni-app

[Feature] 希望 CanvasContext.measureText API 支持更多 TextMetrics 信息

Open
#5,394 9 comments 0 reactions 1 assignee Claimed by @GRCmade View on GitHub
Dominant language
JavaScript
Stars
41.6k
Forks
3.7k
Avg merge
7h 6m
Merged PRs (30d)
6

Description

### 发行方式

None

### 具体平台

### 开发环境

None

### 项目创建方式

None

### 依赖版本

### 问题描述

目前,在 App 端 [CanvasContext.measureText](https://uniapp.dcloud.net.cn/api/canvas/CanvasContext.html#canvascontext-measuretext) API 仅支持返回 `width` 文本宽度。

希望支持更多 [TextMetrics](https://developer.mozilla.org/zh-CN/docs/Web/API/TextMetrics) 字段(如下),以便于实现对文本的精细化控制,比如文本对齐等。

- width(已有)
- fontBoundingBoxAscent
- fontBoundingBoxDescent
- actualBoundingBoxAscent
- actualBoundingBoxDescent

尽管微信小程序官方文档(旧 Canvas)也只提到返回 width 字段,实际上也是有返回 fontBoundingBoxAscent 等信息的。

简单看了下源码,应该调整下以下两个方法即可满足:

- [measureText](https://github.com/dcloudio/uni-app/blob/8babbd17e7b89c0df376cc7cf8ed1437bc43cce2/packages/uni-api/src/service/context/canvas.ts#L94-L99)
- [TextMetrics](https://github.com/dcloudio/uni-app/blob/8babbd17e7b89c0df376cc7cf8ed1437bc43cce2/packages/uni-api/src/service/context/canvas.ts#L333-L339)

谢谢~

### 重现步骤

### 期望行为

希望在 App 端 CanvasContext.measureText API 返回:

- width(已有)
- fontBoundingBoxAscent
- fontBoundingBoxDescent
- actualBoundingBoxAscent
- actualBoundingBoxDescent

### 实际行为

App 端 CanvasContext.measureText API 返回了

- width

### 截图或录屏

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.