Android屏幕适配之固定宽高比

图形自己的宽高比不等于控件的宽高比造成了显示的时候图片的变形.
以最常见的情况为例:
已知条件:图片的宽高比,控件的的宽度(match_parent)
解决办法:让图片宽高比等于控件宽高比,自定义一个Layout控件

package com.example.administrator.example.views;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.FrameLayout;


/**
 * 作者:Created by Kevin on 2016/2/1.
 * 邮箱:
 * 描述:固定宽高比的控件
 */
public class RatioLayout extends FrameLayout {

    private float mPicRitio = 2.4f; //一个固定的宽高比,后面创建属性自定义来设置宽高比
    public RatioLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public RatioLayout(Context context) {
        super(context);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //父控件是否是固定值或者是match_parent
        int mode = MeasureSpec.getMode(widthMeasureSpec);
        if (mode == MeasureSpec.EXACTLY){
            //得到父容器的宽度
            int parentWidth = MeasureSpec.getSize(widthMeasureSpec);
            //得到子控件的宽度
            int childWidth = parentWidth - getPaddingLeft() - getPaddingRight();
            //计算子控件的高度
            int childHeight = (int) (childWidth / mPicRitio +0.5f);
            //计算父控件的高度
            int parentHeight = childHeight + getPaddingBottom() + getPaddingTop();

            //测量子控件,固定孩子的大小
            int childWidthMeasureSpec = MeasureSpec.makeMeasureSpec(childWidth, MeasureSpec.EXACTLY);
            int childHeightMeasureSpec = MeasureSpec.makeMeasureSpec(childHeight, MeasureSpec.EXACTLY);
            measureChildren(childWidthMeasureSpec,childHeightMeasureSpec);
            //测量
            setMeasuredDimension(parentWidth,parentHeight);

        } else {
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        }

    }
}

然后在我们布局文件中调用

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="4dp"
        android:background="@drawable/selector_item_appinfo_bg"
        android:orientation="vertical"
        android:padding="10dp">


        <com.example.administrator.example.views.RatioLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <ImageView
                android:id="@+id/iv_icon"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

        </com.example.administrator.example.views.RatioLayout>

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="title" />
    </LinearLayout>

</FrameLayout>

这样我们现实的图片就是以一个固定宽高比来显示的,不会因为图片的大小造成显示的不同。在类RatioLayout 中我们固定了宽高比mPicRitio = 2.4f,我们更希望在布局文件中可以自定义该值
所以创建attrs。

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="RatioLayout">
        <attr name="picRatio" format="float"/>
    </declare-styleable>
</resources>

修改布局文件以及添加自定义命名空间

<com.example.administrator.googleplay.views.RatioLayout
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:picRatio="3.55"
            >

最后在RatioLayout 的构造函数中获取

    public RatioLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.RatioLayout);
        mPicRitio = typedArray.getFloat(R.styleable.RatioLayout_picRatio,0);

        typedArray.recycle();
    }

    public RatioLayout(Context context) {
        this(context, null);//这样都会走到上一个构造函数
    }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值