Sketch 自带的排版功能已经远远不够用了, 所以推荐给大家一个自动排版的插件: Paddy. 可调整间距, 边距, 对齐等.
一, 阅读准备和核心流程
插件官网: GitHub - Paddy https://github.com/DWilliames/paddy-sketch-plugin
相关下载: 插件 https://pan.baidu.com/s/11kmUSjMwA3CeUYj7MsKo-w | 演示文档 https://pan.baidu.com/s/1MYT3P7-ivJK5CTMyTrf5WA
掌握三个核心功能即可快速上手, 笔者在这里以一张简单表格的制作为例子.
第一步: 设置边距
首先我们制作一个上下左右间距为 16px 的单元格. 只更改背景图层的名称, 在其原有名称后按格式添加参数即可完成边距的自动调整.
快捷键为: Control + Alt + p, 边距参数命名规则见下表:
有一点点 CSS 基础的同学可以很快掌握.
第二步: 设置间距
我们将错乱的单元格垂直间距调整为 0, 在原有组名称后面添加参数即可完成垂直或水平方向间距的自动调整.
快捷键为: Control + Alt + Command + p, 间距参数命名规则见下表:
注意二者不可同时存在.
第三步: 设置对齐
将调整好间距的单元格进行左对齐, 在添加间距参数的组名称后面添加对齐参数即可完成组内对象的自动对齐. 对齐参数命名规则见下表, 其中 l,c,r,t,m,b 分别是 left,center,right,top,middle,bottom 的首字母.
对齐参数既可以和间距参数复合使用, 也可以单独使用
当然, Paddy 还有很多其他实用的功能.
二, 其他功能
1. 忽略特定项
在边距参数中某项使用x可以让 Paddy 忽略对应边的边距自动调整.
在图层或组的名称前面添加-可以让 Paddy 在自动调整时忽略该对象.
2. 设置边界
可以在边距参数中使用>=,>, <, <=, =来设定边距的最大值, 最小值.
3. 支持 Symbol
来源: http://sc.chinaz.com/info/180523125027.htm