Sulkta-Coop/element-x-ada
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[a11y] Improve accessibility of screen headers.

Browse source
This commit is contained in:
Benoit Marty 2026-05-20 15:39:11 +02:00
parent 64d9336901
commit 620f1865e8
4 changed files with 36 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

16
features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/threads/list/ThreadsListView.kt
View file

@ -31,6 +31,9 @@ import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.semantics.clearAndSetSemantics
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.heading
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import io.element.android.compound.theme.ElementTheme
@ -79,7 +82,18 @@ fun ThreadsListView(
topBar = {
TopAppBar(
title = {
Row(horizontalArrangement = Arrangement.spacedBy(8.dp), verticalAlignment = Alignment.CenterVertically) {
val description = stringResource(
CommonStrings.a11y_threads_in_room,
state.roomName,
)
Row(
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.clearAndSetSemantics {
heading()
contentDescription = description
},
) {
Avatar(
avatarData = AvatarData(
id = state.roomId.value,

8
features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/topbars/MessagesViewTopBar.kt
View file

@ -80,7 +80,8 @@ internal fun MessagesViewTopBar(
Row(
modifier = Modifier
.clip(roundedCornerShape)
.clickable { onRoomDetailsClick() },
.clickable { onRoomDetailsClick() }
.semantics { heading() },
horizontalArrangement = Arrangement.spacedBy(4.dp),
verticalAlignment = Alignment.CenterVertically,
) {
@ -158,10 +159,7 @@ private fun RoomAvatarAndNameRow(
)
Text(
modifier = Modifier
.padding(start = 8.dp)
.semantics {
heading()
},
.padding(start = 8.dp),
text = roomName ?: stringResource(CommonStrings.common_no_room_name),
style = ElementTheme.typography.fontBodyLgMedium,
fontStyle = FontStyle.Italic.takeIf { roomName == null },

23
features/messages/impl/src/main/kotlin/io/element/android/features/messages/impl/topbars/ThreadTopBar.kt
View file

@ -17,8 +17,9 @@ import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.semantics.clearAndSetSemantics
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.heading
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.text.font.FontStyle
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
@ -58,7 +59,18 @@ internal fun ThreadTopBar(
BackButton(onClick = onBackClick)
},
title = {
Row(verticalAlignment = Alignment.CenterVertically) {
val name = roomName ?: stringResource(CommonStrings.common_no_room_name)
val description = stringResource(
CommonStrings.a11y_thread_in_room,
name,
)
Row(
verticalAlignment = Alignment.CenterVertically,
modifier = Modifier.clearAndSetSemantics {
heading()
contentDescription = description
},
) {
Avatar(
avatarData = roomAvatarData,
avatarType = AvatarType.Room(
@ -69,17 +81,14 @@ internal fun ThreadTopBar(
Column(
modifier = Modifier
.fillMaxWidth()
.padding(horizontal = 8.dp)
.semantics {
heading()
},
.padding(horizontal = 8.dp),
) {
Text(
text = stringResource(CommonStrings.common_thread),
style = ElementTheme.typography.fontBodyLgMedium,
)
Text(
text = roomName ?: stringResource(CommonStrings.common_no_room_name),
text = name,
style = ElementTheme.typography.fontBodySmRegular,
fontStyle = FontStyle.Italic.takeIf { roomName == null },
color = ElementTheme.colors.textSecondary,

2
libraries/ui-strings/src/main/res/values/localazy.xml
View file

@ -54,6 +54,8 @@
<string name="a11y_start_call">"Start a call"</string>
<string name="a11y_start_video_call">"Start a video call"</string>
<string name="a11y_start_voice_call">"Start a voice call"</string>
<string name="a11y_thread_in_room">"Thread in %1$s"</string>
<string name="a11y_threads_in_room">"Threads in %1$s"</string>
<string name="a11y_tombstoned_room">"Tombstoned room"</string>
<string name="a11y_user_avatar">"User avatar"</string>
<string name="a11y_user_menu">"User menu"</string>