今天的日程:整块内容补顶部内边距,不再贴白卡顶边 (#61)
用户:首页“今天的日程”那个色块,距离下边白色背景的上边缘还是贴着的。
跟之前我们提到过的“全天日程”一样,上面得稍微留一点空间。
与上轮不同:#61 上轮修的是 FbDayTimeline 里全天色块自己的 padding,
这次是整块内容(时间轴第一个刻度 + 第一条日程色块)都贴边,位置更外层。
根因:FbDayEventPanel 在首页是 showHead=false(首页自带 FbSectionTitle),
头部一关就没有任何顶部内边距了 —— 空态/时间轴/列表三个分支的 padding
都只有 left/right/bottom。内容直接从白卡片圆角顶边开始。
改法:加在根容器上,且只在 showHead=false 时生效
.padding({ top: this.showHead ? 0 : 10 })
- 加根容器而不是三个分支:分支会增删,漏一个就复现;根是唯一入口
- 带条件:有头时头自己带 top:12,再补会让标题离卡片顶太远(日程页会显形)
- 取 10:与本单上轮给全天色块的 top:10 同数,两处呼吸要一致
验证(真机):白卡顶边 y=1062、首个色块 y=1094,间距 32px=10.2vp
(改前 9px=2.9vp)。3 处调用点里只有首页 showHead=false 受影响,
日程页两处默认 true 零变化。hvigorw assembleHap BUILD SUCCESSFUL。
This commit is contained in:
@@ -122,6 +122,21 @@ export struct FbDayEventPanel {
|
|||||||
.backgroundColor(FbColors.surface)
|
.backgroundColor(FbColors.surface)
|
||||||
.borderRadius(FbMetric.radius)
|
.borderRadius(FbMetric.radius)
|
||||||
.margin({ left: FbMetric.pagePad, right: FbMetric.pagePad, top: 12, bottom: 12 })
|
.margin({ left: FbMetric.pagePad, right: FbMetric.pagePad, top: 12, bottom: 12 })
|
||||||
|
/* 🔴 用户 2026-11-06:「首页"今天的日程"那个色块,距离下边白色背景的上边缘
|
||||||
|
还是贴着的。跟之前我们提到过的"全天日程"一样,上面得稍微留一点空间。」
|
||||||
|
|
||||||
|
根因:`showHead = false` 时(首页就是这样)面板头整个不渲染,
|
||||||
|
而**三个内容分支的 padding 都只有 left/right/bottom、没有 top**
|
||||||
|
⇒ 内容直接从白卡片的圆角顶边开始,第一个色块与卡片边缘重合。
|
||||||
|
|
||||||
|
⇒ 只在 `showHead === false` 时补顶部内边距。有头的时候头自己带
|
||||||
|
`top: 12`,再补一次会让标题离卡片顶太远(日程页会出现这种情况)。
|
||||||
|
|
||||||
|
⚠️ 值取 10,与 #61 给全天色块补的 `top: 10` 同一个数 ——
|
||||||
|
两处都是「块与卡片边缘之间」的呼吸,视觉上要一致。
|
||||||
|
⚠️ 不要在三个分支里各加一遍:分支会增删,漏一个就复现这次的问题。
|
||||||
|
加在**根容器**上才是唯一入口。 */
|
||||||
|
.padding({ top: this.showHead ? 0 : 10 })
|
||||||
.alignItems(HorizontalAlign.Start)
|
.alignItems(HorizontalAlign.Start)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user