Kotlin Compose 自定义布局通过layout设置自定义Column布局

package com.anguomob.jecpack.activity.compose.layout

import androidx.compose.foundation.layout.padding
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.Layout
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp

@Composable
fun MyOwnColumn(modifier: Modifier = Modifier, content: @Composable () -> Unit) {
    Layout(modifier = modifier, content = content) { measurables, constrants ->
        //测量元素
        val placesables = measurables.map { measurable ->
            measurable.measure(constrants)
        }
        var yPosition = 0
        //布局的大小
        layout(constrants.maxWidth, constrants.maxHeight) {
            placesables.forEach { placeable ->
                //设置元素的位置
                placeable.placeRelative(x = 0, y = yPosition)
                yPosition += placeable.height
            }

        }
    }
}

@Preview
@Composable
fun MyOwnColumnSample() {
    MyOwnColumn(modifier = Modifier.padding(8.dp)) {
        Text("MyOwnColumn")
        Text("Places items")
        Text("vertically.")
        Text("We’ve done it by hand!")

    }

}

效果