✨ Allow text delegates fallback to another one with semantics (#245)

Co-authored-by: Yaniv Shaked <[email protected]>

Author: AlexV525

lib/src/delegates/asset_picker_builder_delegate.dart

@@ -209,6 +209,9 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
 
   AssetPickerTextDelegate get textDelegate => Singleton.textDelegate;
 
+  AssetPickerTextDelegate get semanticsTextDelegate =>
+      Singleton.textDelegate.semanticsTextDelegate;
+
   /// Keep a `initState` method to sync with [State].
   /// 保留一个 `initState` 方法与 [State] 同步。
   @mustCallSuper
@@ -394,6 +397,7 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
               fontSize: 13,
               fontWeight: FontWeight.w500,
             ),
+            semanticsLabel: semanticsTextDelegate.gifIndicator,
             strutStyle: const StrutStyle(forceStrutHeight: true, height: 1),
           ),
         ),
@@ -430,6 +434,7 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
             return ScaleText(
               textDelegate.emptyList,
               maxScaleFactor: 1.5,
+              semanticsLabel: semanticsTextDelegate.emptyList,
             );
           }
           return w!;
@@ -450,6 +455,7 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
         textDelegate.loadFailed,
         textAlign: TextAlign.center,
         style: const TextStyle(fontSize: 18),
+        semanticsLabel: semanticsTextDelegate.loadFailed,
       ),
     );
   }
@@ -496,6 +502,7 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
                 style: context.themeData.textTheme.caption?.copyWith(
                   fontSize: 14,
                 ),
+                semanticsLabel: semanticsTextDelegate.accessAllTip,
               ),
             ),
             Icon(
@@ -580,12 +587,14 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
             textDelegate.unableToAccessAll,
             style: const TextStyle(fontSize: 22),
             textAlign: TextAlign.center,
+            semanticsLabel: semanticsTextDelegate.unableToAccessAll,
           ),
           SizedBox(height: size.height / 30),
           ScaleText(
             textDelegate.accessAllTip,
             style: const TextStyle(fontSize: 18),
             textAlign: TextAlign.center,
+            semanticsLabel: semanticsTextDelegate.accessAllTip,
           ),
         ],
       ),
@@ -603,6 +612,7 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
       child: ScaleText(
         textDelegate.goToSystemSettings,
         style: const TextStyle(fontSize: 17),
+        semanticsLabel: semanticsTextDelegate.goToSystemSettings,
       ),
       onPressed: PhotoManager.openSetting,
       materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
@@ -613,6 +623,7 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
       child: ScaleText(
         textDelegate.accessLimitedAssets,
         style: TextStyle(color: interactiveTextColor(context)),
+        semanticsLabel: semanticsTextDelegate.accessLimitedAssets,
       ),
     );
 
@@ -887,7 +898,7 @@ class DefaultAssetPickerBuilderDelegate
       backgroundColor: theme.appBarTheme.backgroundColor,
       centerTitle: isAppleOS,
       title: Semantics(
-        onTapHint: textDelegate.sActionSwitchPathLabel,
+        onTapHint: semanticsTextDelegate.sActionSwitchPathLabel,
         child: pathEntitySelector(context),
       ),
       leading: backButton(context),
@@ -1285,9 +1296,10 @@ class DefaultAssetPickerBuilderDelegate
             String hint = '';
             if (asset.type == AssetType.audio ||
                 asset.type == AssetType.video) {
-              hint += '${textDelegate.sNameDurationLabel}: ';
-              hint +=
-                  textDelegate.durationIndicatorBuilder(asset.videoDuration);
+              hint += '${semanticsTextDelegate.sNameDurationLabel}: ';
+              hint += semanticsTextDelegate.durationIndicatorBuilder(
+                asset.videoDuration,
+              );
             }
             if (asset.title?.isNotEmpty == true) {
               hint += ', ${asset.title}';
@@ -1297,19 +1309,19 @@ class DefaultAssetPickerBuilderDelegate
               enabled: !isBanned,
               excludeSemantics: true,
               focusable: !isSwitchingPath,
-              label: '${textDelegate.semanticTypeLabel(asset.type)}'
+              label: '${semanticsTextDelegate.semanticTypeLabel(asset.type)}'
                   '${semanticIndex(index)}, '
                   '${asset.createDateTime.toString().replaceAll('.000', '')}',
               hidden: isSwitchingPath,
               hint: hint,
               image: asset.type == AssetType.image ||
                   asset.type == AssetType.video,
               onTap: () => selectAsset(context, asset, isSelected),
-              onTapHint: textDelegate.sActionSelectHint,
+              onTapHint: semanticsTextDelegate.sActionSelectHint,
               onLongPress: isPreviewEnabled
                   ? () => _pushAssetToViewer(context, index, asset)
                   : null,
-              onLongPressHint: textDelegate.sActionPreviewHint,
+              onLongPressHint: semanticsTextDelegate.sActionPreviewHint,
               selected: isSelected,
               sortKey: OrdinalSortKey(
                 semanticIndex(index).toDouble(),
@@ -1382,9 +1394,6 @@ class DefaultAssetPickerBuilderDelegate
 
   @override
   Widget audioIndicator(BuildContext context, AssetEntity asset) {
-    final String durationText = textDelegate.durationIndicatorBuilder(
-      Duration(seconds: asset.duration),
-    );
     return Container(
       width: double.maxFinite,
       alignment: AlignmentDirectional.bottomStart,
@@ -1399,10 +1408,14 @@ class DefaultAssetPickerBuilderDelegate
       child: Padding(
         padding: const EdgeInsetsDirectional.only(start: 4),
         child: ScaleText(
-          durationText,
-          semanticsLabel: '${textDelegate.sNameDurationLabel}: '
-              '$durationText',
+          textDelegate.durationIndicatorBuilder(
+            Duration(seconds: asset.duration),
+          ),
           style: const TextStyle(fontSize: 16),
+          semanticsLabel: '${semanticsTextDelegate.sNameDurationLabel}: '
+              '${semanticsTextDelegate.durationIndicatorBuilder(
+            Duration(seconds: asset.duration),
+          )}',
         ),
       ),
     );
@@ -1470,6 +1483,10 @@ class DefaultAssetPickerBuilderDelegate
               fontSize: 17,
               fontWeight: FontWeight.normal,
             ),
