android适配时 sketch的切图和标注
北京/UI设计师/8年前/2394浏览
版权
android适配时 sketch的切图和标注
sketch的切图和标注的fang fa
sketch在切图和标注因为插件sketch measure相比较ps来说简单方便多了,如果你的页面有很多icon,每个icon的实际尺寸不一样,而你切图的时候想输出的是icon的安全尺寸并非实际尺寸,此时如果用sketch measure切图和标注的时候只会自动识别出实际距离切图和标注,这样的话切图标注会有点糙,如果你想标注和标注规范点的话,可能还需要手动的设置。
下面我来说下自己在切图适配时的方法,这个方法可能不是最快捷的,但是能保证切图适配时比较规范,如果你有更好的方法,欢迎你留言,将不胜感激。
以个人中心页(720*1280)为基础进行讲解:![]()

如上图所示 使用sketch的插件标注的时候标注的是icon的实际尺寸, 虽然程序员可以定义一个尺寸然后使用居中对齐的标签,但是我们在切图的时候为何不直接切出安全区域尺寸的icon呢,这样可以让程序的代码更简洁。
切出安全区域icon尺寸 首先需要我们对同类型的icon设置一个安全区域的尺寸,然后再针对每个icon画出安全区域大小的矩形 透明度调整为0,重命名为icon的名字eg


针对刚刚设置透明度为0 重命名是icon名字的矩形建立切片

所有的图标都按照这种方式进行处理。
整套视觉图设计完成之后,用sketch measure 进行一键切图标注。

最后再把根据后缀是xhdpi xxhdpi xxxhdpi 分别放到相应的文件夹中。
11
Report
声明
14
Share
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
You may like
Log in
11Log in and synchronize recommended records
14Log in and add to My Favorites
评论Log in and comment your thoughts
分享Share




































![AIGC助力电商视觉×头盔系列AI生成 [动态化探索实践]](https://img.zcool.cn/community/68e8da720067cv09d9quve1777.png?x-oss-process=image/resize,m_fill,w_520,h_390,limit_1/auto-orient,1/sharpen,100/quality,q_80)
