自定义View实战四：自定义ViewGroup之简单入门

最新推荐文章于 2019-09-04 15:22:50 发布

转载最新推荐文章于 2019-09-04 15:22:50 发布 · 212 阅读

Andorid：自定义View 专栏收录该内容

16 篇文章

订阅专栏

本文介绍了一个自定义的Android ViewGroup，实现了水平排列多个子视图的功能。通过重写onMeasure和onLayout方法，确保子视图能够根据屏幕宽度自动换行，达到灵活的布局效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

简单实现水平排列效果

代码：

public class CustomLayout extends ViewGroup {

    public CustomLayout(Context context) {
        this(context, null);
    }

    public CustomLayout(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

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

    /**
     * 要求所有的孩子测量自己的大小，然后根据这些孩子的大小完成自己的尺寸测量
     */
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        // 计算出所有的childView的宽和高
        measureChildren(widthMeasureSpec, heightMeasureSpec);

        //测量并保存layout的宽高(使用getDefaultSize时，wrap_content和match_perent都是填充屏幕)
        //稍后会重新写这个方法，能达到wrap_content的效果
        setMeasuredDimension(getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec),
                getDefaultSize(getSuggestedMinimumHeight(), heightMeasureSpec));

    }

    /**
     * 为所有的子控件摆放位置.
     */
    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        final int count = getChildCount();
        int childMeasureWidth = 0;
        int childMeasureHeight = 0;
        int layoutWidth = 0;    // 容器已经占据的宽度
        int layoutHeight = 0;   // 容器已经占据的宽度
        int maxChildHeight = 0; //一行中子控件最高的高度，用于决定下一行高度应该在目前基础上累加多少

        for (int i = 0; i < count; i++) {
            View child = getChildAt(i);
            //注意此处不能使用getWidth和getHeight，这两个方法必须在onLayout执行完，才能正确获取宽高
            childMeasureWidth = child.getMeasuredWidth();
            childMeasureHeight = child.getMeasuredHeight();
            if (layoutWidth < getWidth()) {
                //如果一行没有排满，继续往右排列
                left = layoutWidth;
                right = left + childMeasureWidth;
                top = layoutHeight;
                bottom = top + childMeasureHeight;
            } else {
                //排满后换行
                layoutWidth = 0;
                layoutHeight += maxChildHeight;
                maxChildHeight = 0;

                left = layoutWidth;
                right = left + childMeasureWidth;
                top = layoutHeight;
                bottom = top + childMeasureHeight;
            }

            //宽度累加
            layoutWidth += childMeasureWidth;
            if (maxChildHeight < childMeasureHeight) {
                maxChildHeight = childMeasureHeight;
            }

            //确定子控件的位置，四个参数分别代表（左上右下）点的坐标值
            child.layout(left, top, right, bottom);
        }

    }



}

布局中使用：

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

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#FF8247"
        android:padding="20dip"
        android:text="按钮1"
        android:textColor="#ffffff"
        android:textSize="20dip" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#8B0A50"
        android:padding="10dip"
        android:text="按钮2222222222222"
        android:textColor="#ffffff"
        android:textSize="20dip" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#7CFC00"
        android:padding="15dip"
        android:text="按钮333333"
        android:textColor="#ffffff"
        android:textSize="20dip" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#1E90FF"
        android:padding="10dip"
        android:text="按钮4"
        android:textColor="#ffffff"
        android:textSize="10dip" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#191970"
        android:padding="15dip"
        android:text="按钮5"
        android:textColor="#ffffff"
        android:textSize="20dip" />

</....CustomLayout>