add direction to CupertinoPickerDefaultSelectionOverlay (#92959)

packages/flutter/lib/src/cupertino/date_picker.dart

@@ -64,9 +64,9 @@ void _animateColumnControllerToItem(FixedExtentScrollController controller, int
   );
 }
 
-const Widget _leftSelectionOverlay = CupertinoPickerDefaultSelectionOverlay(capRightEdge: false);
-const Widget _centerSelectionOverlay = CupertinoPickerDefaultSelectionOverlay(capLeftEdge: false, capRightEdge: false);
-const Widget _rightSelectionOverlay = CupertinoPickerDefaultSelectionOverlay(capLeftEdge: false);
+const Widget _startSelectionOverlay = CupertinoPickerDefaultSelectionOverlay(capEndEdge: false);
+const Widget _centerSelectionOverlay = CupertinoPickerDefaultSelectionOverlay(capStartEdge: false, capEndEdge: false);
+const Widget _endSelectionOverlay = CupertinoPickerDefaultSelectionOverlay(capStartEdge: false);
 
 // Lays out the date picker based on how much space each single column needs.
 //
@@ -1013,14 +1013,14 @@ class _CupertinoDatePickerDateTimeState extends State<CupertinoDatePicker> {
       Widget selectionOverlay = _centerSelectionOverlay;
       if (i == 0) {
         offAxisFraction = -_kMaximumOffAxisFraction * textDirectionFactor;
-        selectionOverlay = _leftSelectionOverlay;
+        selectionOverlay = _startSelectionOverlay;
       } else if (i >= 2 || columnWidths.length == 2)
         offAxisFraction = _kMaximumOffAxisFraction * textDirectionFactor;
 
       EdgeInsets padding = const EdgeInsets.only(right: _kDatePickerPadSize);
       if (i == columnWidths.length - 1) {
         padding = padding.flipped;
-        selectionOverlay = _rightSelectionOverlay;
+        selectionOverlay = _endSelectionOverlay;
       }
       if (textDirectionFactor == -1)
         padding = padding.flipped;
@@ -1404,9 +1404,9 @@ class _CupertinoDatePickerDateState extends State<CupertinoDatePicker> {
 
       Widget selectionOverlay = _centerSelectionOverlay;
       if (i == 0)
-        selectionOverlay = _leftSelectionOverlay;
+        selectionOverlay = _startSelectionOverlay;
       else if (i == columnWidths.length - 1)
-        selectionOverlay = _rightSelectionOverlay;
+        selectionOverlay = _endSelectionOverlay;
 
       pickers.add(LayoutId(
         id: i,
@@ -2035,14 +2035,14 @@ class _CupertinoTimerPickerState extends State<CupertinoTimerPicker> {
                       start: hourColumnStartPadding,
                       end: pickerColumnWidth - hourColumnStartPadding - hourLabelContentWidth,
                   ),
-                  _leftSelectionOverlay,
+                  _startSelectionOverlay,
               ),
               _buildMinuteColumn(
                   EdgeInsetsDirectional.only(
                       start: pickerColumnWidth - minuteColumnEndPadding - minuteLabelContentWidth,
                       end: minuteColumnEndPadding,
                   ),
-                  _rightSelectionOverlay,
+                  _endSelectionOverlay,
               ),
             ];
             break;
@@ -2064,14 +2064,14 @@ class _CupertinoTimerPickerState extends State<CupertinoTimerPicker> {
                       start: minuteColumnStartPadding,
                       end: pickerColumnWidth - minuteColumnStartPadding - minuteLabelContentWidth,
                   ),
-                  _leftSelectionOverlay,
+                  _startSelectionOverlay,
               ),
               _buildSecondColumn(
                   EdgeInsetsDirectional.only(
                       start: pickerColumnWidth - secondColumnEndPadding - minuteLabelContentWidth,
                       end: secondColumnEndPadding,
                   ),
-                  _rightSelectionOverlay,
+                  _endSelectionOverlay,
               ),
             ];
             break;
@@ -2089,7 +2089,7 @@ class _CupertinoTimerPickerState extends State<CupertinoTimerPicker> {
                       start: _kTimerPickerMinHorizontalPadding,
                       end: math.max(hourColumnEndPadding, 0),
                   ),
-                  _leftSelectionOverlay,
+                  _startSelectionOverlay,
               ),
               _buildMinuteColumn(
                   EdgeInsetsDirectional.only(
@@ -2103,7 +2103,7 @@ class _CupertinoTimerPickerState extends State<CupertinoTimerPicker> {
                       start: math.max(secondColumnStartPadding, 0),
                       end: _kTimerPickerMinHorizontalPadding,
                   ),
-                  _rightSelectionOverlay,
+                  _endSelectionOverlay,
               ),
             ];
             break;

