Android .9.png的由来和制作

来源:互联网 发布:js trim 编辑:程序博客网 时间:2024/06/09 23:50

    作为程序猿,相信你在开发的时候肯定会遇到这样的问题:用到的图片要适应布局的需要而进行拉伸,但是拉伸的效果会让原来很Nice的图片变得很模糊难看,这个问题对于开发者来说很头疼,还好谷歌为我们推出了.9.png格式的图片,那么.接下来就让我们来了解一下9.png。

    一:什么是9.png

    9.png格式的图片是安卓平台上新创的一种被拉伸却不失真东东,那么它与普通的png图片有什么不同呢:9.png图片它的四周与普通的png图片相比多了一个像素位的白色区域,该区域只有在图片被还原和制造的时候才能看到,当打包后无法看见,并且图片的总像素会缩小2个像素,比如23x23像素的9.png图片被打包后会变成21x21像素。所以我们在制作的时候要注意掌握尺寸。当我们制作出9.png图片的时候你还有惊奇的发现一个几KB或者几十KB的图片,变得非常的小,一般只有几百个字节那么大,系统加载起来当然会更加的流畅。

    二:.9图片的名称的由来

    图片被划分成9部分

   

    其实相当于把一张png图分成了9个部分(九宫格),分别为4个角,4条边,以及一个中间区域,4个角是不做拉升的,所以还能一直保持圆角的清晰状态,而2条水平边和垂直边分别只做水平和垂直拉伸,所以不会出现边会被拉粗的情况,只有中间用黑线指定的区域做拉伸。这样图片拉伸后是不会模糊的。

    三:.9png图片的制作

    相信你肯定有elipcse开发工具。.9图片的制作工具就在解压的sdk目录下tools:draw9patch,我的工具路径:/home/luyangjie/elipcse/adt-bundle-linux-x86_64-20131030/sdk/tools/draw9patch. 

    双击运行或者在终端中运行即可,运行后会出现下面一个弹出框:

    点击左上角的File,然后找到你要修改图片的路径,也可以按快捷键“Ctrl+O”或者找到自己要制作的图片然后直接拖进来。

     然后我们对图片进行编辑,在图片的边缘需要拉伸的地方单击鼠标左键,按住不要松手进行拖拽,就会出现一条黑色的线,这条黑色的线所对应的区域就是我们所要拉伸的区域,如果我们不小心拉错了,可以先按住Shift键,不要松手的同时再用鼠标单击拉错的地方就会把之前拉错的地方的黑线取消掉。黑色的线编辑完成后右边会有三个图形区域是显示当前拉伸效果。

         1号黑色条位置向下覆盖的区域表示图片横向拉伸时,只拉伸该区域
        2号黑色条位置向右覆盖的区域表示图片纵向拉伸时,只拉伸该区域  
        3号黑色条位置向左覆盖的区域表示图片纵向显示内容的区域
        4号黑色条位置向上覆盖的区域表示图片横向显示内容的区域 没有黑色

     一般我们在编辑的时候3和4黑色线条是全部选中的,只是在1和2中进行黑色线条的拉伸。

    编辑完之后,我们可以点击“file”菜单里面的“Save 9-patch...”选项菜单,也可以直接按快捷键“Ctrl+S”来保存,保存之后,便可以在我们保存的地方查看到我们编辑过的.9.png的图片。

    更多的Android系统开发,可以参考我的博客:LYJ的IT生活 

1 0