首页四个功能图标圆形背景方案及实施记录
需求
首页“餐厅菜谱、我的营养、人脸管理、健康宣教”
四个图标统一增加 #DEECFB 圆形底板，并通过默认与 hdpi 两套尺寸资源兼容
YF_029E 和 K203。
设计方案
- 保留原有 2×2 白色功能卡片、文字样式、控件 ID 和点击逻辑。
- 四个图标统一使用 ImageView，圆形底板基准尺寸为 156dp。
- 图标四周使用 34dp 内边距，实际显示区仍约为 88dp。
- 使用 centerInside 居中等比显示，不拉伸原始 PNG。
- 图标与文字间距由 42dp 调整为 30dp。
截图反馈调整
首版 128px 圆形底板和 20px 内边距在 1080×1920 首页截图中视觉占比偏小、
图标靠近圆边。根据用户反馈，将底板扩大到约 156px，内边距增加到约 34px，
同时维持约 88px 的图标显示区，使浅蓝背景更明显、图标周围留白更充分。
双屏适配
| 项目 | YF_029E（160dpi） | K203（240dpi） | 最终像素 |
|---|
| 圆形底板 | 156dp | 104dp | 156px |
| 图标内边距 | 34dp | 22.67dp | 约 34px |
| 图标显示区 | 88dp | 58.66dp | 约 88px |
| 图标与文字间距 | 30dp | 20dp | 30px |
两种设备保持相同的最终像素比例，避免 K203 因 240dpi 对同一 dp 数值再次放大。
实施内容
- 新增首页图标底板颜色
#DEECFB。
- 新增 oval 形状的圆形 drawable。
- 为默认与 hdpi 资源分别增加 156 基准尺寸。
- 四个入口统一设置圆形背景、内边距、centerInside 和图标 src。
- 四处图标与文字间距统一调整为 30 基准尺寸。
文件范围
- app/src/main/res/layout/activity_main.xml
- app/src/main/res/drawable/home_func_icon_bg.xml
- app/src/main/res/values/colors.xml
- app/src/main/res/values/dimens_adaptive.xml
- app/src/main/res/values-hdpi/dimens_adaptive.xml
验证记录
- 本次涉及的 XML 文件通过 xmllint 结构检查。
- 根据截图反馈放大底板与内边距后，JDK 8 执行
sh ./gradlew :app:processDebugResources assembleDebug --console=plain，
结果为 BUILD SUCCESSFUL in 22s。
- 资源合并、资源处理和 Debug APK 打包均完成，默认与 hdpi 资源可正常解析。
边界与验收
- 未修改 MainActivity 和四个入口的业务点击逻辑。
- 未修改功能卡片、首页网格比例、文字内容和字体样式。
- 未安装 APK；建议分别在 YF_029E 和 K203 首页做一次真机截图验收。
- 未执行 Git 暂存、提交、推送或分支操作。