Android自实现百分比布局

    在开发中,组件布局是大家每日开发必须要面对的工作,对于Android来说提供五种常用布局,分别是:

  • LinearLayout(线性布局)
  • TableLayout(表格布局)
  • RelativeLayout(相对布局)
  • AbsoluteLayout(绝对布局)
  • FrameLayout(框架布局)

    但是,开发中如果可以按照百分比的方式进行界面布局,将会对我们的适配工作带来许多便利。前段时间,谷歌正式提供百分比布局支持库(android-support-percent-lib),对于我们开发者来讲只需要导入这个库就可以实现百分比布局。现在我们抛开谷歌库不谈,自己其实也可以实现百分比布局。

/** * * @ClassName: PercentRelativeLayout * @Description: 自定义百分比相对布局 * @author 猴子搬来的救兵http://blog.csdn.net/mynameishuangshuai */
public class PercentRelativeLayout extends RelativeLayout{

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

    public PercentRelativeLayout(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    public PercentRelativeLayout(Context context, AttributeSet attrs) {
        super(context, attrs); 
    }
    /** * 重写测量方法 */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        // 先拿到父控件的宽高
        int width = View.MeasureSpec.getSize(widthMeasureSpec);
        int height = View.MeasureSpec.getSize(heightMeasureSpec);
        int count = this.getChildCount();
        for (int i = 0; i < count; i++) {// 循环迭代子控件
            View child = this.getChildAt(i);// 取出每一个子控件
            ViewGroup.LayoutParams lp = child.getLayoutParams();
            float widthPercent = 0;
            float hightPercent = 0;
            if (lp instanceof PercentRelativeLayout.LayoutParams) {// 支持百分比布局
                widthPercent = ((PercentRelativeLayout.LayoutParams) lp).widthPercent;
                hightPercent = ((PercentRelativeLayout.LayoutParams) lp).heightPercent;
            }
            if (widthPercent != 0) {
                // 父容器的宽*宽的百分比
                lp.width = (int) (width * widthPercent);
            }

            if (hightPercent != 0) {
                // 父容器的高*高的百分比
                lp.height = (int) (height * hightPercent);
            }
        }
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    /** * 重写对子控件布局方法 */
    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {
        super.onLayout(changed, l, t, r, b);
    }

    /** * 重写对子控件布局属性进行获取解析 */
    @Override
    public LayoutParams generateLayoutParams(AttributeSet attrs) {
// return super.generateLayoutParams(attrs);// 这里必须返回下面自定的LayoutParams
        return new LayoutParams(getContext(), attrs);
    }

    public static class LayoutParams extends RelativeLayout.LayoutParams{

        private float widthPercent;
        private float heightPercent;

        public LayoutParams(Context c, AttributeSet attrs) {
            super(c, attrs);
            TypedArray a = c.obtainStyledAttributes(attrs,R.styleable.precentRelativeLayout);
            widthPercent = a.getFloat(R.styleable.precentRelativeLayout_layout_widthPrecent, widthPercent);
            heightPercent = a.getFloat(R.styleable.precentRelativeLayout_layout_heightPrecent, heightPercent);
            a.recycle();
        }

        public LayoutParams(int w, int h) {
            super(w, h);
        }

        public LayoutParams(android.view.ViewGroup.LayoutParams source) {
            super(source);
        }

        public LayoutParams(android.widget.RelativeLayout.LayoutParams source) {
            super(source);
        }

    }
}

自定义属性文件:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name= "precentRelativeLayout">
        <attr name="layout_widthPrecent" format="float"></attr>
        <attr name="layout_heightPrecent" format="float"></attr>
    </declare-styleable>
</resources>

布局文件:

<com.castiel.demo.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/com.castiel.demo"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        app:layout_heightPrecent="0.2"
        app:layout_widthPrecent="0.2"
        android:background="#28FF28"
        android:text="http://blog.csdn.net/mynameishuangshuai" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        app:layout_heightPrecent="0.3"
        app:layout_widthPrecent="0.3"
        android:background="#28FF28"
        android:text="猴子搬来的救兵" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        app:layout_heightPrecent="0.2"
        app:layout_widthPrecent="0.2"
        android:background="#28FF28"
        android:text="castiel" />

</com.castiel.demo.PercentRelativeLayout>

运行结果:

Android自实现百分比布局_第1张图片

你可能感兴趣的:(android,百分比布局,layoutpara)