olemd/tilt-shift-camera
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Add accessibility semantics and touch targets to zoom and lens controls

Browse source 
Increase ZoomButton to 48dp minimum touch target, add Role.Button and
contentDescription/selected semantics, and use centralized AppColors.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Ole-Morten Duesund 2026-03-05 12:15:26 +01:00
commit 527c8fd0bb
2 changed files with 24 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

13
app/src/main/java/no/naiv/tiltshift/ui/LensSwitcher.kt
View file

@ -16,10 +16,16 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.Role
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.role
import androidx.compose.ui.semantics.selected
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import no.naiv.tiltshift.camera.CameraLens import no.naiv.tiltshift.camera.CameraLens
import no.naiv.tiltshift.ui.theme.AppColors
/** /**
* Lens selection UI for switching between camera lenses. * Lens selection UI for switching between camera lenses.
@ -59,9 +65,9 @@ private fun LensButton(
) { ) {
val backgroundColor by animateColorAsState( val backgroundColor by animateColorAsState(
targetValue = if (isSelected) { targetValue = if (isSelected) {
Color(0xFFFFB300) AppColors.Accent
} else { } else {
Color(0x80000000) AppColors.OverlayDark
}, },
label = "lens_button_bg" label = "lens_button_bg"
) )
@ -76,7 +82,8 @@ private fun LensButton(
.size(48.dp) .size(48.dp)
.clip(CircleShape) .clip(CircleShape)
.background(backgroundColor) .background(backgroundColor)
.clickable(onClick = onClick), .clickable(role = Role.Button, onClick = onClick)
.semantics { selected = isSelected; contentDescription = "${lens.displayName} lens" },
contentAlignment = Alignment.Center contentAlignment = Alignment.Center
) { ) {
Text( Text(

20
app/src/main/java/no/naiv/tiltshift/ui/ZoomControl.kt
View file

@ -16,9 +16,15 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.Role
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.role
import androidx.compose.ui.semantics.selected
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp import androidx.compose.ui.unit.sp
import no.naiv.tiltshift.ui.theme.AppColors
import kotlin.math.abs import kotlin.math.abs
/** /**
@ -65,9 +71,9 @@ private fun ZoomButton(
) { ) {
val backgroundColor by animateColorAsState( val backgroundColor by animateColorAsState(
targetValue = if (isSelected) { targetValue = if (isSelected) {
Color(0xFFFFB300) // Amber when selected AppColors.Accent
} else { } else {
Color(0x80000000) // Semi-transparent black AppColors.OverlayDark
}, },
label = "zoom_button_bg" label = "zoom_button_bg"
) )
@ -79,10 +85,11 @@ private fun ZoomButton(
Box( Box(
modifier = Modifier modifier = Modifier
.size(44.dp) .size(48.dp)
.clip(CircleShape) .clip(CircleShape)
.background(backgroundColor) .background(backgroundColor)
.clickable(onClick = onClick), .clickable(role = Role.Button, onClick = onClick)
.semantics { selected = isSelected; contentDescription = "${preset.label}x zoom" },
contentAlignment = Alignment.Center contentAlignment = Alignment.Center
) { ) {
Text( Text(
@ -105,8 +112,9 @@ fun ZoomIndicator(
Box( Box(
modifier = modifier modifier = modifier
.clip(CircleShape) .clip(CircleShape)
.background(Color(0x80000000)) .background(AppColors.OverlayDark)
.padding(horizontal = 12.dp, vertical = 6.dp), .padding(horizontal = 12.dp, vertical = 6.dp)
.semantics { contentDescription = "Current zoom: %.1fx".format(currentZoom) },
contentAlignment = Alignment.Center contentAlignment = Alignment.Center
) { ) {
Text( Text(