点九图工具官方用户指南

点九图工具官方用户指南_第1张图片

介绍

此文主要内容来自android开发者官方用户指南,我注解了一些令人费解的部分,删除了无用内容,同时也补充了一些内容。点击文章最下方的“阅读原文”可以查看原始内容,点不开我没办法 :-)。

指南-使用步骤

Draw 9-patch 工具是 Android Studio 中包含的一种 WYSIWYG(所见即所得)编辑器,利用此工具,您可以创建能够自动调整大小以适应视图内容和屏幕尺寸的位图图像。图像的选定部分可以根据图像内绘制的指示器在水平或竖直方向上调整比例。

点九图工具官方用户指南_第2张图片

工具使用的步骤:

1.在 Android Studio 中,右键点击您想要用来创建 NinePatch 图像的 PNG 图像,然后点击 Create 9-patch file。(大家在公众号回复“点九图”下载后直接双击打开就行了)

2.在最边缘1像素周长的范围内点击,以绘制定义可拉伸配线和内容区域(可选)的线条。点击右键(在 Mac 上为按住 Shift 点击)可以擦除之前绘制的线条。

3.完成后,点击 File > Save 保存您的更改。

要确保您的NinePatch图形正确缩小,请验证任意可拉伸区域的尺寸是否至少为2x2像素。否则,它们可能会在缩小时消失。另外,也要在可拉伸区域前后各额外提供1像素的安全空间,以避免比例调整期间发生内插,从而可能导致边界处的颜色发生变化。

官注:正常的 PNG 文件 (*.png) 加载时会在图像周围添加 1 像素的空边界,您可以在其中绘制可拉伸配线和内容区域。之前保存的 NinePatch 文件 (*.9.png) 将按原样加载,不会添加绘制区域,因为此区域已经存在。

哈哈,使用步骤完了,官方指导就是这么简单。所以需要我再补充几点使用技巧,此外感谢每个关注者和打赏的人,半年不更新一次,粉丝数居然也涨了500。

技巧1:公众号内提供的版本较新,已经支持拖拽各类配置线。拖拽虽然方便,但无法进行“多段拉伸”。刚才官方指导中提到的“边缘1像素内点击绘制配置线”的方法新版依然支持,而且可以画出多个拉伸段。再处理此类情况时,非常好用。

点九图工具官方用户指南_第3张图片

技巧2:有同学提问:怎么设置“光学边界线”?答案在界面顶部米黄色的提醒条里,我来翻译一下:

按住shift键来擦除像素,按住control键来绘制光学边界线。

需要注意,这两个组合键只能同“绘制装配线”的方法一起使用,使用“拖拽装配线”的方法则无效;此外绘制光学边界的组合键,即便在Mac上也是control,惊喜不惊喜?!

指南-界面功能解释

下面展示了一个显示内容、配线和不良配线的 NinePatch 图像。

点九图工具官方用户指南_第4张图片

可选控件包括:

Zoom:调整图形在绘制区域中的缩放级别。

Patch scale:调整图像在预览区域中的比例。

Show lock:当鼠标悬停在图形的不可绘制区域上时显示禁止绘制蒙层。

Show patches:在绘制区域中预览可拉伸配线(紫色为可拉伸配线),如上图所示。

Show content:突出显示预览图像中的内容区域(紫色为允许内容的区域),如上图所示。

Show bad patches:在拉伸时可能会在图形中产生伪影的配线区域周围添加红色边界,如上图所示。如果您消除所有不良配线,已拉伸图像的视觉连贯性将得以保持。

关于最后的“Show bad patches”的介绍,反正我是看不懂。说一下我的理解:bad patches直译为不良拉伸区域,说人话就是:不要拉伸有内容的区域,比如不能拉伸中间文字区域:

点九图工具官方用户指南_第5张图片


这么简单的小工具,android的工程师还搞了内容识别,意外不意外?!

结束

最后,大家可以阅读下面的文章,了解更多点九图的知识。

相关阅读

点九图完全解析 <附官方工具>

你可能感兴趣的:(点九图工具官方用户指南)