布局过程的完全解析

news/2024/5/20 14:52:04/文章来源:https://blog.csdn.net/qq_35178391/article/details/132777392

前言

在这里插入图片描述
那么为什么要分为两个流程呢

因为测量流程是一个复杂的流程，有时候不一定一遍就能得出测量结果，可能需要 2 - 3 次甚至更多

在这里插入图片描述

自定义布局的几种类型，也是自定义布局的两个方法

在这里插入图片描述

实战，第一种类型：改写已有View 的步骤

在这里插入图片描述
需求：实现一个正方形的ImageView，以窄边作为变长，我们可以这样实现：

package com.example.viewtest.viewimport android.content.Context
import android.util.AttributeSet
import androidx.appcompat.widget.AppCompatImageView
import kotlin.math.minclass SquareImageView(context: Context, attrs: AttributeSet) : AppCompatImageView(context, attrs) {override fun layout(l: Int, t: Int, r: Int, b: Int) {val width = r - lval height = t - bval value = min(width, height)super.layout(l, t, r + value, b + value)}
}

这样可以实现我们的效果，但是为什么不能这样写呢？

因为这是父View在他的OnLayout方法中会调用字view的layout，让子view将自己的尺寸保存下来，而我们在这个过程中修改了自己的尺寸，父view是不知道的，后续的过程中父view会一直认为我们的尺寸是他传给我们的那个，会发生意想不到的效果

比方说我们在xml中声明的这个view 的宽是300，高是200，在这个view的右边紧挨着放了另一个view，运行的效果会发现这两个view中间有100的距离，就是因为父view认为你是300，而你实际把自己改成了200

接下来展示正确的写法

package com.example.viewtest.viewimport android.content.Context
import android.util.AttributeSet
import androidx.appcompat.widget.AppCompatImageView
import kotlin.math.minclass SquareImageView(context: Context, attrs: AttributeSet) : AppCompatImageView(context, attrs) {override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {// 保留这个方法，让父布局去测量我的结果，我的宽高super.onMeasure(widthMeasureSpec, heightMeasureSpec)// 通过这两个拿到测量之后的结果val value = min(measuredWidth, measuredHeight)// 修改后的值直接保存，这样才有意义，才会起到作用// 不是通过返回值将结果返回给父view，因为之后不一定是父view在使用setMeasuredDimension(value, value)// measuredWidth、width 的区别// measuredWidth 是测量过程中的值，width 是最终的结果值，父view可能会对measuredWidth进行修改，他俩可能值不一样// width 只有测量结束才能拿到结果，即使是刷新，在刷新完成之前虽然有值，也是上一次的测量结果// 在测量过程中应该使用 measuredWidth，高同理}}

这里额外说一下 measuredWidth、width 的区别（高同理）

    // measuredWidth、width 的区别// measuredWidth 是测量过程中的值，width 是最终的结果值，父view可能会对measuredWidth进行修改，他俩可能值不一样// width 只有测量结束才能拿到结果，即使是刷新，在刷新完成之前虽然有值，也是上一次的测量结果// 在测量过程中应该使用 measuredWidth，高同理

实战，第二种类型：完全自定义View的尺寸

步骤
在这里插入图片描述

package com.example.viewtest.viewimport android.content.Context
import android.graphics.Canvas
import android.graphics.Paint
import android.util.AttributeSet
import android.view.View
import androidx.appcompat.widget.AppCompatImageView
import com.example.viewtest.R
import com.example.viewtest.ext.dp
import kotlin.math.minprivate const val PADDING = 100f
private const val RADIUS = 100f
class CircleView(context: Context, attrs: AttributeSet) : View(context, attrs) {private val paint = Paint(Paint.ANTI_ALIAS_FLAG)override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {super.onMeasure(widthMeasureSpec, heightMeasureSpec)val size = (PADDING + RADIUS) * 2/*** resolveSize 的作用* 一值两用，通过 MeasureSpec.getMode 判断返回的约束条件；通过 MeasureSpec.getSize 获取真实的值* 如果强制类型，那么使用父类给的值，如果是范围类型，则谁小使用谁，其他则随意使用*/val width = resolveSize(size.toInt(), widthMeasureSpec)val height = resolveSize(size.toInt(), heightMeasureSpec)setMeasuredDimension(width, height)}override fun onDraw(canvas: Canvas) {super.onDraw(canvas)canvas.drawCircle(PADDING + RADIUS, PADDING + RADIUS, RADIUS , paint)}}

实战，第三种类型：完全自定义View的尺寸

在这里插入图片描述

import android.content.Context
import android.graphics.Rect
import android.util.AttributeSet
import android.view.ViewGroup
import androidx.core.view.children
import kotlin.math.maxclass TagLayout(context: Context?, attrs: AttributeSet?) : ViewGroup(context, attrs) {private val childrenBounds = mutableListOf<Rect>()override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {var widthUsed = 0var heightUsed = 0var lineWidthUsed = 0var lineMaxHeight = 0val specWidthSize = MeasureSpec.getSize(widthMeasureSpec)val specWidthMode = MeasureSpec.getMode(widthMeasureSpec)for ((index, child) in children.withIndex()) {// 测量子类的限制类型以及他的宽，确定他最终的真实宽度measureChildWithMargins(child, widthMeasureSpec, 0, heightMeasureSpec, heightUsed)// 判断是否需要换行，换行需要重制上一行的内容if (specWidthMode != MeasureSpec.UNSPECIFIED &&lineWidthUsed + child.measuredWidth > specWidthSize) {lineWidthUsed = 0heightUsed += lineMaxHeightlineMaxHeight = 0measureChildWithMargins(child, widthMeasureSpec, 0, heightMeasureSpec, heightUsed)}if (index >= childrenBounds.size) {childrenBounds.add(Rect())}val childBounds = childrenBounds[index]childBounds.set(lineWidthUsed, heightUsed, lineWidthUsed + child.measuredWidth, heightUsed + child.measuredHeight)lineWidthUsed += child.measuredWidth// 已经使用的最大宽度为当我自己的宽度widthUsed = max(widthUsed, lineWidthUsed)// 当前行的最大高度lineMaxHeight = max(lineMaxHeight, child.measuredHeight)}val selfWidth = widthUsedval selfHeight = heightUsed + lineMaxHeight// 确定我自己的宽高setMeasuredDimension(selfWidth, selfHeight)}override fun onLayout(changed: Boolean, l: Int, t: Int, r: Int, b: Int) {for ((index, child) in children.withIndex()) {val childBounds = childrenBounds[index]child.layout(childBounds.left, childBounds.top, childBounds.right, childBounds.bottom)}}// 调用 measureChildWithMargins 时会强转报错override fun generateLayoutParams(attrs: AttributeSet?): LayoutParams {return MarginLayoutParams(context, attrs)}
}