认识达内从这里开始

认真做教育专心促就业

贵阳达内UI设计培训UI设计师标注与切图技术学习应用方法分享

发布：贵阳达内培训
来源：互联网
时间：2022-06-13 09:53

随着互联网的不断发展，越来越多的人都在学习UI设计的相关技术知识等内容，而本文我们就通过案例分析来简单了解一下，UI设计师标注与切图技术学习应用方法分享。

贵阳达内UI设计培训UI设计师标注与切图技术学习应用方法分享

标注(适配)

相信很多设计师都知道做完视觉稿之后需要标注，但其中有不少仅对他所设计的这个尺寸进行标注，忽略了其他尺寸的机型。他们认为适配到其他机型是程序员的工作，与自己无关。其实这也不能怪他们，毕竟现在的培训班(无论是线下基础班还是线上提高班)对适配这一块的内容实在涉及甚少，导致给大家造成一个错觉——适配不重要。

那么适配到底重不重要呢?你可以决定你设计稿的尺寸，但你无法决定用户的屏幕尺寸，你要给用户看的是在各个不同屏幕尺寸下的界面，而不是你的设计稿。那么你是愿意每种尺寸都做一套图呢，还是愿意用适配去解决这个问题?相信大家都会选择后者。

等比缩放适用于间距不变，本身大小随屏幕变化而变化的元素;弹性控件适用于本身大小不变，间距随屏幕变化而变化的元素;文字流自适应则是一行所显示的文字个数随屏幕变化而变化。

了解了适配的重要性，并且也具备了一定的适配能力之后，我们就要开始动手做了。那么我们设计师不可能亲自上阵敲代码，我们要把我们的适配想法传递给程序员只能通过标注，标注时，谨记一点——不要标死。

切图

在开发资源紧张的情况下，可以将页面布局先行设计标注完成交与程序员进行开发，随后设计师再将剩下的切图补上。说到这儿可能又有小伙伴要问了，切图不是直接用设计软件就可以导出嘛，为什么会费时间呢?那是因为切得不严谨，或者说是偷懒了。

先来看一下大小，相同功能模块的图标切图大小要保持一致，比如同是tab栏或者同是金刚区的图标，切图忽大忽小可能对视觉上没什么影响，但对程序员来说就要多写好几行代码了。此外，切图的长宽尺寸必须是偶数，好是4或者8的倍数，因为要考虑倍率变化后(*1.5)有可能变成奇数，无法居中或等分的情况。

接着来看下命名，有一种命名方式相信大家在很多地方见过，模块_类别_名称_状态.png。但在实际应用中，仅保留名称和状态即可。因为程序员一般是分模块进行开发的，为了便于程序员找到相应模块的切图，我们会把切图按模块放在不同的文件夹中。因此，切图名称中的“模块”就显得多余了。同样，按模块分类后，一个模块下的切图也不会有很多，也就没必要区分“类别”了。

再来看下不同倍率下的切图，这也是容易疏忽的地方。带圆角的切图在倍率转换时，圆角也要相应增大，软件自动导出的圆角不会变化，所以需要重绘;@2x下如果是奇数像素宽的描边，软件自动导出@3x的时候会出现半像素的虚边，所以也需要重新绘制。综上所述，@2x转@3x并没有什么可行的快捷操作。

【免责声明】：本内容转载于网络，转载目的在于传递信息。文章内容为作者个人意见，本平台对文中陈述、观点保持中立，不对所包含内容的准确性、可靠性与完整性提供形式地保证。请读者仅作参考。更多内容请加danei0707学习了解。欢迎关注“达内在线”参与分销，赚更多好礼。

< 上一篇：贵阳达内IT培训Java编程死锁概念与产生条件分析

下一篇：贵阳达内IT培训JavaScript编程语言常见问题解析 >