【Androd Compose】如何设置DropdownMenu的宽度和Text一致

要使 DropdownMenu 的宽度与 Box 中的 Text 一致，可以使用以下方法：

1. 使用 Modifier.onGloballyPositioned 和 Modifier.width

可以使用 Modifier.onGloballyPositioned 获取 Text 的宽度，并将其设置为 DropdownMenu 的宽度。

var textWidth by remember { mutableStateOf(0) }
var expanded by remember {mutableStateOf(false) }

Box {
    Text(
        text = "Your Text",
        modifier = Modifier.onGloballyPositioned { coordinates ->
            textWidth = coordinates.size.width
        }
    )
    DropdownMenu(
        expanded = expanded,
        onDismissRequest = { expanded = false },
        modifier = Modifier.width(with(LocalDensity.current) { textWidth.toDp() })
    ) {
        DropdownMenuItem(onClick = { /*TODO*/ }) {
            Text("Item 1")
        }
        // ...other menu items
    }
}

2. 使用 SubcomposeLayout

可以使用 SubcomposeLayout 测量 Text 的宽度，并将其用作 DropdownMenu 的宽度约束。

var expanded by remember { mutableStateOf(false) }

SubcomposeLayout { constraints ->
    val textPlaceable = subcompose("text") {
        Text("Your Text")
    }[0].measure(constraints)

    val dropdownMenuPlaceable = subcompose("dropdownMenu") {
        DropdownMenu(
            expanded = expanded,
            onDismissRequest = { expanded = false }
        ) {
            DropdownMenuItem(onClick = { /*TODO*/ }) {
                Text("Item 1")
            }
            // ... other menu items
        }
    }[0].measure(constraints.copy(minWidth = textPlaceable.width))

    layout(textPlaceable.width, textPlaceable.height + dropdownMenuPlaceable.height) {
        textPlaceable.placeRelative(0, 0)
        dropdownMenuPlaceable.placeRelative(0, textPlaceable.height)
    }
}

这两种方法都可以实现 DropdownMenu 与 Text 宽度相同的效果。选择哪种方法取决于具体需求和代码风格。
请注意，在使用 DropdownMenu 时，需要确保它在 Box 中的 Text 下方正确显示。可以使用 Modifier.clickable 来触发 DropdownMenu 的展开，并根据需要调整 Box 中元素的位置。