头像热区改用 40×40 容器撑(直接给 FbAvatar 加 width 会拉成椭圆)

自查发现的一个"顺手就踩"的坑:为了扩大点击热区(32 的头像手指容易点空),
本想给 `FbAvatar` 直接加 `.width(40).height(40)` ——
但 `FbAvatar` 的**根节点就是那个 `Image/Text`**(自己已设 `width(dia)`),
外层尺寸修饰会把它拉到 40×40,而圆角仍是 `dia/2 = 16`
⇒ **头像变成椭圆**,而且编译不报错。

⇒ 改成外面包一层 40×40 的 `Row`(居中),头像仍是正圆 32、热区是 40。

同时补一条守卫钉住它(`_fb_arkts_guard.js` 348/0):
断言"`Row{ FbAvatar{...} }` 之后跟着 `.width(40)`",并在 falsify 里加了
第 9 项注入(把容器撑宽改成直接给头像加 width)⇒ 反向验证 9/0。

验证:hvigor BUILD SUCCESSFUL;守卫 348/0;反向验证 9/0。
This commit is contained in:
2026-10-18 21:00:53 +08:00
parent 2b0401052c
commit f0f0d9047a
+19 -11
View File
@@ -208,19 +208,27 @@ export struct FbTopBar {
// ⚠️ 数据取自**本地库**(`FbPersonRepo.inst().byId`),不是名册列表里那份: // ⚠️ 数据取自**本地库**(`FbPersonRepo.inst().byId`),不是名册列表里那份:
// "我"常常**不在自己的名册**里(名册是"我挑出来的那一小撮"), // "我"常常**不在自己的名册**里(名册是"我挑出来的那一小撮"),
// 从名册那批里找会静默落空 ⇒ 点了没反应(最难查的那种失败)。 // 从名册那批里找会静默落空 ⇒ 点了没反应(最难查的那种失败)。
FbAvatar({ /* ⚠️ 用一层 40×40 的透明容器包住 32 的头像,**不要**直接给 `FbAvatar`
name: this.app.session.me.name, 加 `.width(40)`:
color: this.app.session.me.avatarColor, `FbAvatar` 的根节点就是那个 `Image/Text`(自己已设 `width(dia)`),
dia: 32, 外层尺寸修饰会把它拉到 40×40,而圆角仍是 `dia/2 = 16`
fontSizeVp: 14, ⇒ 头像被拉成**椭圆**(视觉 bug,且编译不报错)。
imageUrl: this.app.session.me.avatarUrl !== undefined 包一层则:热区 40、头像仍是正圆 32、居中。
? this.app.session.me.avatarUrl (32 直接当热区在真机上偏小、手指容易点空 —— 这就是要 40 的原因。) */
: '' Row() {
}) FbAvatar({
// ⚠️ `FbAvatar` 的布局尺寸在画布内(`Image` 自己撑圆),外层要显式 name: this.app.session.me.name,
// 给一个可点区域 —— 32 的头像直接当热区在真机上偏小(手指容易点空)。 color: this.app.session.me.avatarColor,
dia: 32,
fontSizeVp: 14,
imageUrl: this.app.session.me.avatarUrl !== undefined
? this.app.session.me.avatarUrl
: ''
})
}
.width(40) .width(40)
.height(40) .height(40)
.justifyContent(FlexAlign.Center)
.margin({ left: FbMetric.gapTopActions }) .margin({ left: FbMetric.gapTopActions })
.onClick((): void => { .onClick((): void => {
this.openMyDetail(); this.openMyDetail();