chore: establish V1.1 recovery baseline

This commit is contained in:
2026-09-09 22:05:00 +08:00
commit b46b48eb33
947 changed files with 155471 additions and 0 deletions
+113
View File
@@ -0,0 +1,113 @@
# 丹阳公益婚恋平台 - 底部导航栏图标设计规范
## 概述
为小程序 5 个底部导航 Tab 设计的圆润线性风格图标,包含未选中(灰色)和选中(玫瑰红)两种状态,适配三种屏幕密度(1x/2x/3x)。
## 设计规范
| 属性 | 规范值 |
|------|--------|
| 图标尺寸 | 81 × 81 px (基础) |
| 安全区域 | 56 × 56 px (边距 12px) |
| 线宽 | 2px |
| 圆角 | 端点圆角 + 转折圆角 |
| 填充 | 无(纯线性) |
## 颜色规范
| 状态 | 颜色值 | 用途 |
|------|--------|------|
| 未选中 | `#999999` | 默认状态图标 |
| 选中 | `#E96B6B` | 激活状态图标 |
| 背景 | `#FFFFFF` | 透明背景(PNG 支持 alpha) |
## 图标清单
### 1. 首页 (home)
- **意象**: 温馨小屋
- **元素**: 屋顶三角 + 房屋主体 + 门 + 烟囱
- **文件**: `home.png` / `home-active.png`
### 2. 找对象 (discover)
- **意象**: 双心相连,象征缘分匹配
- **元素**: 两个相交的爱心
- **文件**: `discover.png` / `discover-active.png`
### 3. 消息 (message)
- **意象**: 对话沟通
- **元素**: 圆角气泡 + 小三角 + 文字线条
- **文件**: `message.png` / `message-active.png`
### 4. 活动 (activity)
- **意象**: 日程安排
- **元素**: 日历主体 + 挂环 + 日期标记点
- **文件**: `activity.png` / `activity-active.png`
### 5. 我的 (mine)
- **意象**: 个人用户
- **元素**: 圆形头部 + 半圆身体轮廓
- **文件**: `mine.png` / `mine-active.png`
## 导出尺寸
| 尺寸 | 像素 | 适用场景 |
|------|------|---------|
| 1x | 81 × 81 | 标准屏设备 |
| 2x | 162 × 162 | Retina 屏设备 |
| 3x | 243 × 243 | 超高清晰屏设备 |
文件名约定:`{icon-name}.png` / `{icon-name}-active.png` / `{icon-name}_2x.png` / `{icon-name}_3x.png`
## SVG 源文件
所有图标均提供可编辑的 SVG 版本,位于 `svg/` 目录:
- 可直接在 Figma 中导入编辑
- 可调整颜色、粗细、圆角等参数
- 颜色替换:将 `stroke="#999999"` 改为 `stroke="#E96B6B"` 即可切换激活状态
## 文件位置
```
miniapp/assets/tabbar/
├── svg/ # SVG 源文件(可编辑)
│ ├── home.svg / home-active.svg
│ ├── discover.svg / discover-active.svg
│ ├── message.svg / message-active.svg
│ ├── activity.svg / activity-active.svg
│ └── mine.svg / mine-active.svg
├── home.png / home-active.png
├── home_2x.png / home-active_2x.png
├── home_3x.png / home-active_3x.png
├── discover.png / discover-active.png
├── discover_2x.png / discover-active_2x.png
├── discover_3x.png / discover-active_3x.png
├── message.png / message-active.png
├── message_2x.png / message-active_2x.png
├── message_3x.png / message-active_3x.png
├── activity.png / activity-active.png
├── activity_2x.png / activity-active_2x.png
├── activity_3x.png / activity-active_3x.png
├── mine.png / mine-active.png
├── mine_2x.png / mine-active_2x.png
└── mine_3x.png / mine-active_3x.png
```
## 更新说明
小程序 TabBar 配置无需修改,文件名与原有配置保持一致。
原配置 (`app.json`):
```json
{
"tabBar": {
"list": [
{ "pagePath": "pages/index/index", "iconPath": "assets/tabbar/home.png", "selectedIconPath": "assets/tabbar/home-active.png" },
{ "pagePath": "pages/discover/discover", "iconPath": "assets/tabbar/discover.png", "selectedIconPath": "assets/tabbar/discover-active.png" },
{ "pagePath": "pages/messages/messages", "iconPath": "assets/tabbar/message.png", "selectedIconPath": "assets/tabbar/message-active.png" },
{ "pagePath": "pages/activity/activity", "iconPath": "assets/tabbar/activity.png", "selectedIconPath": "assets/tabbar/activity-active.png" },
{ "pagePath": "pages/mine/mine", "iconPath": "assets/tabbar/mine.png", "selectedIconPath": "assets/tabbar/mine-active.png" }
]
}
}
```