Android记录--Compose中的尺寸和布局

自定义View

以前的自定义View，无非是自定义属性，自定义内容绘制

如果使用compose，那么所谓的自定义View其实就是几种组件的组合，摆放

特殊的摆放

原来的组件在父布局的摆放，需要进行计算，设置layoutParams等等

在compose中，可以通过设置Modifier.layout函数，来自定义当前组件在父布局的摆放

比如，我要实现一个组件在父布局Box中，离左右边界有百分比距离。那么就可以这么实现

fun Modifier.percentagePosition(xPercent: Float, yPercent: Float) = layout {measurable, constraints ->
    val placeable = measurable.measure(constraints)
    layout(placeable.width,  placeable.height) {
        val x = (constraints.maxWidth * xPercent -  placeable.width / 2).toInt()
        val y = (constraints.maxHeight * yPercent -  placeable.height / 2).toInt()
        placeable.placeRelative(x, y)
    }
}

layout的lambda表达式中的参数：

• measurable: Measurable 表示被修饰的可组合项（子组件），需要被测量和布局。
• constraints: Constraints 来自父容器的约束条件，包含可用的最大/最小宽度和高度

percentagePosition是自定义的Modifier的扩展函数，接收两个百分比的值

val placeable = measurable.measure(constraints)

这行代码，通过调用measurable.measure(constraints)，获取Plcaeable对象，通过这个对象可以获取当前组件的宽高信息

layout(width, height){...}

用来设置当前组件的尺寸，以及对齐方法，后面的Lambda表达式就是当前组件在父布局中如何对齐

 placeable.placeRelative(x, y)

这行代码，就是重新布局当前组件在父组件中的位置