packages/flutter/lib/src/cupertino/picker.dart

@@ -324,7 +324,7 @@ class _CupertinoPickerState extends State<CupertinoPicker> {
 /// rectangle that spans the entire multi-column picker.
 /// To achieve the same effect using [CupertinoPickerDefaultSelectionOverlay],
 /// the additional margin and corner radii on the left or the right side can be
-/// disabled by turning off [capLeftEdge] and [capRightEdge], so this selection
+/// disabled by turning off [capStartEdge] and [capEndEdge], so this selection
 /// overlay visually connects with selection overlays of adjoining
 /// [CupertinoPicker]s (i.e., other "column"s).
 ///
@@ -340,25 +340,25 @@ class CupertinoPickerDefaultSelectionOverlay extends StatelessWidget {
   /// The [background] argument default value is [CupertinoColors.tertiarySystemFill].
   /// It must be non-null.
   ///
-  /// The [capLeftEdge] and [capRightEdge] arguments decide whether to add a
+  /// The [capStartEdge] and [capEndEdge] arguments decide whether to add a
   /// default margin and use rounded corners on the left and right side of the
   /// rectangular overlay.
   /// Default to true and must not be null.
   const CupertinoPickerDefaultSelectionOverlay({
     Key? key,
     this.background = CupertinoColors.tertiarySystemFill,
-    this.capLeftEdge = true,
-    this.capRightEdge = true,
+    this.capStartEdge = true,
+    this.capEndEdge = true,
   }) : assert(background != null),
-       assert(capLeftEdge != null),
-       assert(capRightEdge != null),
+       assert(capStartEdge != null),
+       assert(capEndEdge != null),
        super(key: key);
 
-  /// Whether to use the default use rounded corners and margin on the left side.
-  final bool capLeftEdge;
+  /// Whether to use the default use rounded corners and margin on the start side.
+  final bool capStartEdge;
 
-  /// Whether to use the default use rounded corners and margin on the right side.
-  final bool capRightEdge;
+  /// Whether to use the default use rounded corners and margin on the end side.
+  final bool capEndEdge;
 
   /// The color to fill in the background of the [CupertinoPickerDefaultSelectionOverlay].
   /// It Support for use [CupertinoDynamicColor].
@@ -379,14 +379,14 @@ class CupertinoPickerDefaultSelectionOverlay extends StatelessWidget {
     const Radius radius = Radius.circular(_defaultSelectionOverlayRadius);
 
     return Container(
-      margin: EdgeInsets.only(
-        left: capLeftEdge ? _defaultSelectionOverlayHorizontalMargin : 0,
-        right: capRightEdge ? _defaultSelectionOverlayHorizontalMargin : 0,
+      margin: EdgeInsetsDirectional.only(
+        start: capStartEdge ? _defaultSelectionOverlayHorizontalMargin : 0,
+        end: capEndEdge ? _defaultSelectionOverlayHorizontalMargin : 0,
       ),
       decoration: BoxDecoration(
-        borderRadius: BorderRadius.horizontal(
-          left: capLeftEdge ? radius : Radius.zero,
-          right: capRightEdge ? radius : Radius.zero,
+        borderRadius: BorderRadiusDirectional.horizontal(
+          start: capStartEdge ? radius : Radius.zero,
+          end: capEndEdge ? radius : Radius.zero,
         ),
         color: CupertinoDynamicColor.resolve(background, context),
       ),

packages/flutter/test/cupertino/picker_test.dart

@@ -422,4 +422,28 @@ void main() {
       );
     }, variant: const TargetPlatformVariant(<TargetPlatform>{ TargetPlatform.iOS,  TargetPlatform.macOS }));
   });
+
+  group('CupertinoPickerDefaultSelectionOverlay', () {
+    testWidgets('should be using directional decoration', (WidgetTester tester) async {
+      await tester.pumpWidget(
+        CupertinoApp(
+          theme: const CupertinoThemeData(brightness: Brightness.light),
+          home: CupertinoPicker(
+            itemExtent: 15.0,
+            onSelectedItemChanged: (int i) {},
+            selectionOverlay: const CupertinoPickerDefaultSelectionOverlay(background: Color(0x12345678)),
+            children: const <Widget>[Text('1'), Text('1')],
+          ),
+        ),
+      );
+
+      final Finder selectionContainer = find.byType(Container);
+      final Container container = tester.firstWidget<Container>(selectionContainer);
+      final EdgeInsetsGeometry? margin = container.margin;
+      final BorderRadiusGeometry? borderRadius = (container.decoration as BoxDecoration?)?.borderRadius;
+
+      expect(margin, isA<EdgeInsetsDirectional>());
+      expect(borderRadius, isA<BorderRadiusDirectional>());
+    });
+  });
 }