Jetpack 为 Button 和 IconButton 组合 onClickLabel

Question

致力于我的应用程序的可访问性增强。

从Docs中，我可以看到Card具有onClick和onClickLabel作为 API 的一部分。

对于没有onClick的可组合项，我们可以使用Modifier.clickable或Modifier.semantics 。

但是Button 、 IconButton 、 FloatingActionButton 、 TextButton和OutlinedButton呢？
具有onClick作为 API 的一部分但没有onClickLabel的可组合项。

这按预期工作。 但这是编写这段代码的正确方法吗？

IconButton(
    onClick = navigateUp,
    modifier = Modifier.clickable(
        onClickLabel = "Navigate up",
        onClick = {},
    )
) {
    Icon(
        imageVector = Icons.Rounded.ArrowBack,
        contentDescription = stringResource(
            id = R.string.top_app_bar_content_description_navigate_up,
        ),
    )
}

这似乎太混乱了，因为IconButton期望onClick 。 所以我不能 go 完全Modifier.clickable或Modifier.semantics 。
同样， Modifier.clickable也需要onClick 。

因此，我有两个onClick用于单个可组合组件，这很容易导致很多难以调试的错误。

改变的原因，
阅读“双击向上导航”而不是默认的“双击激活”。

附言：
撰写版本 - 1.0.4

Answer 1

在这种情况下您不需要Modifier.clickable ，因为：

• IconButton 已经通过其onClick lambda 处理点击
• Icon有一个用于辅助功能的contentDescription字段

所以你只需要这个

IconButton(
    onClick = navigateUp,
) {
    Icon(
        imageVector = Icons.Rounded.ArrowBack,
        contentDescription = stringResource(
            id = R.string.top_app_bar_content_description_navigate_up,
        ),
   )
}

Answer 2

它似乎不是最漂亮的解决方案，但我最终做了：

      IconButton(
        modifier = Modifier.size(40.dp).clearAndSetSemantics {
            this.onClick(label = closeLabelDescription, action = null)
            this.contentDescription = closeDescription
            this.role = Role.Button
        },
        onClick = onClickClose,
    ) {
        Icon(
            painter = painterResource(R.drawable.ic_close),
            tint = RiotWhite,
            contentDescription = null
        )
    }