英文:
Can the VisualTransformations work with a composable OutlinedTextField
问题
Material 3
我有以下的代码片段，一个简单的密码输入。然而，它由于以下错误而无法构建：
@Composable 调用只能在 @Composable 函数的上下文中发生
然而，如果我移除 `visualTransformations`，它可以正常工作。我只是想知道为什么会这样？
在下面的图像中，您可以看到 Text 和 Image 上有很多红线标记错误。
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun PasswordEntry(
modifier: Modifier = Modifier,
passwordValue: String,
placeholderText: String,
visibilityTapped: () -> Boolean,
onPasswordChange: (String) -> Unit,
) {
OutlinedTextField(
modifier = modifier.fillMaxWidth().background(
shape = RoundedCornerShape(10.dp),
color = MaterialTheme.colorScheme.backgroundInputEntry
),
singleLine = true,
value = passwordValue,
onValueChange = { newInput: String ->
onPasswordChange(newInput)
},
placeholder = {
Text(text = placeholderText, color = MaterialTheme.colorScheme.placeholderEntry)
},
trailingIcon = {
val visibilityIconId = if(visibilityTapped()) {
R.drawable.hidden
} else {
R.drawable.visible
}
Image(
painter = painterResource(id = visibilityIconId),
contentDescription = "eye open close"
)
},
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
shape = RoundedCornerShape(10.dp),
visualTransformations = if (visibilityTapped()) {
PasswordVisualTransformation()
} else {
VisualTransformation.None
}
)
}
[![在这里输入图像描述][1]][1]
英文:
Material 3
I have the following code snippet of a simple password entry. However, its not building because of the following errors
@Composable invocations can only happen from the context of a @Composable function
However, if I remove the visualTransformations is works ok. I am just wondering why that is?
In the following image you can see there is a lot of red lines for errors on the Text and Image.
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun PasswordEntry(
modifier: Modifier = Modifier,
passwordValue: String,
placeholderText: String,
visibilityTapped: () -> Boolean,
onPasswordChange: (String) -> Unit,
) {
OutlinedTextField(
modifier = modifier.fillMaxWidth().background(
shape = RoundedCornerShape(10.dp),
color = MaterialTheme.colorScheme.backgroundInputEntry
),
singleLine = true,
value = passwordValue,
onValueChange = { newInput: String ->
onPasswordChange(newInput)
},
placeholder = {
Text(text = placeholderText, color = MaterialTheme.colorScheme.placeholderEntry)
},
trailingIcon = {
val visibilityIconId = if(visibilityTapped()) {
R.drawable.hidden
} else {
R.drawable.visible
}
Image(
painter = painterResource(id = visibilityIconId),
contentDescription = "eye open close"
)
},
keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),
shape = RoundedCornerShape(10.dp),
visualTransformations = if (visibilityTapped()) {
PasswordVisualTransformation()
} else {
VisualTransformation.None
}
)
}
答案1
得分: 3
你需要使用 visualTransformation 而不是 visualTransformations。
OutlinedTextField(
//...
visualTransformation = if (visibilityTapped()) {
PasswordVisualTransformation()
} else {
VisualTransformation.None
}
)
英文:
You have to use visualTransformation instead of visualTransformations.
OutlinedTextField(
//...
visualTransformation = if (visibilityTapped()) {
PasswordVisualTransformation()
} else {
VisualTransformation.None
}
)
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论