fix-talkback-slide-button-accessibility (#2200)

* fix:talkback send slide button accessibility

* fix accessible button color
This commit is contained in:
Serhii 2025-04-14 15:30:41 +03:00 committed by GitHub
parent ce12f517f4
commit 990feb48ec
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 144 additions and 123 deletions

View file

@ -33,7 +33,7 @@ abstract class BaseBottomSheet extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
if (titleIconPath != null) if (titleIconPath != null)
Image.asset(titleIconPath!, height: 24, width: 24) Image.asset(titleIconPath!, height: 24, width: 24, excludeFromSemantics: true)
else else
Container(), Container(),
const SizedBox(width: 6), const SizedBox(width: 6),

View file

@ -223,6 +223,7 @@ class ConfirmSendingBottomSheet extends BaseBottomSheet {
onSlideComplete: onSlideComplete, onSlideComplete: onSlideComplete,
buttonText: 'Swipe to send', buttonText: 'Swipe to send',
currentTheme: currentTheme, currentTheme: currentTheme,
accessibleNavigationModeButtonText: S.of(context).send,
), ),
); );
} }
@ -248,7 +249,10 @@ class StandardTile extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Semantics(
container: true,
label: itemTitle,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8), padding: const EdgeInsets.symmetric(horizontal: 14, vertical: 8),
decoration: decoration:
BoxDecoration(borderRadius: BorderRadius.circular(10), color: tileBackgroundColor), BoxDecoration(borderRadius: BorderRadius.circular(10), color: tileBackgroundColor),
@ -267,6 +271,7 @@ class StandardTile extends StatelessWidget {
), ),
], ],
), ),
),
); );
} }
} }
@ -357,7 +362,10 @@ class AddressExpansionTile extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Semantics(
container: true,
label: name,
child: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.all(Radius.circular(10)), borderRadius: BorderRadius.all(Radius.circular(10)),
color: tileBackgroundColor, color: tileBackgroundColor,
@ -408,6 +416,7 @@ class AddressExpansionTile extends StatelessWidget {
), ),
), ),
), ),
),
); );
} }
} }

View file

@ -1,3 +1,4 @@
import 'package:cake_wallet/src/widgets/primary_button.dart';
import 'package:cake_wallet/themes/extensions/cake_text_theme.dart'; import 'package:cake_wallet/themes/extensions/cake_text_theme.dart';
import 'package:cake_wallet/themes/extensions/filter_theme.dart'; import 'package:cake_wallet/themes/extensions/filter_theme.dart';
import 'package:cake_wallet/themes/extensions/menu_theme.dart'; import 'package:cake_wallet/themes/extensions/menu_theme.dart';
@ -12,12 +13,14 @@ class StandardSlideButton extends StatefulWidget {
this.buttonText = '', this.buttonText = '',
this.height = 48.0, this.height = 48.0,
required this.currentTheme, required this.currentTheme,
required this.accessibleNavigationModeButtonText,
}) : super(key: key); }) : super(key: key);
final VoidCallback onSlideComplete; final VoidCallback onSlideComplete;
final String buttonText; final String buttonText;
final double height; final double height;
final ThemeBase currentTheme; final ThemeBase currentTheme;
final String accessibleNavigationModeButtonText;
@override @override
_StandardSlideButtonState createState() => _StandardSlideButtonState(); _StandardSlideButtonState createState() => _StandardSlideButtonState();
@ -28,11 +31,7 @@ class _StandardSlideButtonState extends State<StandardSlideButton> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return LayoutBuilder(builder: (context, constraints) { final bool accessible = MediaQuery.of(context).accessibleNavigation;
final double maxWidth = constraints.maxWidth;
const double sideMargin = 4.0;
final double effectiveMaxWidth = maxWidth - 2 * sideMargin;
const double sliderWidth = 42.0;
final tileBackgroundColor = widget.currentTheme.type == ThemeType.light final tileBackgroundColor = widget.currentTheme.type == ThemeType.light
? Theme.of(context).extension<SyncIndicatorTheme>()!.syncedBackgroundColor ? Theme.of(context).extension<SyncIndicatorTheme>()!.syncedBackgroundColor
@ -40,11 +39,22 @@ class _StandardSlideButtonState extends State<StandardSlideButton> {
? Colors.black.withOpacity(0.5) ? Colors.black.withOpacity(0.5)
: Theme.of(context).extension<FilterTheme>()!.buttonColor; : Theme.of(context).extension<FilterTheme>()!.buttonColor;
return accessible
? PrimaryButton(
text: widget.accessibleNavigationModeButtonText,
color: Theme.of(context).primaryColor,
textColor: Colors.white,
onPressed: () => widget.onSlideComplete())
: LayoutBuilder(builder: (context, constraints) {
final double maxWidth = constraints.maxWidth;
const double sideMargin = 4.0;
final double effectiveMaxWidth = maxWidth - 2 * sideMargin;
const double sliderWidth = 42.0;
return Container( return Container(
height: widget.height, height: widget.height,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10), borderRadius: BorderRadius.circular(10), color: tileBackgroundColor),
color: tileBackgroundColor),
child: Stack( child: Stack(
alignment: Alignment.centerLeft, alignment: Alignment.centerLeft,
children: [ children: [
@ -83,7 +93,9 @@ class _StandardSlideButtonState extends State<StandardSlideButton> {
), ),
alignment: Alignment.center, alignment: Alignment.center,
child: Icon(Icons.arrow_forward, child: Icon(Icons.arrow_forward,
color: widget.currentTheme.type == ThemeType.bright ? Theme.of(context).extension<CakeMenuTheme>()!.backgroundColor : Theme.of(context).extension<FilterTheme>()!.buttonColor), color: widget.currentTheme.type == ThemeType.bright
? Theme.of(context).extension<CakeMenuTheme>()!.backgroundColor
: Theme.of(context).extension<FilterTheme>()!.buttonColor),
), ),
), ),
) )