+            semanticsLabel: p.isSelectedNotEmpty && !isSingleAssetMode
+                ? '${semanticsTextDelegate.confirm}'
+                    ' (${p.selectedAssets.length}/${p.maxAssets})'
+                : semanticsTextDelegate.confirm,
           ),
           onPressed: p.isSelectedNotEmpty
               ? () => Navigator.of(context).maybePop(p.selectedAssets)
@@ -1525,6 +1542,7 @@ class DefaultAssetPickerBuilderDelegate
             return ScaleText(
               textDelegate.emptyList,
               maxScaleFactor: 1.5,
+              semanticsLabel: semanticsTextDelegate.emptyList,
             );
           }
           return PlatformProgressIndicator(
@@ -1601,8 +1619,8 @@ class DefaultAssetPickerBuilderDelegate
             ValueListenableBuilder<PermissionState>(
               valueListenable: permission,
               builder: (_, PermissionState ps, Widget? child) => Semantics(
-                label: '${textDelegate.viewingLimitedAssetsTip}, '
-                    '${textDelegate.changeAccessibleLimitedAssets}',
+                label: '${semanticsTextDelegate.viewingLimitedAssetsTip}, '
+                    '${semanticsTextDelegate.changeAccessibleLimitedAssets}',
                 button: true,
                 onTap: PhotoManager.presentLimited,
                 hidden: !isPermissionLimited,
@@ -1700,6 +1718,9 @@ class DefaultAssetPickerBuilderDelegate
                       maxLines: 1,
                       overflow: TextOverflow.ellipsis,
                       maxScaleFactor: 1.2,
+                      semanticsLabel: isPermissionLimited && p.isAll
+                          ? semanticsTextDelegate.accessiblePathName
+                          : p.name,
                     ),
                   ),
                 w!,
@@ -1765,20 +1786,23 @@ class DefaultAssetPickerBuilderDelegate
       return ColoredBox(color: theme.colorScheme.primary.withOpacity(0.12));
     }
 
-    final String semanticsName = isPermissionLimited && pathEntity.isAll
+    final String name = isPermissionLimited && pathEntity.isAll
         ? textDelegate.accessiblePathName
         : pathEntity.name;
+    final String semanticsName = isPermissionLimited && pathEntity.isAll
+        ? semanticsTextDelegate.accessiblePathName
+        : pathEntity.name;
     final String semanticsCount = '${pathEntity.assetCount}';
     return Selector<DefaultAssetPickerProvider, AssetPathEntity?>(
       selector: (_, DefaultAssetPickerProvider p) => p.currentPath,
       builder: (_, AssetPathEntity? currentPathEntity, __) {
         final bool isSelected = currentPathEntity == pathEntity;
         return Semantics(
           label: '$semanticsName, '
-              '${textDelegate.sUnitAssetCountLabel}: '
+              '${semanticsTextDelegate.sUnitAssetCountLabel}: '
               '$semanticsCount',
           selected: isSelected,
-          onTapHint: textDelegate.sActionSwitchPathLabel,
+          onTapHint: semanticsTextDelegate.sActionSwitchPathLabel,
           button: false,
           child: Material(
             type: MaterialType.transparency,
@@ -1814,7 +1838,7 @@ class DefaultAssetPickerBuilderDelegate
                                     end: 10,
                                   ),
                                   child: ScaleText(
-                                    semanticsName,
+                                    name,
                                     style: const TextStyle(fontSize: 17),
                                     maxLines: 1,
                                     overflow: TextOverflow.ellipsis,
@@ -1887,7 +1911,7 @@ class DefaultAssetPickerBuilderDelegate
             enabled: p.isSelectedNotEmpty,
             focusable: !isSwitchingPath,
             hidden: isSwitchingPath,
-            onTapHint: textDelegate.sActionPreviewHint,
+            onTapHint: semanticsTextDelegate.sActionPreviewHint,
             child: child,
           ),
         );
@@ -1910,6 +1934,8 @@ class DefaultAssetPickerBuilderDelegate
                   fontSize: 17,
                 ),
                 maxScaleFactor: 1.2,
+                semanticsLabel: '${semanticsTextDelegate.preview}'
+                    '${p.isSelectedNotEmpty ? ' (${p.selectedAssets.length})' : ''}',
               ),
             ),
           ),
