文章/答案/技术大牛

发布

社区首页 >问答首页 >如果我有特殊文本作为占位符，为什么Android TalkBack不选择这个Jetpack组合OutlinedTextField？

问如果我有特殊文本作为占位符，为什么Android TalkBack不选择这个Jetpack组合OutlinedTextField？
EN

Stack Overflow用户

提问于 2022-07-07 19:52:41

回答 2查看 325关注 0票数 3

我正在使用TalkBack测试我的应用程序的可访问性兼容性。但是，某些OutlinedTextFields正在被跳过，即使通过单击TalkBack也是不可选的。我使用Kotlin/Gradle/Compose的最新版本创建了一个示例应用程序，以确保它与我的项目设置无关。

将“占位符”文本更改为特定值允许TalkBack选择，而其他值则使其不可选(例如："MM/DD/YYYY“使TalkBack跳过字段，但"Hello”允许TalkBack选择字段)。

守则如下：

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            PlaygroundTheme {
                // A surface container using the 'background' color from the theme
                Column(
                    modifier = Modifier.fillMaxSize(),
                ) {
                    Greeting("Android")
                    OutlinedTextField(
                        value = remember{mutableStateOf("")}.value,
                        onValueChange = {

                        },
                        label = {
                            Text(text = "Date of Birth")
                        },
                        placeholder = {
                            Text(text = "MM/DD/YYYY") //TalkBack won't select the field with this placeholder

//                          Text(text = "Hello World") //TalkBack WILL select the field with this placeholder
                        }
                    )
                }
            }
        }
    }
}

@Composable
fun Greeting(name: String) {
    Text(text = "Hello $name!")
}

下面是我使用的依赖项：

buildscript {
    ext {
        compose_version = '1.3.0-alpha01'
    }
}// Top-level build file where you can add configuration options common to all sub-projects/modules.
plugins {
    id 'com.android.application' version '7.2.1' apply false
    id 'com.android.library' version '7.2.1' apply false
    id 'org.jetbrains.kotlin.android' version '1.7.0' apply false
}

    id 'com.android.application'
    id 'org.jetbrains.kotlin.android'
}

android {
    compileSdk 32

    defaultConfig {
        applicationId "com.example.playground"
        minSdk 21
        targetSdk 32
        versionCode 1
        versionName "1.0"

        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
        vectorDrawables {
            useSupportLibrary true
        }
    }

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
    kotlinOptions {
        jvmTarget = '1.8'
    }
    buildFeatures {
        compose true
    }
    composeOptions {
        kotlinCompilerExtensionVersion '1.2.0'
    }
    packagingOptions {
        resources {
            excludes += '/META-INF/{AL2.0,LGPL2.1}'
        }
    }
}

dependencies {

    implementation 'androidx.core:core-ktx:1.8.0'
    implementation "androidx.compose.ui:ui:$compose_version"
    implementation 'androidx.compose.material3:material3:1.0.0-alpha14'
    implementation "androidx.compose.ui:ui-tooling-preview:$compose_version"
    implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.5.0'
    implementation 'androidx.activity:activity-compose:1.5.0'
    testImplementation 'junit:junit:4.13.2'
    androidTestImplementation 'androidx.test.ext:junit:1.1.3'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'
    androidTestImplementation "androidx.compose.ui:ui-test-junit4:$compose_version"
    debugImplementation "androidx.compose.ui:ui-tooling:$compose_version"
    debugImplementation "androidx.compose.ui:ui-test-manifest:$compose_version"
}

是否有某些字符串或字符是TalkBack禁止的？

textfield

selection

android

accessibility

android-jetpack-compose

回答 2

Stack Overflow用户

发布于 2022-10-05 14:52:08

我也有同样的问题。我运行了一些测试(使用androidx.come.ui:ui:1.3.0-beta03)：

OutlinedTextField空.❌
带有占位符的OutlinedTextField .✅
带有占位符和标签的OutlinedTextField .❌
带标签的OutlinedTextField .✅
TextField空.❌
带有占位符的TextField .✅
带有占位符和标签的TextField .✅
带标签的TextField .✅

当我们把一个TextField和一个label放在一起时，placeholder和label的行为是有区别的。谷歌的问题追踪器这里、这里或这里也有类似的问题。

除了使用label和OutlinedTextField之外，我找不到其他解决方案，因为可访问性对我们来说不是可选的。我用我制作的以下示例在谷歌追踪器上发布了一个新问题，并得到了结果：

Column(
    modifier = Modifier
        .fillMaxSize()
        .padding(all = 16.dp)
        .verticalScroll(state = rememberScrollState()),
) {
    // OutlinedTextField empty.❌
    Text(text = "OutlinedTextField empty")
    Spacer(modifier = Modifier.height(height = 4.dp))
    OutlinedTextField(
        value = "",
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))

    // OutlinedTextField with placeholder.✅
    Text(text = "OutlinedTextField with placeholder")
    Spacer(modifier = Modifier.height(height = 4.dp))
    OutlinedTextField(
        value = "",
        placeholder = { Text(text = "Placeholder") },
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))

    // OutlinedTextField with placeholder and label.❌
    Text(text = "OutlinedTextField with placeholder and label")
    OutlinedTextField(
        value = "",
        placeholder = { Text(text = "Placeholder") },
        label = { Text(text = "Label") },
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))

    // OutlinedTextField with label.✅
    Text(text = "OutlinedTextField with label")
    OutlinedTextField(
        value = "",
        label = { Text(text = "Label") },
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))

    // TextField empty.❌
    Text(text = "TextField empty")
    Spacer(modifier = Modifier.height(height = 4.dp))
    TextField(
        value = "",
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))

    // TextField with placeholder.✅
    Text(text = "TextField with Placeholder")
    Spacer(modifier = Modifier.height(height = 4.dp))
    TextField(
        value = "",
        placeholder = { Text(text = "Placeholder") },
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))


    // TextField with placeholder and label.✅
    Text(text = "TextField with Placeholder and label")
    Spacer(modifier = Modifier.height(height = 4.dp))
    TextField(
        value = "",
        placeholder = { Text(text = "Placeholder") },
        label = { Text(text = "Label") },
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))

    // TextField with label.✅
    Text(text = "TextField with label")
    Spacer(modifier = Modifier.height(height = 4.dp))
    TextField(
        value = "",
        label = { Text(text = "Label") },
        onValueChange = { },
        modifier = Modifier.fillMaxWidth(),
    )
    Spacer(modifier = Modifier.height(height = 12.dp))
}

票数 3

Stack Overflow用户

发布于 2022-10-28 11:03:52

正如@BerHug注意到的那样，这里似乎有一个bug。为了让它读出来，可以通过添加语义修饰符来添加内容描述：

OutlinedTextField(
    modifier = modifier.semantics { 
        contentDescription = "this is a text entry box" 
    }, 
) {}

这也将导致屏幕阅读器添加关于如何在读取文本输入字段时激活它的附加说明。

在这些链接中有一些有用的附加信息：

https://developer.android.com/jetpack/compose/accessibility

https://bryanherbst.com/2020/11/03/compose-semantics-talkback/

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/72903512

复制

相似问题

问如果我有特殊文本作为占位符，为什么Android TalkBack不选择这个Jetpack组合OutlinedTextField？
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如果我有特殊文本作为占位符，为什么Android TalkBack不选择这个Jetpack组合OutlinedTextField？EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如果我有特殊文本作为占位符，为什么Android TalkBack不选择这个Jetpack组合OutlinedTextField？
EN