美文网首页Sketch
Sketch辅助工具:标尺/网格/布局/像素

Sketch辅助工具:标尺/网格/布局/像素

作者: 追光柚子 | 来源:发表于2020-07-17 13:24 被阅读0次

常用辅助工具

辅助工具

标尺

标尺:ctrl+R,显示或隐藏标尺。

通过在标尺上移动点击,得出横向或纵向的参考线。

标尺参考线

将鼠标移入标尺中的参考线上点击右键,可以删除参考线。

删除参考线

或在标尺区域拖动参考线到左上角小锁位置,出现叉的图标后松开鼠标即可。

拖动删除参考线

网格

网格:ctrl+G,显示或隐藏网格。

显示网格

网格也是一种格子状的参考线,让我们再绘制图形时能更好的判断图形的大小等。

圆的大小

可以在标尺上点击右键-网格设置,或者在菜单-视图-画布-网格设置,打开设置面板

设置面板

网格尺寸:多少像素一个格子;

粗线每隔:每多少个格子用粗线划分一下;

暗:是指粗线;

亮:是指格子线;

注意:每次的网格设置,只作用于选中的页面或画板。

布局

又称栅格化设计,ctrl+L显示或隐藏布局,或者在菜单-视图-画布-布局设置,打开设置面板。

设置面板

总宽:相当于容器,是设计可见区域的总宽度;

偏置:表示栅格的起始位置;

列数:表示栅格的数量;

外围间距:取消勾选,栅格的宽度才是总宽;

间距宽度:槽的值,通常是定值;

列宽:栅格内单个可放置内容区的宽度;

名词解释

像素

ctrl+P显示或隐藏像素,或者在菜单-视图-画布-缩放时显示像素。

隐藏像素时,放大画布,可以看到图像边缘是平滑的。

隐藏像素时

显示像素时,放大画布,可以看到图像边缘出现锯齿。

显示像素时

相关文章

  • Sketch辅助工具:标尺/网格/布局/像素

    常用辅助工具 标尺 标尺:ctrl+R,显示或隐藏标尺。 通过在标尺上移动点击,得出横向或纵向的参考线。 将鼠标移...

  • 我的PS学习之路(3)—表盘绘制

    一、新建画布,设好标尺和网格 1.新建画布:设置宽度:800像素,高度:600像素;分辨率72像素/英寸,RGB格...

  • 标尺、网格和参考线,photoshop零基础学PS教程

    标尺、网格和参考线是Photoshop 中的辅助工具,通过这些工具,可以方便地对图像进行准确的编辑。 一、标尺的显...

  • 九宫格拖拽

    效果实例 简单了解Grid布局(网格布局) 什么是网格布局 CSS网格布局(又称“网格”),是一种二维网格布局系统...

  • 九宫格拖拽

    效果实例 简单了解Grid布局(网格布局) 什么是网格布局 CSS网格布局(又称“网格”),是一种二维网格布局系统...

  • flex布局的几种典型布局方式

    flex布局的典型布局方式有哪些? 网格布局 固定底栏布局 圣杯布局 输入框布局 悬挂布局 网格布局 最简单的网格...

  • 布局-网格布局

    1.网格布局概述 网格布局就是多行的弹性布局。与弹性布局不同,网格布局的行默认是自动换行,而不是挤压的。网格布局中...

  • Recyclerview GridLayout分隔间距

    RecyclerView 支持网格布局,我们使用GridLayoutManager来设置为网格布局,在使用网格布局...

  • AI知识点-标尺与对齐

    标尺和参考线 调出和隐藏标尺快捷键:cmd+R; 在标尺上点击右键,选择标尺的单位,应用于屏幕的文件选择“像素”。...

  • 布局

    CSS网格布局引入了二维网格布局系统,可用于布局页面主要的区域布局或小型组件。本文介绍了CSS网格布局 与 CSS...

网友评论

    本文标题:Sketch辅助工具:标尺/网格/布局/像素

    本文链接:https://www.haomeiwen.com/subject/mvvdhktx.html