内容字号:默认大号超大号

段落设置:段首缩进取消段首缩进

字体设置:切换到微软雅黑切换到宋体

适配不同尺寸屏幕 自动拉伸位图9.图片的使用处理

2018-03-06 11:01 出处:清屏网 人气: 评论(0

最近实在是太忙了,刚过完年,我还是坚持了那颗平静的心情,尽管技术博客现在很少人看了,洗脑文鸡汤文总是那么的惹人喜爱,我深信仍有一部分人和于哥一样,坚守在第一岗位,今天技术文继续撸起!

正文

前几节讲了关于适配屏幕尺寸一些常用的方法,除了weight和相对布局之外,关于图片的话,我们还应该学会图片的自动拉缩——.9图片的使用

什么四.9.png格式图片

.9.png格式的图片本身就是.png格式图片,不过该图片以.9作为文件名的后缀。我们可以将一个.png图片转换成.9.png图片,.9.png图片比正常的.png图片在图片最外围的四边多了1px边框,我们可以在这最外层的1px边框上定义图片的可拉伸区域以及图片的内容区域。

.9的制作,实际上就是在原图片上添加1px的边界,然后按照我们的需求,把对应的位置设置成黑色线,系统就会根据我们的实际需求进行拉伸。

为什么要使用.9图片

支持各种屏幕尺寸通常意味着图片资源还必须能适应各种尺寸。例如,无论要应用到什么形状的按钮上,按钮背景都必须能适应。

如果在可以更改尺寸的组件上使用了简单的图片,您很快就会发现显示效果多少有些不太理想,因为系统会在运行时平均地拉伸或收缩您的图片。解决方法为使用自动拉伸位图,这是一种格式特殊的 PNG 文件,其中会指明可以拉伸以及不可以拉伸的区域。

举个例子

下图是对.9图的四边的含义的解释,左上边代表拉伸区域,右下边代表paddingbox,就是间隔区域,在下面,我们给出一个例子,方便大家理解。

.9patch 使用额语法规则

1、上面黑线或者点表示纵向可拉伸的区域 一般一个点即可

2、左边黑线或者点表示横向可拉伸的区域 一般一个点即可

3、下面表示纵向填放内容的区域  一般是一条黑线

4、右边表示横向填放内容的区域  一般是一条黑线

即:左上边代表拉伸区域,右下边代表paddingbox

使用Draw9patch工具,打开一张图片,在不做任何伸缩处理的情况下其在分别在宽、高、以及宽高同时缩放时的显示效果,如图一:

1、未作处理

2、使高拉伸,我们现在左边边框箭头上半部分点一点

3、拉伸指定部分区域的高度

4、横向。属性都拉伸

工具

1、如果使用的Eclipse,则可以在sdk中找到Draw9patch文件,位置存在:tools 文件夹下

2、如果使用的是AndroidStudio,则直接可以重命名一下,双击进入到编辑界面可进行patch

分享给小伙伴们:
本文标签: HTML屏幕适配

相关文章

发表评论愿您的每句评论,都能给大家的生活添色彩,带来共鸣,带来思索,带来快乐。

CopyRight © 2015-2016 QingPingShan.com , All Rights Reserved.

清屏网 版权所有 豫ICP备15026204号