Name des bearbeitbaren Textfelds
This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard
Not for use with personal data
Texteingabeelemente sollten einen zugänglichen Namen haben, der für unterstützende Technologien wie TalkBack und Voice Access verfügbar ist.
Auswirkung
Die durch diese Regel festgestellten Probleme betreffen blinde Menschen.
EditText oder TextField Elemente sollten Informationen dort bereitstellen, wo das Android-Betriebssystem sie erwartet. Dadurch können unterstützende Technologien Informationen vorhersehbar kommunizieren.
Bestätigung
- TalkBack aktivieren
- Konzentrieren Sie sich auf das Element
- Eines der folgenden Ereignisse wird eintreten:
- Zugänglich: TalkBack sagt den eingegebenen Text, für und die zugehörigen Labels an
Text. - Nicht zugänglich: TalkBack hat die obigen Informationen entweder nicht vorgelesen oder sie wurden in der falschen Reihenfolge angesagt.
- Zugänglich: TalkBack sagt den eingegebenen Text, für und die zugehörigen Labels an
So beheben Sie das Problem
Fügen Sie dem Textfeld entsprechende Beschriftungen hinzu. Verwenden Sie Symbole nur, wenn eine Inhaltsbeschreibung verfügbar ist.
XML
EditText editText = .......; // Role: EditText
TextView label = .......; // Role: Label
label.setLabelFor(editText.getId()); // Associate the Checkbox with its NameCompose
@Composable
private fun LabeledTextField(modifier: Modifier = Modifier) {
val textInput = remember { mutableStateOf("") }
OutlinedTextField(
modifier = modifier,
value = textInput.value,
onValueChange = { textInput.value = it },
visualTransformation = VisualTransformation.None,
label = { Text(stringResource(R.string.address_label)) }
)
}
@Composable
private fun IconsWithDescriptionTextField(modifier: Modifier = Modifier) {
val textInput = remember { mutableStateOf("") }
OutlinedTextField(
modifier = modifier,
value = textInput.value,
onValueChange = { textInput.value = it },
label = {
Icon(
painter = painterResource(id = R.drawable.ic_location),
contentDescription = stringResource(id = R.string.address_content_description)
)
}
)
}React Native
Ordnen Sie das Textelement mithilfe der Eigenschaft aria-labelledBy dem entsprechenden Textfeld zu:
<Text
style={{height: 70, width: 150, fontSize: 20, marginTop: 10}}
aria-label="Username"
nativeID="labelUsername">
Username
</Text>
<TextInput
style={{height: 50, width: 200, backgroundColor: 'azure', fontSize: 20}}
aria-label="input"
aria-labelledby="labelUsername"
placeholder='John'
/>