Skip to content

fix(android): 移动端隐藏概览页「年度活动」热力图 #861

Description

@HKLHaoBin

背景

概览页(Overview.tsx)在桌面端会渲染「年度活动」热力图卡片(ActivityHeatmapCard + Heatmap.tsx),展示过去 365 天每日听写次数。数据通过 getActivityStats() 独立拉取,与历史保留策略解耦。

当前实现未区分移动端:只要 prefs.showOverviewActivityHeatmap !== false 且活动数据非空,就会在概览页渲染该模块。

问题

在 Android / 窄屏移动端(useMobileLayout())上:

  1. 性能负担较大:365 格热力图 + Intl 标签计算 + 独立 IPC 请求,对移动 WebView 不必要。
  2. 布局副作用:热力图横向宽度固定(约 53 周列),在窄屏下容易撑开内容区或产生横向溢出,进而影响整体布局;实测会导致底边栏宽度/对齐异常

桌面端保留该模块即可;移动端应默认隐藏(或后续再提供轻量替代)。

相关代码

  • openless-all/app/src/pages/Overview.tsxgetActivityStats()ActivityHeatmapCard 渲染条件(约 L78–210)
  • openless-all/app/src/components/Heatmap.tsx — 热力图组件
  • openless-all/app/src/lib/useMobileLayout.ts — 移动端判定(android OS 或 innerWidth < 720
  • 设置开关:prefs.showOverviewActivityHeatmapThemeSection.tsx

建议方案

  • Overview.tsx 中当 mobile === true 时跳过活动数据请求与 ActivityHeatmapCard 渲染;
  • 或在 useMobileLayout() 为真时直接不 mount 热力图(避免无意义的 IPC);
  • 桌面端行为与设置项保持不变。

验收

  • Android / 窄屏概览页不再显示「年度活动」卡片,也不再调用 getActivityStats()
  • 桌面端概览页行为不变,设置开关仍有效
  • 移动端底边栏宽度与对齐正常,无横向溢出

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions