美文网首页Android技术知识Android进阶之路android技术专栏
Android图片适配之——自定义控件RatioLayout

Android图片适配之——自定义控件RatioLayout

作者: 君华_Joshua | 来源:发表于2017-07-22 10:48 被阅读213次

Android图片适配之——自定义控件RatioLayout

排版不佳建议点击查看原文

在这个日新月异的年代,Android系统和android手机都在快速得发展和更新,于是出现了各种版本的安卓系统和各种配置(屏幕尺寸、屏幕密度、分辨率等)的安卓手机。当一个应用提供一个图片资源时,如果不采取一些措施,从视觉角度该图片就会在不同的手机上呈现不相同的效果。那么,都有哪些措施,这些措施是如何工作的呢?接下来是笔者对此问题的研究心得,希望对你有所帮助。

发现问题


开发中当我们对ImageView的高度写成固定值时候图片很可能出现图下情况,用户自然是不会接受的:

显然ImageView出现了左右两条白边,这个时候我们想到,如果高度写成包裹内容呢?

很遗憾依然不能解决问题,上下出现了白边!

解决方案


这个时候需要用到我们的自定义控件RatioLayout比例布局

我们新建了一个RatioLayout类继承了FrameLayout实现其三个构造方法,这个自定义控件的第一步。相信熟悉自定义控件的你早已谙熟于心。

接着我们创建了ints方法并且在三个构造方法中调用。ints方法主要需要完成一个任务:就是获取我们xml的自定义属性的值!没错,我们需要在布局文件中把我们需要加载的图片比例值通过自定义属性设置到RatioLayout中。这个时候你一定会问,图片的比例我怎么知道?

其实我们是通过计算获得:图片比例值=图片宽度/图片高度,最后得出的答案再四舍五入取小数点后3位即可。

此时成员变量attributeFloatValue便是我们获取的图片比例值。

接下来自然是自定义控件的第二步重写onMeasure方法测量布局:

在onMeasure方法里我们需要完成三个任务:

1.获取布局的宽度

2.根据布局的宽度和图片的比例值,计算出控件的高度

3.重新测量控件

onMeasure难点

1.MeasureSpec.getMode到底是什么意思呢?

我们知道在xml中设置布局宽高有两种模式:match_parent与wrap_content,其中MeasureSpec.getMode同样会返回两种度量模式,一种是MeasureSpec.AT_MOST未确认模式,另一种MeasureSpec.EXACTLY确认模式。如果xml中布局设置为match_parent则MeasureSpec.getMode便会返回MeasureSpec.EXACTLY,如果xml中布局设置为wrap_content则MeasureSpec.getMode便会返回MeasureSpec.AT_MOST。我们便可以得知布局的度量模式。

2.关于onMeasure方法中的两个参数widthMeasureSpec与heightMeasureSpec的理解:

onMeasure方法的作用是测量空间的大小,什么时候需要测量控件的大小呢?我们举个例子,我们烧一壶水,烧水的过程我们并不要求知道这壶水有多少分量,只有在水烧开了我们要拿个水壶盛放的时候,我们才需要掂量拿多大的水壶盛放,这时候我们就要对水的分量进行估测。

而我们的控件也正是如此,创建一个View(执行构造方法)的时候不需要测量控件的大小,只有将这个view放入一个容器(父控件)中的时候才需要测量,而这个测量方法就是父控件唤起调用的。当控件的父控件要放置该控件的时候,父控件会调用子控件的onMeasure方法询问子控件:“你有多大的尺寸,我要给你多大的地方才能容纳你?”,然后传入两个参数(widthMeasureSpec和heightMeasureSpec),这两个参数就是父控件告诉子控件可获得的空间以及关于这个空间的约束条件(好比我在思考需要多大的水壶装水的时候我要看一下柜子里最大的水壶有多大,水的分量不能超过这个容积,这就是水壶对水的约束),子控件拿着这些条件就能正确的测量自身的宽高了。

RatioLayout的使用

只要在RatioLayout中放入子控件ImageView便可,值得注意的是:                    1.RatioLayout的hight必须是wrap_content,因为固定的hight是不会根据比例决定布局高度的。

2.子控件ImageView必须match_parent填充布局。

3.自定义属性的使用:

在values文件夹下新建attrs.xml,声明了以上属性定义。

回到布局文件中在根布局定义属性字段:

xmlns:example="http://schemas.android.com/apk/res/com.example.weixing"

其中:example为需要定义的字段名,这里叫example。

最后的com.example.weixing为项目包名。

完成以上任务便可以在RatioLayout中使用自定义属性 example:ratio="图片的比例值"

在Activity中引入此Layout最终运行效果:

完美适配了图片,解决了不同的手机上屏幕图片适配问题。

欢迎长按下图-识别图中二维码或者扫一扫关注我的公众号:

如果你有不同意见或建议或者有好的技术文章想和大家分享欢迎投稿,可以把你的文章使用附件的形式发送到我的邮箱2908116133@qq.com

谢谢阅读!

相关文章

网友评论

    本文标题:Android图片适配之——自定义控件RatioLayout

    本文链接:https://www.haomeiwen.com/subject/cxtukxtx.html