d93d695d51
- 在 Images.xcassets 中创建三个新的 Image Set： * shareWechat.imageset - 微信分享按钮图标 * shareQQ.imageset - QQ分享按钮图标 * shareDouyin.imageset - 抖音分享按钮图标 - 为每个 Image Set 配置 Contents.json，支持 @1x/@2x/@3x 多倍率 - 增强 SharePanel.m 按钮样式设置，添加可选的边框和阴影效果 - 添加详细的图片添加指南文档： * images_xcassets_guide.md - Images.xcassets 使用指南 * share_button_guide.md - 分享按钮设计规范 图片规格：60×60pt (@1x), 120×120pt (@2x), 180×180pt (@3x) 支持圆形按钮设计，代码自动处理圆角效果
36 lines
828 B
Markdown
36 lines
828 B
Markdown
# 分享按钮图片制作指南
|
||
|
||
## 快速制作方法
|
||
|
||
### 1. 使用在线工具
|
||
- **Canva**: 创建60×60px圆形图标
|
||
- **Figma**: 设计矢量图标，导出多倍率PNG
|
||
|
||
### 2. 设计规范
|
||
```
|
||
尺寸: 60×60pt (多倍率: @1x, @2x, @3x)
|
||
形状: 正圆形（代码自动处理圆角）
|
||
背景: 品牌色 + 白色logo
|
||
边距: 图标留8-12px内边距
|
||
```
|
||
|
||
### 3. 颜色规范
|
||
```css
|
||
微信: #07C160
|
||
QQ: #12B7F5
|
||
抖音: #FE2C55
|
||
```
|
||
|
||
### 4. 添加步骤
|
||
1. 制作三套图片（每套包含@1x/@2x/@3x）
|
||
2. 在Xcode中打开Images.xcassets
|
||
3. 创建新的Image Set: shareWechat, shareQQ, shareDouyin
|
||
4. 拖入对应倍率的图片
|
||
5. 编译运行查看效果
|
||
|
||
### 5. 测试检查
|
||
- [ ] 图片清晰度（特别是@3x高分辨率设备）
|
||
- [ ] 圆角效果正常
|
||
- [ ] 色彩还原准确
|
||
- [ ] 点击区域响应正常
|