fix(harmony): 悬浮加号移进 Navigation 列表侧,修详情页叠按钮
症状(2026-09-17 模拟器截图硬证):窄屏 Stack 模式点开邮件详情,右下角**同时**
出现两个圆形按钮 —— 详情自己的「回复」(蓝色胶囊)与外壳的 compose 加号,
后者悬空压在详情上。
根因:加号原先是 `Navigation` 的**兄弟**,平级放在外层 Stack 里。
详情画在 `Navigation` 内部,而兄弟节点画在 `Navigation` 之上 ⇒ 永远压住详情。
WebUI 的对应物是 `.comm-pane`(`App.tsx`: `{listBody}<ComposeFab />`):
加号在**列表窗格内部**,窄屏滑上来的详情层把列表整块(含加号)盖住,
详情自己的回复按钮才露得出来。Split 模式下加号仍在左栏,与 WebUI 两栏并排一致。
改法:把 `Stack({ alignContent: BottomEnd }) { 列表; 加号 }` 整体放进
`Navigation(this.navPathStack) { ... }` 的构建体内;通信页根的
`bgActive ? Transparent : pageBg` 保留(判据要求 ≥5 处让出页面底)。
判据(harmony-nav.test.mjs 新增一条,含变异自检):
- compose 加号必须在 `Navigation(...)` 的花括号**内**;
- `.navDestination(...)` 之后不得再出现 compose 加号。
用 `git show HEAD:...MainPage.ets`(改动前版本)复核:两条断言在 bug 版本上
**都失败**(inside=False / after=True),说明判据抓的正是这个层级错位,
不是"存在一个 compose 按钮"那种在 bug 版本上也成立的弱断言。
实测(模拟器 1256×2760):详情页只剩自己的「回复」按钮,加号不再悬空;
截图 /tmp/harmony-fabfix4.jpeg。列表页加号位置不变(仍在右下角)。
测试:200 passed / 0 failed。
This commit is contained in:
@ -505,3 +505,35 @@ test('★ 滚动列表上下边缘渐隐:所有列表容器都挂 fadingEdge
|
||||
assert.match(main, /import\s*\{[^}]*LengthMetrics[^}]*\}\s*from\s*'@kit\.ArkUI'/,
|
||||
'MainPage 要从 @kit.ArkUI import LengthMetrics');
|
||||
});
|
||||
|
||||
/*
|
||||
* ★ 悬浮加号必须待在 Navigation 的**列表侧**,不能当 Navigation 的兄弟。
|
||||
*
|
||||
* 症状(2026-09-17 模拟器截图硬证):窄屏 Stack 模式下点开邮件详情,右下角
|
||||
* **同时**出现两个圆形按钮 —— 详情自己的「回复」(蓝色胶囊)与外壳的
|
||||
* compose 加号,后者悬空压在详情上。
|
||||
*
|
||||
* 根因:加号原先是 `Navigation` 的**兄弟**,平级放在外层 Stack 里。
|
||||
* 详情画在 `Navigation` 内部,而兄弟节点画在 `Navigation` 之上 ⇒ 永远压住详情。
|
||||
*
|
||||
* WebUI 的对应物是 `.comm-pane`(`App.tsx`):`{listBody}<ComposeFab />` ——
|
||||
* 加号在**列表窗格内部**,窄屏滑上来的详情层把列表整块(含加号)盖住,
|
||||
* 详情自己的回复按钮才露得出来。Split 模式下加号仍在左栏,与 WebUI 两栏并排一致。
|
||||
*
|
||||
* 这条判据盯的是**层级**(在 Navigation 内部),不是"存在一个 compose 按钮" ——
|
||||
* 后者在 bug 版本里也成立(所以它才漏过)。
|
||||
*/
|
||||
test('★ 悬浮加号在 Navigation 内部(列表侧),不能当 Navigation 的兄弟压在详情上', () => {
|
||||
const body = braceBody(main, 'Navigation(this.navPathStack)');
|
||||
assert.ok(body.length > 200, '要能取到 Navigation 的构建体');
|
||||
assert.match(body, /iconName:\s*'compose'/,
|
||||
'★ compose 悬浮加号要在 `Navigation(this.navPathStack) { ... }` 的**构建体内**。' +
|
||||
'放在外面(兄弟位置)会在窄屏 Stack 详情页上悬空压住详情自己的「回复」按钮 —— ' +
|
||||
'2026-09-17 模拟器截图硬证。');
|
||||
assert.match(body, /borderRadius\(28\)/, '加号仍是 56 圆(直径 56 ⇒ 半径 28)');
|
||||
|
||||
// 反向:Navigation 之后(`.navDestination(...)` 那一段)不该再冒出 compose 按钮
|
||||
const afterNav = main.slice(main.indexOf('.navDestination(this.DestinationBuilder)'));
|
||||
assert.ok(!/iconName:\s*'compose'/.test(afterNav),
|
||||
'★ `.navDestination(...)` 之后不该再有 compose 加号 —— 那等于又放回了兄弟位置');
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user