热搜词
Sketch一键搞适配全系屏幕尺寸插件Auto-layout


提取码:




Sketch一键搞适配全系屏幕尺寸插件Auto-layout


有时我们需要一种方法来定义和查看设计在所有屏幕尺寸下的显示效果,而不仅仅是 iPhone 7,开玩笑?用 Auto Layout 统统一键搞定


安装


  • 下载安装包

  • 双击 AutoLayoutPlugin.sketchplugin 完成安装


使用


在 Sketch 界面属性检查器的最下方找到 Auto Layout 的面板(默认安装插件后开启,如果未开启可执行 Plugins > Auto Layout > Show/Hide Panel 或执行快捷键 control ⌃ + A 来开启)点击面板上的按钮可单独查看某一屏幕下的适配效果 


Sketch一键搞适配全系屏幕尺寸插件Auto-layout


执行 Plugins > Auto Layout > Generate Screen Sizes Overview 可一键查看所有设备尺寸下的适配效果 


Sketch一键搞适配全系屏幕尺寸插件Auto-layout


需要注意的是:设定好每个图层的约束,使用 Pin 右侧第一个控件设定,上下左右各有一个点,选中为保持该图层距离画板边缘的距离 


Sketch一键搞适配全系屏幕尺寸插件Auto-layout


更加细致的约束条件,可点击 More 按钮展开详细的配置进行控制  


Sketch一键搞适配全系屏幕尺寸插件Auto-layoutSketch一键搞适配全系屏幕尺寸插件Auto-layout




关注微信公众号图翼(tuyiyi_com),定时推送,福利互动精彩多多