UI规范目的：
- 保证 APP 中各个页面间的显示效果统一；
- UI规范化后，允许 APP 中抽取
样式资源文件，便于App的开发； - 后续有显示效果调整需求时，可统一调整，减少工作量，提高工作效率;
基本样式的制定
文本样式规范
| 样式序号 | 字号 | 颜色 | RBG | 粗体（是否） |
|---|---|---|---|---|
| f40_01 | #40 | #1a1a1a | 26 26 26 | 常规 |
| f40_02 | #40 | #1a1a1a | 26 26 26 | 粗体 |
| f40_03 | #40 | #a7a7a7 | 167 167 167 | 常规 |
| f36_01 | #36 | #1a1a1a | 26 26 26 | 常规 |
| f36_02 | #36 | #a7a7a7 | 167 167 167 | 常规 |
| f36_03 | #36 | #a7a7a7 | 255 255 255 | 常规 |
| f36_04 | #36 | #3d94ea | 61 148 234 | 常规 |
| f32_01 | #32 | #1a1a1a | 26 26 26 | 常规 |
| f32_02 | #32 | #1a1a1a | 26 26 26 | 粗体 |
| f32_03 | #32 | #808080 | 128 128 128 | 常规 |
| f32_04 | #32 | #a7a7a7 | 167 167 167 | 常规 |
| f32_05 | #32 | #3d94ea | 61 148 234 | 常规 |
| f32_06 | #32 | #f25555 | 242 85 85 | 常规 |
| f32_07 | #32 | #1ec859 | 30 200 89 | 常规 |
| f30_01 | #30 | #1a1a1a | 26 26 26 | 常规 |
| f30_02 | #30 | #a7a7a7 | 167 167 167 | 常规 |
| f28_01 | #28 | #1a1a1a | 26 26 26 | 常规 |
| f28_02 | #28 | #a7a7a7 | 167 167 167 | 常规 |
| f28_03 | #28 | #3d94ea | 61 148 234 | 常规 |
| f28_04 | #28 | #1ec859 | 30 200 89 | 常规 |
| f24_01 | #24 | #1a1a1a | 26 26 26 | 常规 |
| f24_02 | #24 | #a7a7a7 | 167 167 167 | 常规 |
| f24_03 | #24 | #3d94ea | 61 148 234 | 常规 |
按钮样式规范
| 按钮样式 | b01_01 | b01_02 | b01_03 |
|---|---|---|---|
| 按钮类型 | 主按钮 | 主按钮 | 主辅助按钮 |
| 按钮尺寸 | 高：80px 宽：match_parent 左右边距：30px 上下边距：20px | 高：80px 宽：match_parent 左右边距：30px 上下边距：20px | 高：80px 宽：match_parent 左右边距：30px 上下边距：20px |
| 圆角 | 10px | 10px | 10px |
| 字体颜色 | #ffffff | #ffffff | #1a1a1a |
| 按钮背景 | #3d94ea | #f25555 | #ffffff |
| 二态字体颜色 | #2b67a3 | #a93b3b | #cccccc |
| 不可点字体颜色 | #2b67a3 | #a7a7a7 | #a7a7a7a |
| 不可点背景颜色 | #cccccc | #cccccc | #cccccc |
| 描边尺寸 | 2px | ||
| 描边颜色 | #1a1a1a | ||
| 不可点描边颜色 | #a7a7a7 | ||
| 用途 | 优先级最高，强行动引导 | 优先级最高，强行动引导（金融） | 优先级低于蓝色/红色主按钮 |
后续随版本迭代以及样式的更新进行补充中！
网友评论