Skip to content

[media-ui]Centralize volume button accessibility semantics in VolumeScreen #2742

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
yschimke merged 6 commits into from
Jul 29, 2026
Merged

[media-ui]Centralize volume button accessibility semantics in VolumeScreen #2742

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
60951cc
Centralize volume button accessibility semantics in VolumeScreen
dianastefan12 Jul 17, 2026
3d39e68
Centralize volume button accessibility semantics in VolumeScreen
dianastefan12 Jul 27, 2026
47199b9
Centralize volume button accessibility semantics in VolumeScreen - re…
dianastefan12 Jul 27, 2026
5632190
Centralize volume button accessibility semantics in VolumeScreen
dianastefan12 Jul 28, 2026
4c472a3
Merge remote-tracking branch 'origin/fix-volume-accessibility' into f…
dianastefan12 Jul 28, 2026
b99ea68
Merge branch 'main' into fix-volume-accessibility
yschimke Jul 29, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions gradle.properties
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,3 +72,6 @@ strict.build=false

# media3 checkout
media3Checkout=

# Enabled parallel sync for Gradle 9.4+
org.gradle.tooling.parallel=true
27 changes: 25 additions & 2 deletions ...-material3/src/main/java/com/google/android/horologist/audio/ui/material3/VolumeScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.semantics.LiveRegionMode
import androidx.compose.ui.semantics.clearAndSetSemantics
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.liveRegion
import androidx.compose.ui.semantics.semantics
Expand Down Expand Up @@ -292,6 +293,10 @@ public fun VolumeScreen(
if (showVolumeIndicator) {
VolumeLevelIndicator(volumeUiState = volume, colorScheme = colorScheme)
}
val increaseContentDesc =
stringResource(id = R.string.horologist_volume_screen_volume_up_content_description)
val decreaseContentDesc =
stringResource(id = R.string.horologist_volume_screen_volume_down_content_description)
Stepper(
modifier =
modifier.semantics {
Expand All @@ -301,8 +306,26 @@ public fun VolumeScreen(
value = currentValue,
onValueChange = { if (it > volumeState.current) increaseVolume() else decreaseVolume() },
steps = volumeState.max - 1,
increaseIcon = { increaseIcon() },
decreaseIcon = { decreaseIcon() },
increaseIcon = {
Box(
modifier =
Modifier.clearAndSetSemantics {
contentDescription = increaseContentDesc
}
) {
increaseIcon()
}
},
decreaseIcon = {
Box(
modifier =
Modifier.clearAndSetSemantics {
contentDescription = decreaseContentDesc
}
) {
decreaseIcon()
}
},
colors =
StepperDefaults.colors(
contentColor = colorScheme.onSurface,
Expand Down
26 changes: 22 additions & 4 deletions media/audio-ui/src/main/java/com/google/android/horologist/audio/ui/VolumeScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
package com.google.android.horologist.audio.ui

import android.media.AudioManager
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material.icons.Icons
Expand All @@ -33,10 +34,9 @@ import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.semantics.LiveRegionMode
import androidx.compose.ui.semantics.Role
import androidx.compose.ui.semantics.clearAndSetSemantics
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.liveRegion
import androidx.compose.ui.semantics.role
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextOverflow
Expand Down Expand Up @@ -206,6 +206,10 @@ internal fun VolumeScreen(
} else {
stringResource(id = R.string.horologist_volume_screen_volume_percent, volumePercent)
}
val increaseContentDesc =
stringResource(id = R.string.horologist_volume_screen_volume_up_content_description)
val decreaseContentDesc =
stringResource(id = R.string.horologist_volume_screen_volume_down_content_description)
Stepper(
modifier = modifier.semantics {
liveRegion = LiveRegionMode.Assertive
Expand All @@ -216,10 +220,24 @@ internal fun VolumeScreen(
steps = volumeState.max - 1,
valueRange = (0f..volumeState.max.toFloat()),
increaseIcon = {
Box(
modifier =
Modifier.clearAndSetSemantics {
contentDescription = increaseContentDesc
}
) {
increaseIcon()
}
},
decreaseIcon = {
Box(
modifier =
Modifier.clearAndSetSemantics {
contentDescription = decreaseContentDesc
}
) {
decreaseIcon()
}
},
enableRangeSemantics = false,
) {
Expand All @@ -237,7 +255,7 @@ public object VolumeScreenDefaults {
@Composable
public fun IncreaseIcon() {
Icon(
modifier = Modifier.size(26.dp).semantics { role = Role.Button },
modifier = Modifier.size(26.dp),
paintable = Icons.AutoMirrored.Outlined.VolumeUp.asPaintable(),
contentDescription = stringResource(id = R.string.horologist_volume_screen_volume_up_content_description),
)
Expand All @@ -246,7 +264,7 @@ public object VolumeScreenDefaults {
@Composable
public fun DecreaseIcon() {
Icon(
modifier = Modifier.size(26.dp).semantics { role = Role.Button },
modifier = Modifier.size(26.dp),
paintable = Icons.AutoMirrored.Outlined.VolumeDown.asPaintable(),
contentDescription = stringResource(id = R.string.horologist_volume_screen_volume_down_content_description),
)
Expand Down
Loading