如何让DropdownMenuItem高度适配文本并减少内边距？解决DropdownMenu高度冗余

核心问题原因 #

DropdownMenuItem默认遵循Material Design规范，设置了48.dp的最小高度和固定内边距；DropdownMenu本身也默认带有上下内边距，这就是导致整体高度超出Text高度的根本原因。

解决方案 #

1. 调整DropdownMenuItem的高度与内边距

通过覆盖默认参数，强制让高度适配内部Text的固有尺寸，并设置你需要的最小内边距：

DropdownMenuItem(
    modifier = Modifier
        .background(Color.Blue)
        .height(IntrinsicSize.Min) // 高度自动适配内部Text的固有高度
        .sizeIn(minHeight = 0.dp), // 覆盖默认的48dp最小高度限制
    contentPadding = PaddingValues(horizontal = 2.dp, vertical = 2.dp), // 设置自定义最小内边距
    onClick = { expandedFile = false }, // 必须添加点击事件以关闭菜单
    text = {
        Text(
            modifier = Modifier.background(Color.Red),
            text = stringResource(Res.string.exit)
        )
    }
)

2. 移除DropdownMenu的默认内边距

DropdownMenu默认上下各有4.dp的内边距，直接通过Modifier清除即可：

DropdownMenu(
    modifier = Modifier
        .background(Color.Yellow)
        .padding(0.dp), // 去掉默认的上下内边距
    expanded = expandedFile,
    onDismissRequest = { expandedFile = false }
) {
    // 放入调整后的DropdownMenuItem
}

完整示例代码

DropdownMenu(
    modifier = Modifier
        .background(Color.Yellow)
        .padding(0.dp),
    expanded = expandedFile,
    onDismissRequest = { expandedFile = false }
) {
    DropdownMenuItem(
        modifier = Modifier
            .background(Color.Blue)
            .height(IntrinsicSize.Min)
            .sizeIn(minHeight = 0.dp),
        contentPadding = PaddingValues(horizontal = 2.dp, vertical = 2.dp),
        onClick = { expandedFile = false },
        text = {
            Text(
                modifier = Modifier.background(Color.Red),
                text = stringResource(Res.string.exit)
            )
        }
    )
}

额外说明 #

如果使用的是Material 3，DropdownMenuItem的默认参数略有差异，但核心逻辑一致：通过sizeIn(minHeight = 0.dp)覆盖最小高度限制，同时自定义contentPadding即可。

内容的提问来源于stack exchange，提问作者NullPointerException