@@ -2071,6 +2097,10 @@ class DefaultAssetPickerBuilderDelegate
                   ),
                   maxLines: 1,
                   maxScaleFactor: 1.2,
+                  semanticsLabel:
+                      semanticsTextDelegate.durationIndicatorBuilder(
+                    Duration(seconds: asset.duration),
+                  ),
                 ),
               ),
             ),

lib/src/delegates/asset_picker_text_delegate.dart

@@ -2,6 +2,8 @@
 /// [Author] Alex (https://github.com/Alex525)
 /// [Date] 2020/4/7 10:25
 ///
+import 'dart:io' show Platform;
+
 import 'package:flutter/rendering.dart';
 import 'package:photo_manager/photo_manager.dart' show AssetType;
 
@@ -112,7 +114,6 @@ class AssetPickerTextDelegate {
   ///
   /// Fields below are only for semantics usage. For customizable these fields,
   /// head over to [EnglishAssetPickerTextDelegate] for fields understanding.
-
   String get sTypeAudioLabel => '音频';
 
   String get sTypeImageLabel => '图片';
@@ -147,6 +148,17 @@ class AssetPickerTextDelegate {
   String get sNameDurationLabel => '时长';
 
   String get sUnitAssetCountLabel => '数量';
+
+  /// Fallback delegate for semantics determined by platform.
+  ///
+  /// The purpose of this field is to provide a fallback delegate references
+  /// when a language does not supported by Talkback or VoiceOver. Set this to
+  /// another text delegate makes screen readers read accordingly.
+  ///
+  /// See also:
+  ///  * Talkback: https://support.google.com/accessibility/android/answer/11101402)
+  ///  * VoiceOver: https://support.apple.com/en-us/HT206175
+  AssetPickerTextDelegate get semanticsTextDelegate => this;
 }
 
 /// [AssetPickerTextDelegate] implements with English.
@@ -302,39 +314,46 @@ class HebrewAssetPickerTextDelegate extends AssetPickerTextDelegate {
   @override
   String get accessiblePathName => 'קבצים נגישים';
 
-  // Using English for semantics usage, since Hebrew is not supported for TalkBack.
   @override
-  String get sTypeAudioLabel => 'Audio';
+  String get sTypeAudioLabel => 'שמע';
 
   @override
-  String get sTypeImageLabel => 'Image';
+  String get sTypeImageLabel => 'תמונה';
 
   @override
-  String get sTypeVideoLabel => 'Video';
+  String get sTypeVideoLabel => 'סרטון';
 
   @override
-  String get sTypeOtherLabel => 'Other asset';
+  String get sTypeOtherLabel => 'קובץ אחר';
 
   @override
-  String get sActionPlayHint => 'play';
+  String get sActionPlayHint => 'נגן';
 
   @override
-  String get sActionPreviewHint => 'preview';
+  String get sActionPreviewHint => 'תצוגה מקדימה';
 
   @override
-  String get sActionSelectHint => 'select';
+  String get sActionSelectHint => 'בחר';
 
   @override
-  String get sActionSwitchPathLabel => 'switch path';
+  String get sActionSwitchPathLabel => 'החלף תיקייה';
 
   @override
-  String get sActionUseCameraHint => 'use camera';
+  String get sActionUseCameraHint => 'השתמש במצלמה';
 
   @override
-  String get sNameDurationLabel => 'duration';
+  String get sNameDurationLabel => 'משך';
 
   @override
-  String get sUnitAssetCountLabel => 'count';
+  String get sUnitAssetCountLabel => 'כמות';
+
+  @override
+  AssetPickerTextDelegate get semanticsTextDelegate {
+    if (Platform.isAndroid) {
+      return EnglishAssetPickerTextDelegate();
+    }
+    return this;
+  }
 }
 
 /// [AssetPickerTextDelegate] implementiert mit der deutschen Übersetzung.