Android-NinePatch PNG文件(点九图)的使用

ImageView中XML属性src和background的区别:

background会根据ImageView组件给定的长宽进行拉伸,而src就存放的是原图的大小,不会进行拉伸。src是图片内容(前景),bg是背景,可以同时使用。

此外:scaleType只对src起作用;bg可设置透明度,比如在ImageButton中就可以用android:scaleType控制图片的缩放方式

NinePatch PNG

简介:

“*.9.png”文件一般被用来作为背景文件,它具有实现部分拉伸的功能。其实从名字一看很明了,这种PNG文件是分为9个区域,即九宫格的形式,其中只有中间交叉的区域会产生作用,而边角上的4解则是固定不变的。

实战解析:

原图:

Android-NinePatch PNG文件(点九图)的使用_第1张图片

Android-NinePatch PNG文件(点九图)的使用_第2张图片

布局及效果:

Android-NinePatch PNG文件(点九图)的使用_第3张图片

发现图片被拉伸。

1、我们可以在sdk/tools找到draw9patch.bat双击打开我们的制作工具。

Android-NinePatch PNG文件(点九图)的使用_第4张图片

打开后如图:

Android-NinePatch PNG文件(点九图)的使用_第5张图片

2、点击 file —> open 9-patch 打开要制作的PNG图片

Android-NinePatch PNG文件(点九图)的使用_第6张图片

3、拖动边界上的线控制区域:
图片的四个边框绘制一个个小黑点,上边框和左边框的部分表示当图片需要拉伸时就拉伸黑点标记的区域,下边框和右边框绘制的部分则表示内容会被放置的区域。

Android-NinePatch PNG文件(点九图)的使用_第7张图片

注意:
上下左右各1像素的边界标识,其中上和左是必须的,用于指定交叉区域为重复拉伸时用到的填充色,而下和右则是可选的,当存在时,则会在其交叉位置填充前景内容,其他区域作为padding区域,即内边距。

看右边的预览图:

Android-NinePatch PNG文件(点九图)的使用_第8张图片

第一张为:纵向拉伸
第二张为:横向拉伸
第三张为:横纵向同时拉伸

4、修改完成编辑后保存即可,保存后的格式为*.9.png。(必须把PNG改为.9.PNG才有效)

再次导入项目中,看效果:适配了各种机型。

Android-NinePatch PNG文件(点九图)的使用_第9张图片

总结:

制作点九图需要:
1、原图为:四条边都有一个像素的PNG图片(点九图依然可重新设置区域)
2、修改名称”.PNG”为”.9.PNG”
3、拖动四条边的线控制区域:设置可拉伸和可放置内容的区域(在Android studio中也可做修改)

Android-NinePatch PNG文件(点九图)的使用_第10张图片

你可能感兴趣的:(图片)