自定义按照图片宽高比例缩放的RadioLayout

有时候图片的宽高比例不对的话,图片显示的就很别扭,那么怎么才能让图片按照正常的比例显示而且宽度还能matchparent呢? 这就要自定义一个能够自适应的父布局,这样imageView即可以正常显示了,(之所以不在IamgeView上面进行修改是因为逻辑可能会复杂一点,所以自定义了一个父布局)

首先自定义一个RadioLayout继承FrameLayout,然后重写onMeasure()方法中,重新按照宽高比例进行测量

package zz.itcast.googleplay09.view;

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

/**
 * 等比例的父控件
 * @author fanday
 *
 */
public class RatioLayout extends FrameLayout {
    
    //图片的宽高比例
    private float ratio = 2.43f;
    

    public void setRatio(float ratio) {
        this.ratio = ratio;
    }
    public RatioLayout(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
        initAttrs(attrs);
    }
    /**
     * 初始化属性
     */
    private void initAttrs(AttributeSet attrs) {
        //namespace:命名控件，attribute：属性名称，defaultValue：默认值
        float ratioValue = attrs.getAttributeFloatValue("http://schemas.android.com/apk/res/zz.itcast.googleplay09", "ratio", 2.43f);
        setRatio(ratioValue);
    }

    public RatioLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        initAttrs(attrs);
    }

    public RatioLayout(Context context) {
        super(context);
    }
    /**
     * 确定测量标准
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        //RatioLayout的宽度测量标准：widthMeasureSpec ，mode+size
        //获取RatioLayout的宽度大小
        int widthSize = MeasureSpec.getSize(widthMeasureSpec);
        //获取RatioLayout的宽度模式
        int widthMode = MeasureSpec.getMode(widthMeasureSpec);
        //图片宽高比例2.43
        int picWidthSize = 0;
        int picHeightSize = 0;
       
        
        //如果图片的高度确定
        //RatioLayout的高度测量标准：heightMeasureSpec
        int heigthSize = MeasureSpec.getSize(heightMeasureSpec);
        int heigthMode= MeasureSpec.getMode(heightMeasureSpec);
        
        
        //如果宽度是精确值
        if(widthMode == MeasureSpec.EXACTLY&&heigthMode != MeasureSpec.EXACTLY){
            //计算图片的高度
            picWidthSize = widthSize - getPaddingLeft() - getPaddingRight();
            picHeightSize = (int) (picWidthSize/ratio);
        }
        <pre name="code" class="java">        //如果高度是精确值matchParent的model就是EXACTLY WrapContent的model是ATMOST
        if(heigthMode == MeasureSpec.EXACTLY&&widthMode != MeasureSpec.EXACTLY){
            picHeightSize = heigthSize - getPaddingBottom() - getPaddingTop();
            picWidthSize = (int) (picHeightSize*ratio);
        }
        
        
        //RatioLayout新测量标准
        int newWidthMeasureSpec = MeasureSpec.makeMeasureSpec(picWidthSize+getPaddingLeft()+getPaddingRight(), MeasureSpec.EXACTLY);
        int newHeigthMeasureSpec = MeasureSpec.makeMeasureSpec(picHeightSize+getPaddingTop()+getPaddingBottom(), MeasureSpec.EXACTLY);
        
        //把计算好的宽高直接给super.onMeasure()调用
        super.onMeasure(newWidthMeasureSpec, newHeigthMeasureSpec);
    }
    
}

上面的这个自定义View用到了自定义属性,下面就来说下自定义属性怎么实现,再res下values目录下建立attrs xml文件

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- declare-styleable name是当前控件名 -->
    <declare-styleable name="zz.itcast.googleplay09.view.RatioLayout">
       <!-- attr name 属性名  format 当前属性的数据类型 -->
        <attr name="ratio" format="float"/>
    </declare-styleable>
</resources>

<declare-styleable name="zz.itcast.googleplay09.view.RatioLayout"> name指定为自定义view类的全路径,然后在布局的xml中就可以使用自定义的属性了

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:itcast="http://schemas.android.com/apk/res/zz.itcast.googleplay09"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="9dip"
        android:layout_marginRight="9dip"
        android:background="@drawable/list_item_bg" >

        <zz.itcast.googleplay09.view.RatioLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/ratiolayout"
            itcast:ratio = "2.43"
            android:padding="5dp" >

            <ImageView
                android:id="@+id/item_icon"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:scaleType="fitCenter"
                android:src="@drawable/ic_default" />
        </zz.itcast.googleplay09.view.RatioLayout>

xmlns:itcast="http://schemas.android.com/apk/res/zz.itcast.googleplay09"需要我们自定义一个命名空间

这样ImageView就可以实现宽高缩放功能了