如何在 Jetpack Compose 中删除 RadioButton 的填充?

2023-12-19

我的 Jetpack Compose 应用程序中的 RadioButton 组件出现问题。我有一些带有文本的单选按钮,默认情况下有很多填充。我可以删除此填充或设置自定义填充以避免每个填充之间存在大量空间吗?

目前我有这个:

我的代码是:

Column {
    MyEnum.values().filter { rb -> rb.visible }.forEach { rb ->
        Row(
            Modifier
                .fillMaxWidth()
                .padding(horizontal = 0.dp, vertical = 0.dp)
                .clickable(
                    interactionSource = interactionSource,
                    indication = null
                ) {
                    TODO()
                },
            verticalAlignment = Alignment.CenterVertically
        ) {
            RadioButton(
                selected = (rb.position == selectedOption),
                onClick = {
                    TODO()
                },
                colors = RadioButtonDefaults.colors(
                    selectedColor = DialogOutlinedTextFocus,
                    unselectedColor = DialogOutlinedTextUnfocus
                )
            )
    
            Text(
                text = stringResource(id = rb.idText),
                color = Color.Black,
                fontSize = 14.sp,
                modifier = Modifier
                    .padding(horizontal = 3.dp, vertical = 2.dp)
            )
        }
    }
}

我尝试使用 contentPadding,但 RadioButton 组件中不存在此属性。


源代码为RadioButton.kt在第 108 行设置填充修饰符。使用修饰符时,顺序很重要。即使您提供自己的填充修饰符,它也会被第 108 行覆盖。

大小值硬编码在文件底部。

如果您确实想“减少填充”,请应用size修饰符。我用20.dp因为它等于radioButtonSize in RadioButton.kt所以按钮不会被剪掉。这应该适合您的目的,因为整行都是可单击的。

RadioButton(
    modifier = Modifier.size(20.dp),
    selected = selected,
    onClick = { TODO() },
)

尽管如此,从长远来看,制作您可以控制的自定义组件可能会更好。幸运的是,源代码已经可用。只需复制、粘贴并根据您的需要进行调整即可。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 Jetpack Compose 中删除 RadioButton 的填充? 的相关文章

随机推荐