为什么sketchcad文字宽度固定不变复制后宽度都变成固定了?

Sketch实用小技巧 - 推酷
Sketch实用小技巧
分享下自己工作中的使用sketch的小技巧,大家多多交流相互学习。
1:参照物对齐
我之前试了好久,也在网上找了好久,就是没有找到什么方法。当时想不会sketch没有做这么实用的功能吧。偶尔在翻墙的时候看到了一个国外大神的问答才看到答案。
具体方法:先选中要参考对齐的对象,按cmd+shift+L锁定它,之后再按shift键选中另外一个要对齐的对象。再按对齐功能就OK了。
PS:如果锁定的对象选择不了,可以有两种方法,第一:在左边的图层面板里选择,第二:在锁定的对象上右键&pick layer,选中锁定对象
2:对齐快捷键
个人认为,在sketch里设置对齐的快捷键是非常非常非常有必要的。我们做UI设计的时候最常用的就是对齐这个功能了。但如果每次在右上角点对齐功能,麻烦而且效率低下。但sketch又没有对齐的快捷键,那我们可以自己在mac的设置里自定义快捷键。
具体方法:系统偏好设置&键盘&快捷键&应用快捷键&&& 点击右边的加号&& 在应用程序里选择sketch。菜单标题写在sketch菜单相对应的快捷键。单词一定不要错。然后在键盘快捷键选项按下自己想设置的快捷键即可。
设置方法一个例子:左对齐
推荐设置快捷键:
Left: ctrl+A
Right:ctrl+D
Top:ctrl+W
Bottom:ctrl+S
Horizontally:ctrl+X
Vertically:ctrl+Y
很好记:平时玩游戏的话,左边的ASDW& 键正好是左/下/右/上
看个非常实用常用的例子:
3:快速选择组里的单个和多个元素
具体方法:按着cmd键+鼠标点击&&&&& &
连续选中多个组里的单元素:cmd键+shift键+鼠标点击&&& &
这个也非常实用,不用在那啪啪啪的双击双击了。
4:在路径的正中间添加锚点
具体方法:在编辑状态按着cmd键
5:图形和文字快速编辑
具体方法:选中要编辑的元素:按Enter
6:关于复制和粘帖
a:cmd+V复制到原位置。这个很简单就不演示了。
b:右键粘帖到这里
c:参考对象粘帖:cmd+shift+v
这个非常实用
d:快速复制元素格式:cmd+alt+c&&& cmd+alt+v
非常非常非常实用,
e:无格式粘帖:cmd+alt+shift+v
PS:d和e并不是sketch自带的特有功能,这个好像是mac自己有的功能,比如在备忘录里也可以用这个两个功能
7:在sketch里做渐隐效果
先做一个mask,然后选中mask层,菜单Layer & Mask Mode & Alpha Mask,然后在右边的填充面板里选择渐变,选中渐变的一端,在透明度那里根据需要调整参数。
8:路径切割
具体方法:在路径编辑状态下,& Layer & Paths & Scissors
9:小数的调整
具体方法:按着alt键的同时,点数字右边的上下调整箭头即可调整小数
10:用快捷键调整元素的大小
具体方法:选中元素之后,按住cmd键+上/下/左/右方向键& 可以1px的增加和减小,如果想10px增加,再同时按着shift键就OK。
ps:画板也是可以这样调哦
具体方法: 直接在数值框的数字后面输入+、-、*、/&& 即可实现运算。
12:选择全部画板&
具体方法:cmd+shift+A
已发表评论数()
请填写推刊名
描述不能大于100个字符!
权限设置: 公开
仅自己可见
正文不准确
标题不准确
排版有问题
主题不准确
没有分页内容
图片无法显示
视频无法显示
与原文不一致【小技巧如何让Sketch】输出一个固定大小的切图 - 图翼网() - 优秀UI设计师互动平台
【小技巧如何让Sketch】输出一个固定大小的切图
作者: 一筐猪_Ykz&&/&&06-07&&/&&&由于智商水平文化程度有限,不能像那些大牛一样写“教程”只能提供一点自己的思路参考,么么哒14 设计元素分类:
微信扫码抢海量福利文本-Sketch中文手册
文本Sketch 使用操作系统原生的字体渲染,因此文本看起来都会很棒。使用原生字体渲染的好处就是当你进行网页设计时,你可以肯定作品中的文本都是精准的。Sketch 同时支持文本样式,所以你可以让多个文本图层使用共同的字体,大小,和字间距等等。&添加文本&你可以从工具栏中选择文本工具。当光标变成文本光标时,在画布中任一点单击以添加文本图层。你会看见新的文本图层已被选定,直接开始打字吧。&你也可以单击并拖动鼠标以创造一个固定尺寸的文本框,当文本内容大于文本框时,会自动向下扩展文本框长度。而普通的不固定尺寸的文本框则会向后扩展宽度以适应文本内容。改变文本大小&如果你直接拖拽文本框,文字本身的大小并不会相应改变,但是你可以拉动文本框底部的缩放手柄来一起控制文本框和文字的大小。
& &文本检查器当你选中了一段文本,你会发现检查器随之变成了编辑文本所需要的属性。&在基本的图层属性下面是共享文本式样的区域。&接着是选择字体和字号的地方,同时你可以展开 T 按钮,来选择一些文字装饰,比如下划线。再下面则可以选择字间距,行间距和段落间距。
& &文本颜色&编辑文本时,你可以通过 T 按钮和字号中间的颜色按钮为文本设置单独的颜色。你也可以为文本设置一个通用的填充式样,比如渐变,但是任何填充都将针对整个文本图层,这将覆盖刚才那个颜色按钮的设置。&值得注意的是,为了在文本上渲染渐变效果,我们得将文本转化为矢量图形,并失去文本的子像素抗锯齿效果。自动大小文本框 VS 固定大小文本框&文本框的宽度属性(在对齐功能的下面)可以被设置为自动或者固定。自动大小文本框意味着它会自动扩展以容纳你输入的一切文本。固定大小文本框则会在你输入更多内容时保持现有宽度不变,而增加文本框的长度。
& &文本渲染Sketch 使用操作系统原生的字体渲染,因此文本看起来都会很棒。使用原生字体渲染的好处就是当你进行网页设计时,你可以肯定作品中的文本都是精准的。&Mac OS 系统使用了一种叫子像素抗锯齿效果 (subpixel-antialiasing)的技术来提升文本渲染效果,Sketch 里也是采用的这一种。但有时会出现一些问题警告,我们从一些底层技术来慢慢解释。子像素抗锯齿技术&一个电脑的显示器是由网格状的像素组成的。文字渲染遇到的问题是普通的屏幕里并没有足够多的像素来精确的展现文字的曲线。这就需要用到子像素抗锯齿技术了,它会将那些被文字曲线遮住一部分的像素稍稍变亮一些,并且在视觉上产生更平滑的效果。&这就是为什么当你在像素模式中把文本放很大观察时,你会看见文字旁边有一些蓝色和棕色的小色块,但是在正常大小时,这些文字效果又没有任何问题。Windows 用户对这种子像素抗锯齿技术不太习惯,他们总是将 Mac 的文字渲染形容成 “很胖”。
& &无法实现抗锯齿时&顺利实现子像素抗锯齿效果,文本必需出现在一个不透明的(有色的)背景上,因为系统需要知道最终的颜色对比结果是什么样的。这一点与图层混合模式是相冲突的。&要实现图层混合模式,Sketch 需要在一个透明背景上渲染所有的图层,这样这些图层才能像你所期望的那样混合在一起,最终结果再渲染回 Sketch 的白色画布上。&这就会带给我们一个问题,如果没有一个不透明背景我们就不能渲染抗锯齿的文字,但是有了不透明的背景我们又不能渲染图层的混合模式了。
这就意味着,一旦你的画布中出现了一个有混合模式的图层,Sketch 就不得不运用透明背景的算法,而无法给文字实现子像素抗锯齿效果了。&你可以尝试对比一下,将一段文本放在不透明背景上(比如填充颜色或者填充了图片的图形)来看看效果。
& &导出&另一个关于子像素抗锯齿效果的问题出现在导出上。在画布上,Sketch 可以顺利的渲染有色背景上的文本。但当你将文本导出为 PNG 文件,并保持背景透明,你便会发现文本变得不太一样——因为背景是透明的,我们无法在透明背景下渲染子像素抗锯齿效果。&和之前说的混合模式一样,你也可以尝试对比一下,将一段文本放在不透明背景上(比如填充颜色或者填充了图片的图形)来看看效果。为 iOS 设计&苹果最初发布 iPhone
时,他们决定不用子像素抗锯齿技术来渲染手机上的文字,原因是显示器上的像素都是由红绿蓝的光形成的,而 iPhone
是可以横屏竖屏切换的,也就是说这些本来垂直排列的红绿蓝像素会突然水平排列,这样一来,整个子像素抗锯齿技术就崩溃了。苹果可以保持竖屏时候的文字渲
染,放弃掉横屏的情况,但他们理智的决定保持竖屏与横屏的体验一致。&所以每当你在为 iPhone 或者 iPad 设计交互页面,你都需要记住这一点:在画布上,Sketch 会帮你对文字进行子像素抗锯齿渲染,但在移动设备上,文字并不会被这样处理。你需要告诉 Sketch 无需进行子像素抗锯齿渲染,通过 Sketch & Preferences & General, 取消选择 subpixel-antialiasing。共享式样你会经常想将多个文本设置为同一式样,共享式样能实现这一点,他们会将你分散在不同图层中的文本都保持同步。&值得注意的是,文本式样只能在一个文件中共享,一个文件中的不同页面不同画板都能够使用。创建式样&想要创建新的文本式样,你需要先选中一个文本框,然后进入 图层 & 创建共享式样 (Layer & create Shared Style),你会发现检查器立即显示出了当前图层的文本式样,你也可以在这里给式样重命名。&如果文本属性发生任何改变,都会自动与其他使用同一式样的文本保持同步。
& &新的文本图层&你可以和往常一样添加第二个文本图层,然后在检查器中给这个文本使用之前创建好的式样。另一个直接添加特定式样文本图层的方法是,进入&添加 & 式样文本 (Insert & Styled Text),然后选择你想要的式样,接下来的步骤和添加正常的文本图层则是一样的了。&注意:在Sketch 2 中我们就已经有了文本共享式样的功能,在Sketch 3中又进一步升级了。最大的变化就是,现在渐变填充,阴影和内阴影都能包含在文本式样当中了。
& &Sketch支持文本渲染路径,比如右边这样:&我们只需要两个东西来实现这个效果:一个矢量图形和一个文本图层。当你进入顶端的 编辑菜单 & 文本路径 (Edit & Text on Path),Sketch会帮你把文本图层贴合的放在它下一层的矢量图形上面。值得注意的是,两者的顺序必须是矢量图形在文本图层的下面,才能得到这样的效果。&放置文本图层时你只需将文本横向拖至矢量图形,这点很难用文字表述,但你可以在创作中非常直观的看到他们如何实现。文本路径
& &文本转化为轮廓文本也都可以被转换成矢量图形,你可以执行 文本 & 将文本转换为轮廓 (Type & Covert Text to Outlines) 的命令来实现。这会将文本中的每个字母都变成图形,你可以向编辑任何其他图形一样单独编辑每一个路径和锚点。&警告&但是,请额外留心这个操作。不要将很长一段文字都转化为矢量图形,这回大大减缓文件的运行速度。&将一小段文字转化为大量包含布尔运算的子路径是非常非常消耗系统内存的,如果你不得不转换一段文字,那么你可以先将一段文字尽可能分成多个短文本,然后再一个个的转化为矢量。&不过既然你现在可以直接在文本上运用渐变等效果,大多数时候你都不会需要将文本转化为轮廓。}

我要回帖

更多关于 sketch 复制 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信