Skip to content

无障碍 (Accessibility)

源:Compose 无障碍功能

构建无障碍应用不仅是法律要求,也是为了服务更广泛的用户群体(包括视障、行动不便的用户)。Compose 使用 Semantics (语义) 树来向无障碍服务(如 TalkBack)传递信息。

1. 基础属性

contentDescription

对于图片、图标,必须提供描述。如果仅用于装饰,设为 null

kotlin
Image(
    painter = painterResource(R.drawable.profile),
    contentDescription = "用户头像" // TalkBack 会朗读“用户头像”
)

Icon(
    imageVector = Icons.Default.ArrowForward,
    contentDescription = null // 装饰性图标,TalkBack 会跳过
)

点击标签 (Click Label)

kotlin
// 默认朗读:“点击即可激活”
// 自定义后朗读:“点击即可 播放音乐”
Modifier.clickable(
    onClickLabel = "播放音乐",
    onClick = { /*...*/ }
)

2. 合并语义 (Merging Semantics)

有时我们希望将多个小组件作为一个整体来朗读(例如一个包含图片和两行文字的卡片)。

kotlin
Row(
    modifier = Modifier
        .clickable { /*...*/ }
        .semantics(mergeDescendants = true) { } // 关键:合并子项语义
) {
    Image(...)
    Column {
        Text("标题")
        Text("副标题")
    }
}

现在 TalkBack 选中这一行时,会一次性朗读:“标题,副标题,双击即可激活”。

3. 标题 (Headings)

标记文本为标题,方便用户按标题导航。

kotlin
Text(
    text = "热门新闻",
    modifier = Modifier.semantics { heading() }
)

4. 自定义操作 (Custom Actions)

kotlin
Modifier.semantics {
    // 添加自定义无障碍操作
    customActions = listOf(
        CustomAccessibilityAction(label = "删除") {
            deleteItem()
            true
        }
    )
}