♿️ Fix semantics issues (#672)

Update according to the feedback from @luomo-pro
fluttercandies · Dec 28, 2024 · fa258ea · fa258ea
1 parent b03511c
commit fa258ea
Show file tree

Hide file tree

Showing 4 changed files with 42 additions and 35 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -9,7 +9,9 @@ that can be found in the LICENSE file. -->
 
 ## Unreleased
 
-*None.*
+### Fixes
+
+- Fixes semantics issues.
 
 ## 9.4.2
 
@@ -146,7 +148,7 @@ that can be found in the LICENSE file. -->
 
 ### Improvements
 
-- Improve code formatting. 
+- Improve code formatting.
 
 ## 9.0.0
 
@@ -900,7 +902,7 @@ To know more about breaking changes, see [Migration Guide][].
 
 ## 1.4.1
 
-- Remove the loading indicator for the  image widget.
+- Remove the loading indicator for the image widget.
 - Refactor the video page's initialization for ratio update.
 - Using constants to store text delegate.
 - Add error catching for main methods.

diff --git a/lib/src/delegates/asset_picker_builder_delegate.dart b/lib/src/delegates/asset_picker_builder_delegate.dart
@@ -620,7 +620,11 @@ abstract class AssetPickerBuilderDelegate<Asset, Path> {
         tooltip: MaterialLocalizations.of(context).closeButtonTooltip,
         icon: Icon(
           Icons.close,
-          semanticLabel: MaterialLocalizations.of(context).closeButtonTooltip,
+          semanticLabel: switch (Theme.of(context).platform) {
+            TargetPlatform.android =>
+              MaterialLocalizations.of(context).closeButtonTooltip,
+            _ => null,
+          },
         ),
       ),
     );
@@ -1488,28 +1492,24 @@ class DefaultAssetPickerBuilderDelegate
               asset.toString(),
             );
             final int selectedIndex = p.selectedAssets.indexOf(asset) + 1;
-            String hint = '';
-            if (asset.type == AssetType.audio ||
-                asset.type == AssetType.video) {
-              hint += '${semanticsTextDelegate.sNameDurationLabel}: ';
-              hint += semanticsTextDelegate.durationIndicatorBuilder(
-                asset.videoDuration,
-              );
-            }
-            if (asset.title?.isNotEmpty ?? false) {
-              hint += ', ${asset.title}';
-            }
+            final labels = <String>[
+              '${semanticsTextDelegate.semanticTypeLabel(asset.type)}'
+                  '${semanticIndex(index)}',
+              asset.createDateTime.toString().replaceAll('.000', ''),
+              if (asset.type == AssetType.audio ||
+                  asset.type == AssetType.video)
+                '${semanticsTextDelegate.sNameDurationLabel}: '
+                    '${semanticsTextDelegate.durationIndicatorBuilder(asset.videoDuration)}',
+              if (asset.title case final title? when title.isNotEmpty) title,
+            ];
             return Semantics(
               key: ValueKey('${asset.id}-semantics'),
               button: false,
               enabled: !isBanned,
               excludeSemantics: true,
               focusable: !isSwitchingPath,
-              label: '${semanticsTextDelegate.semanticTypeLabel(asset.type)}'
-                  '${semanticIndex(index)}, '
-                  '${asset.createDateTime.toString().replaceAll('.000', '')}',
+              label: labels.join(', '),
               hidden: isSwitchingPath,
-              hint: hint,
               image: asset.type == AssetType.image ||
                   asset.type == AssetType.video,
               onTap: () {

diff --git a/lib/src/delegates/asset_picker_viewer_builder_delegate.dart b/lib/src/delegates/asset_picker_viewer_builder_delegate.dart
@@ -460,20 +460,18 @@ class DefaultAssetPickerViewerBuilderDelegate
           final bool isSelected =
               (p?.currentlySelectedAssets ?? selectedAssets)?.contains(asset) ??
                   false;
-          String hint = '';
-          if (asset.type == AssetType.audio || asset.type == AssetType.video) {
-            hint += '${semanticsTextDelegate.sNameDurationLabel}: ';
-            hint += textDelegate.durationIndicatorBuilder(asset.videoDuration);
-          }
-          if (asset.title?.isNotEmpty ?? false) {
-            hint += ', ${asset.title}';
-          }
+          final labels = <String>[
+            '${semanticsTextDelegate.semanticTypeLabel(asset.type)}'
+                '${index + 1}',
+            asset.createDateTime.toString().replaceAll('.000', ''),
+            if (asset.type == AssetType.audio || asset.type == AssetType.video)
+              '${semanticsTextDelegate.sNameDurationLabel}: '
+                  '${semanticsTextDelegate.durationIndicatorBuilder(asset.videoDuration)}',
+            if (asset.title case final title? when title.isNotEmpty) title,
+          ];
           return Semantics(
-            label: '${semanticsTextDelegate.semanticTypeLabel(asset.type)}'
-                '${index + 1}, '
-                '${asset.createDateTime.toString().replaceAll('.000', '')}',
+            label: labels.join(', '),
             selected: isSelected,
-            hint: hint,
             image:
                 asset.type == AssetType.image || asset.type == AssetType.video,
             child: w,
@@ -737,7 +735,11 @@ class DefaultAssetPickerViewerBuilderDelegate
           tooltip: MaterialLocalizations.of(context).backButtonTooltip,
           icon: Icon(
             Icons.arrow_back_ios_new,
-            semanticLabel: MaterialLocalizations.of(context).backButtonTooltip,
+            semanticLabel: switch (Theme.of(context).platform) {
+              TargetPlatform.android =>
+                MaterialLocalizations.of(context).backButtonTooltip,
+              _ => null,
+            },
           ),
         ),
       ),

diff --git a/lib/src/widget/builder/audio_page_builder.dart b/lib/src/widget/builder/audio_page_builder.dart
@@ -141,9 +141,12 @@ class _AudioPageBuilderState extends State<AudioPageBuilder> {
   /// Title widget.
   /// 标题组件
   Widget get titleWidget {
-    return ScaleText(
-      widget.asset.title ?? '',
-      style: const TextStyle(fontSize: 20, fontWeight: FontWeight.normal),
+    // Excluding audio title from semantics since the label already includes.
+    return ExcludeSemantics(
+      child: ScaleText(
+        widget.asset.title ?? '',
+        style: const TextStyle(fontSize: 20, fontWeight: FontWeight.normal),
+      ),
     );
   }