Support for desktop accessibility features

Compose Multiplatform builds on top of Jetpack Compose, making most accessibility features available in common code across all platforms. The current status of accessibility support on desktop is as follows:

Platform	Accessibility status
MacOS	Fully supported
Windows	Supported via Java Access Bridge
Linux	Not supported

Enabling accessibility on Windows

Accessibility on Windows is provided via Java Access Bridge, which is disabled by default. To develop accessibility features on Windows, enable Java Access Bridge with the following command:

%JAVA_HOME%\bin\jabswitch.exe /enable

To create a native distribution that includes accessibility features, add the jdk.accessibility module using the modules DSL method:

compose.desktop {
    application {
        nativeDistributions {
            modules("jdk.accessibility")
        }
    }
}

Example: Custom button with semantic rules

Let's create a simple app with a custom button and specify explanatory text for screen reader tools. With a screen reader enabled, you will hear the "Click to increment value" text from the button description:

import androidx.compose.foundation.* import androidx.compose.foundation.layout.* import androidx.compose.material.Text import androidx.compose.runtime.* import androidx.compose.ui.* import androidx.compose.ui.graphics.Color import androidx.compose.ui.semantics.* import androidx.compose.ui.unit.* import androidx.compose.ui.window.* fun main() = singleWindowApplication( title = "Custom Button", state = WindowState(size = DpSize(300.dp, 200.dp)) ) { var count by remember { mutableStateOf(0) } Box(modifier = Modifier.padding(50.dp)) { Box(modifier = Modifier .background(Color.LightGray) .fillMaxSize() .clickable { count += 1 } // Uses text from the content .semantics(mergeDescendants = true) { // Assigns the type of UI element role = Role.Button // Adds some help text to button contentDescription = "Click to increment value" } ) { val text = when (count) { 0 -> "Click Me!" 1 -> "Clicked" else -> "Clicked $count times" } Text(text, modifier = Modifier.align(Alignment.Center), fontSize = 24.sp) } } }

To test accessibility information for the elements in your application on macOS, you can use Accessibility Inspector (Xcode | Open Developer Tool | Accessibility Inspector):

On Windows, you can use the Show Speech History feature in JAWS or the Speech Viewer in NVDA:

For more examples, refer to the Accessibility in Jetpack Compose guide.

What's next?

Explore the tutorials about other desktop components.

Last modified: 03 December 2024