在实际安卓项目中我们一般都会用到 .9.png 图片来实现一些 UI 效果,笔者主要在这里简单记录下 AS 自带 .9 图片编辑工具使用上的一个小坑。
当下我的项目里要用到一张这样的 .9.png 图片:

看到这张图片不要困惑,并不是你的浏览器没加载出来,它就长这样,我把它放项目里就是当占位图用的!
接下来我把它放到项目的 drawable 目录里,然后从 AS(3.1.1) 里打开并切换到 9-Patch 编辑窗口:

嗯看起一切正常的样子,注意从 .9 图片编辑工具里打开这张图片的时候图片四周已经被自动加上了黑色像素边。这时候我开始着手编辑这张 .9 图片四周的黑边,发现这四条黑边在这里竟然是编辑不了的……这特么就很尴尬了……
难道要我跑 PS 里去编辑?对于不怎么会玩 PS 的程序员来说感觉有点麻烦啊……
好我就不卖关子了,下面演示我自己研究出来的 .9 图片在 AS 里不可编辑的解决方法。
好吧最终图片还是要先放 PS 里处理一下的!
首先,把原图从 PS 里打开:

注意这时候我当前图像的背景图层有个小锁,这里要把这个锁去掉!怎么去我就不细说了
ok,然后,打开 图像 ->画布大小:

调整下当前图层的画布,我们要的效果是四个方向各向外扩展一个像素且像素值保持默认(透明像素),这里宽高各填2就可以了,然后确定。
这时候我们当前图像的边缘已经有一圈透明像素了:

ok这时候把这张图片放到 AS 里并将之前那张编辑不了黑边的图片给覆盖掉,然后再从 .9 图片编辑窗口里打开这张经过 ps 的图片:

已经可以自由编辑图片四周的黑边了~
完。
网友评论