Unfortunately, From v0.13.0 (especially from PR <a class="issue-link js-issue-link" da

Restore Settings accessibility about accrescent HOT 5 CLOSED

PatrykMis commented on July 23, 2024

Restore Settings accessibility

from accrescent.

Comments (5)

lberrymage commented on July 23, 2024 1

Thank you for making me aware of this so quickly and linking to the documentation! I'll admit, this wasn't on my mind when reviewing that PR. I'll review those links and try to make myself more conscientious of accessibility implications for future changes.

Once that PR is approved I'll cut a bugfix release to address these issues.

from accrescent.

lberrymage commented on July 23, 2024 1

That could very well have something to do with the somewhat hacky way the top app bar is handled currently.

accrescent/app/src/main/java/app/accrescent/client/ui/MainActivity.kt

Lines 147 to 192 in d654d55

 topBar = { 

 // This little hack is used to ensure smooth transition animations when navigating 

 // between AppListScreen and AppDetailsScreen. LookaheadLayout may provide a simpler 

 // solution once Compose 1.3.0 becomes stable. 

 AnimatedVisibility( 

 visible = currentDestination?.route == "${Screen.AppDetails.route}/{appId}", 

 enter = fadeIn(animationSpec = tween(400)), 

 exit = fadeOut(animationSpec = tween(400)), 

 ) { 

 CenterAlignedTopAppBar(title = {}) 

 } 

 AnimatedVisibility( 

 visible = currentDestination?.route == Screen.Settings.route, 

 enter = fadeIn(animationSpec = tween(400)), 

 exit = fadeOut(animationSpec = tween(400)), 

 ) { 

 LargeTopAppBar( 

 title = { Text(stringResource(R.string.settings)) }, 

 scrollBehavior = settingsScrollBehavior, 

 navigationIcon = { 

 IconButton(onClick = { navController.popBackStack() }) { 

 Icon(Icons.Default.ArrowBack, stringResource(R.string.back_button)) 

 } 

 }, 

 ) 

 } 

 AnimatedVisibility( 

 visible = currentDestination?.route != "${Screen.AppDetails.route}/{appId}" 

 && currentDestination?.route != Screen.Settings.route, 

 enter = fadeIn(animationSpec = tween(400)), 

 exit = fadeOut(animationSpec = tween(400)), 

 ) { 

 SearchAppBar( 

 value = searchQuery, 

 // keep the search bar open if query is not empty when returning from an other screen 

 expandedInitially = searchQuery.value.text.isNotEmpty() 

 ) { 

 IconButton(onClick = { navController.navigate(Screen.Settings.route) }) { 

 Icon( 

 imageVector = Screen.Settings.navIconSelected!!, 

 contentDescription = stringResource(Screen.Settings.resourceId) 

 ) 

 } 

 } 

 } 

 },

I wouldn't be surprised if a proper refactor of that code fixed the focus order.

from accrescent.

PatrykMis commented on July 23, 2024

I'll look into it and try to improve as much as I can in next few days.

from accrescent.

PatrykMis commented on July 23, 2024

checklist:

Remove "App icon" from contentDescription because its repetition when navigating across apps list isn't nessesary.
Make back button (if present) and top bar the first elements on the screen when navigating via TalkBack. It is rule of thumb for all AOSP and 3rd party accessible apps.
Make settings entries properly marked as switches and announce their states.

from accrescent.

PatrykMis commented on July 23, 2024

In my PR, the only thing I can't do is focus order , but, in fact, it is not related to v0.13.0 but v0.11.0 or something like that.

in regular apps, focus order is the following: top bar (eventual back button, app name, more controls like settings, search etc.), main content, bottom sheet (here would be Apps/Installed/Updates).

In Accrescent currently it is: main content, top bar, bottom sheet.

Unfortunately, it's out of my knowledge to fix it properly. What I have noticed: proper order in the code usually means proper focus order. You can see it e.g. here.

from accrescent.

Restore Settings accessibility about accrescent HOT 5 CLOSED

Comments (5)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent

	topBar = {
	// This little hack is used to ensure smooth transition animations when navigating
	// between AppListScreen and AppDetailsScreen. LookaheadLayout may provide a simpler
	// solution once Compose 1.3.0 becomes stable.
	AnimatedVisibility(
	visible = currentDestination?.route == "${Screen.AppDetails.route}/{appId}",
	enter = fadeIn(animationSpec = tween(400)),
	exit = fadeOut(animationSpec = tween(400)),
	) {
	CenterAlignedTopAppBar(title = {})
	}
	AnimatedVisibility(
	visible = currentDestination?.route == Screen.Settings.route,
	enter = fadeIn(animationSpec = tween(400)),
	exit = fadeOut(animationSpec = tween(400)),
	) {
	LargeTopAppBar(
	title = { Text(stringResource(R.string.settings)) },
	scrollBehavior = settingsScrollBehavior,
	navigationIcon = {
	IconButton(onClick = { navController.popBackStack() }) {
	Icon(Icons.Default.ArrowBack, stringResource(R.string.back_button))
	}
	},
	)
	}
	AnimatedVisibility(
	visible = currentDestination?.route != "${Screen.AppDetails.route}/{appId}"
	&& currentDestination?.route != Screen.Settings.route,
	enter = fadeIn(animationSpec = tween(400)),
	exit = fadeOut(animationSpec = tween(400)),
	) {
	SearchAppBar(
	value = searchQuery,
	// keep the search bar open if query is not empty when returning from an other screen
	expandedInitially = searchQuery.value.text.isNotEmpty()
	) {
	IconButton(onClick = { navController.navigate(Screen.Settings.route) }) {
	Icon(
	imageVector = Screen.Settings.navIconSelected!!,
	contentDescription = stringResource(Screen.Settings.resourceId)
	)
	}
	}
	}
	},