style(周视图): 选中/今天的圆放大到 42vp #6

用户反馈:周视图的圆不够大。

## 实测数据(设备 dump)
  周条每列 Stack = 133 × 192 px
  原来圆       = 113 × 113 px(36vp)

周条每列有 192px 高,圆只占 113px,显得空;而且比月视图的 138px 还小,
两个视图的"选中"视觉分量不一致。

## 关键约束:宽度是硬上限
列宽 133px ≈ 44vp。给 52vp(≈156px) 会**横向溢出被裁切**。
所以取 42vp(≈126px),留 7px 余量。

## 字号同步放大
大圆里字太小会失衡,一起调:
  日期 14 → 16、日期框 30 → 34
  农历 8 → 9、事件点 3.5 → 4

⚠️ 教训:改尺寸前先 dump 量格子实际宽高,别拍脑袋。
   这次如果直接按"感觉不够大"给 52,会被裁成方角,又得返工。
This commit is contained in:
2026-11-02 21:59:30 +08:00
parent 4f19c9482d
commit 22db069bee
+13 -9
View File
@@ -1697,16 +1697,20 @@ struct Index {
// 原来这里选中只有 30×30 的小圈,跟月视图 46vp 的大圆不一致, // 原来这里选中只有 30×30 的小圈,跟月视图 46vp 的大圆不一致,
// 同一个"选中"在两个视图里长得不一样,会让人以为是不同状态。 // 同一个"选中"在两个视图里长得不一样,会让人以为是不同状态。
Stack() { Stack() {
// ⭐ WEEK_BIGGER 圆必须够大:实测周条每列 133×192px,
// 原来只给 36vp(≈113px),比月视图的 138px 还小,看着空。
// 但**列宽 133px ≈ 44vp 是硬上限**,给 52 会横向溢出被裁切,
// 所以取 42vp(≈126px),留 7px 余量。
if (cell.dateMs === this.selectedDate) { if (cell.dateMs === this.selectedDate) {
Column() Column()
.width(36) .width(42)
.height(36) .height(42)
.borderRadius('50%') .borderRadius('50%')
.backgroundColor($r('app.color.selected_bg')) .backgroundColor($r('app.color.selected_bg'))
} else if (cell.isToday) { } else if (cell.isToday) {
Column() Column()
.width(36) .width(42)
.height(36) .height(42)
.borderRadius('50%') .borderRadius('50%')
.backgroundColor($r('app.color.today_bg')) .backgroundColor($r('app.color.today_bg'))
} }
@@ -1720,22 +1724,22 @@ struct Index {
.fontColor(cell.dateMs === this.selectedDate .fontColor(cell.dateMs === this.selectedDate
? $r('app.color.brand_text') : $r('app.color.text_hint')) ? $r('app.color.brand_text') : $r('app.color.text_hint'))
Text(String(cell.day)) Text(String(cell.day))
.fontSize(14) .fontSize(16)
.fontWeight(cell.dateMs === this.selectedDate || cell.isToday .fontWeight(cell.dateMs === this.selectedDate || cell.isToday
? FontWeight.Bold : FontWeight.Normal) ? FontWeight.Bold : FontWeight.Normal)
.fontColor(cell.dateMs === this.selectedDate .fontColor(cell.dateMs === this.selectedDate
? $r('app.color.button_text') : $r('app.color.text_primary')) ? $r('app.color.button_text') : $r('app.color.text_primary'))
.width(30) .width(34)
.height(30) .height(34)
.textAlign(TextAlign.Center) .textAlign(TextAlign.Center)
// 背景交给底层圆(否则会出现"大圆套小圈") // 背景交给底层圆(否则会出现"大圆套小圈")
.backgroundColor(Color.Transparent) .backgroundColor(Color.Transparent)
Text(cell.lunar) Text(cell.lunar)
.fontSize(8) .fontSize(9)
.fontColor(cell.dateMs === this.selectedDate .fontColor(cell.dateMs === this.selectedDate
? $r('app.color.button_text') : $r('app.color.text_hint')) ? $r('app.color.button_text') : $r('app.color.text_hint'))
.maxLines(1) .maxLines(1)
Circle({ width: 3.5, height: 3.5 }) Circle({ width: 4, height: 4 })
.fill(cell.dateMs === this.selectedDate .fill(cell.dateMs === this.selectedDate
? $r('app.color.button_text') : $r('app.color.soft_red')) ? $r('app.color.button_text') : $r('app.color.soft_red'))
.opacity(cell.hasEvent ? 1 : 0) .opacity(cell.hasEvent ? 1 : 0)