wechat_wc/docs/页面设计规范/A类/设计清单.md

设计清单 页面设计规范

基本信息

• 路由：pages/designList/index
• 分类：A类
• 标题文本：我的设计清单
• TabBar：是

组件调用

• ScrollTopMask
  • title="我的设计清单"
  • targetSelector=".page-header.design-header"
  • showBack：否
• CustomTabBar：自动显示，页面无需手动调用。

设计要点

• 顶部字距：statusBarHeight + 12px（已统一）。
• 底部安全区：避让 TabBar + env(safe-area-inset-bottom)。
• TopMask 出现阈值由 .page-header.design-header 测量决定；滚动后标题淡入，位置遵循所在分类通用规范。

页面特有说明

ScrollView 列表 + 顶部 tab 筛选；批量管理模式注意遮罩不影响顶部操作。

验收要点

• 顶部字距符合 class 通用规范
• TopMask 标题/返回按钮符合预期
• 浅色/深色主题正常
• iOS / Android 真机表现一致