如何在 jetpack compose 中使文本可点击？我还想在选择一次后将其切换为不可点击

Question

这是我的代码：

Text(
    text = "Resend OTP",
    fontSize = 20.sp,
    color =  Textfieldcolor,
    style = TextStyle(textDecoration = TextDecoration.Underline)
)

我希望文本可以点击一次然后禁用。

我该怎么做呢？

Answer 1

您可以将clickable修饰符添加到Text或使用ClickableText而不是Text。

以下是如何使用ClickableText执行此操作的示例：

var enabled by remember { mutableStateOf(true)}

ClickableText(
    text = AnnotatedString(text) ,
    onClick = {
        if (enabled) {
            enabled = false
            text = "Disabled"
        }
    })

Answer 2

就像 @Arpit 提到的，最好使用 aTextButton用于此目的。但如果你绝对想使用Text，你可以使用以下代码片段。

@Composable 
fun OneTimeClickableText(text : String, onClick : () -> Unit){
    var enabled by rememberSaveable{ mutableStateOf(true)}
    Text(
        modifier = Modifier
            .clickable(enabled = enabled) {
                enabled = false
                onClick()
            },
        text = text
    )
}

也就是说，我这段代码严格适用于一次性可点击文本。我不建议将它用于 OTP 按钮之类的用途；因为用户将无法单击它，除非重新启动您的应用程序。您可以拉出enabled变量并从外部管理它（例如，将其禁用一段时间而不是永久）。