如何使用sketch绘制app界面返回按钮？
最新回答
岁月无忧
2020-06-16 22:27:31
使用Sketch绘制App界面返回按钮的步骤如下：
1. 新建文件打开Sketch软件，点击“新建文件”进入设计界面。
2. 绘制基础矩形
- 按键盘【R】键选择矩形工具，在画布上绘制一个正方形。
- 设置尺寸为24x24像素（2倍图为48x48像素），适配导航栏按钮大小。
- 若设计界面尺寸为375x667，可参考绘制48x48的导航栏区域。
3. 创建羡码Symbol元件
- 选中矩形，右键选择“Create Symbol”（或点击顶部工具栏的“Create Symbol”按钮）。
- 将按钮转换为元件，便于后续复用和修改。
4. 命名元件
- 双击Symbol名称，输入规范命名（如icon/back），需与前端开发人员协商统一命名规则。
5. 编辑Symbol内部图形
- 双击兄芹哪Symbol进入编辑模式，隐藏原矩形（取消勾选图层可见性）。
- 使用钢笔工具（V）绘制“<”形状：
开启“对齐网格”功能（菜单栏View > Canvas > Show Grid），确保线条对齐。
依次点击三个点形成箭头，调整节点位置使形状对称。
6. 调整样式
- 设置线条颜色（如白色或深色，根据背景调整）首判。
- 调整线条宽度（建议2-4像素，确保清晰可见）。
- 完成后点击左上角“返回”退出编辑模式。
7. 应用返回按钮
- 返回主页面（Page 1），将Symbol拖入导航栏位置。
- 可进一步添加其他界面元素（如标题、状态栏等）。
关键提示
- 使用Symbol可统一管理按钮状态（如正常、点击、禁用）。
- 复杂返回图标可结合布尔运算（Union/Subtract）或导入SVG文件优化细节。
- 导出时选择Symbol图层，右键“Export”生成PNG或SVG格式切图。
热门标签
