自定义流势布局

手写流失布局

直接上代码

/**
 * 自定义View  ：流式布局
 */
class FowLayout : ViewGroup {
    private var mContext: Context? = null

    var lintManagerViews: ArrayList<ArrayList<View>>? = null
    var lintManagerHeight: ArrayList<Int>? = null

    constructor(context: Context) : super(context) {
        mContext = context
    }

    //反射
    constructor(context: Context, attributes: AttributeSet) : super(context, attributes) {
        mContext = context

    }

    //主题
    constructor(context: Context, attributes: AttributeSet, style: Int) : super(context, attributes,style) {
        mContext = context
    }

    private fun initManager() {
        lintManagerViews = arrayListOf<ArrayList<View>>()
        lintManagerHeight = arrayListOf<Int>()
    }

    override fun onLayout(p0: Boolean, p1: Int, p2: Int, p3: Int, p4: Int) {

       /* val childCount = childCount
        for (index in 0..childCount) {
            val childAt = getChildAt(index)
            childAt.layout(p1, p2, p3, p4)
        }*/
        var padLeft = paddingLeft
        var padTop = paddingTop
        val lineSize = lintManagerViews?.size

        for (i in 0 until lineSize!!) {
            val getView = lintManagerViews?.get(i)
            val height = lintManagerHeight?.get(i)
            for (j in 0 until getView?.size!!) {
                val view = getView[j]
                val toLife=padLeft
                val toRight=padLeft+view.measuredWidth
                val toTop=padTop
                val toButton=padTop+view.measuredHeight
                view.layout(toLife, toTop,toRight,toButton)
                padLeft=toRight
            }
            padLeft=paddingLeft
            if (height != null) {
                padTop += height
            }
        }

    }

    override fun onDraw(canvas: Canvas?) {
        super.onDraw(canvas)
    }

    /**
     * 确定子view的大小， 坐标，  最后相加拿到我们这整个大小
     *度量：
     */
    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec)
        initManager()
        //我們的孩子'
        //获取view Group 的padding
        val childList = childCount
        val paddingLeft = paddingLeft
        val paddingRight = paddingRight
        val paddingBottom = paddingBottom
        val paddingTop = paddingTop
        //获取viewGroup 的宽和高
        val widthSize = MeasureSpec.getSize(widthMeasureSpec)
        val heightSize = MeasureSpec.getSize(heightMeasureSpec)

        var viewList = arrayListOf<View>()
        var lindWidthUser = 0//一行的宽度
        var lindHeight = 0  //一行的行高

        var pacerHeight = 0//子view 要求父布局的高度
        var pacerWidth = 0

        for (i in 0 until childList) {
            val childAt = getChildAt(i)
            val layoutParams = childAt.layoutParams
            val childWidthMeasureSpec = getChildMeasureSpec(
                widthMeasureSpec,
                paddingLeft + paddingRight,
                layoutParams.width
            )
            val childHeightMeasureSpec = getChildMeasureSpec(
                heightMeasureSpec,
                paddingBottom + paddingTop,
                layoutParams.height
            )
            childAt.measure(childWidthMeasureSpec, childHeightMeasureSpec)

            //获取子view  的宽高
            val measuredWidth = childAt.measuredWidth
            val measuredHeight = childAt.measuredHeight
            if (measuredWidth + lindWidthUser > widthSize) {
                lintManagerViews?.add(viewList)
                lintManagerHeight?.add(lindHeight)

                pacerHeight += lindHeight
                pacerWidth = pacerWidth.coerceAtLeast(lindWidthUser)
                viewList = arrayListOf()
                lindHeight = 0
                lindWidthUser = 0
            }
            viewList.add(childAt)//将view 添加进去
            lindWidthUser += measuredWidth;
            lindHeight = lindHeight.coerceAtLeast(measuredHeight)
            //最后一行的高度
            if (i == childList - 1) {
                lintManagerViews?.add(viewList)
                lintManagerHeight?.add(lindHeight)

                pacerHeight += lindHeight
                pacerWidth = pacerWidth.coerceAtLeast(lindWidthUser)
            }
        }
        //根据子view的度量结果重新度量自己
        val modeWidth = MeasureSpec.getMode(widthMeasureSpec)
        val modeHeight = MeasureSpec.getMode(heightMeasureSpec)
        val roadWidth = if (modeWidth == MeasureSpec.EXACTLY) modeWidth else widthMeasureSpec
        val roadHeight = if (modeHeight == MeasureSpec.EXACTLY) modeHeight else heightMeasureSpec
        setMeasuredDimension(roadWidth, roadHeight)

    }
}

布局

   <com.example.livekotlin.view.FowLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="1.0"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button"
        app:layout_constraintVertical_bias="0.0">

        <Button
            android:layout_width="50dp"
            android:layout_height="wrap_content"
            android:text="7"
            android:textColor="@color/design_default_color_primary" />

        <Button
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:text="0"
            android:textColor="@color/design_default_color_primary" />

        <Button
            android:layout_width="300dp"
            android:layout_height="wrap_content"
            android:text="zzzzzzzzzzzzzzzzzzzzzzzzzzzzz"
            android:textColor="@color/design_default_color_primary" />

        <Button
            android:layout_width="60dp"
            android:layout_height="wrap_content"
            android:text="uuuuuuuu"
            android:textColor="@color/design_default_color_primary" />

        <Button
            android:layout_width="120dp"
            android:layout_height="wrap_content"
            android:text="eeee"
            android:textColor="@color/design_default_color_primary" />

        <Button
            android:layout_width="230dp"
            android:layout_height="wrap_content"
            android:text="iiiiiiiiiiiiiiii"
            android:textColor="@color/design_default_color_primary" />
        <Button
            android:layout_width="111dp"
            android:layout_height="wrap_content"
            android:text="kkkkkkkkkkkkk"
            android:textColor="@color/design_default_color_primary" />



    </com.example.livekotlin.view.FowLayout>

效果

image.png