From ddeb5bb9c803dbc38c7287e815189ff8439e0aa0 Mon Sep 17 00:00:00 2001
From: Hans Muller <hans.muller@gmail.com>
Date: Mon, 3 Aug 2020 14:27:17 -0700
Subject: [PATCH] Use OverflowBar instead of ButtonBar in DatePicker (#62686)

---
 .../material/pickers/date_picker_dialog.dart  | 32 ++++----
 .../test/material/date_picker_test.dart       | 74 +++++++++++++++++++
 2 files changed, 91 insertions(+), 15 deletions(-)

diff --git a/packages/flutter/lib/src/material/pickers/date_picker_dialog.dart b/packages/flutter/lib/src/material/pickers/date_picker_dialog.dart
index 962eedf7dbb..338112033d3 100644
--- a/packages/flutter/lib/src/material/pickers/date_picker_dialog.dart
+++ b/packages/flutter/lib/src/material/pickers/date_picker_dialog.dart
@@ -9,8 +9,6 @@ import 'dart:math' as math;
 import 'package:flutter/services.dart';
 import 'package:flutter/widgets.dart';
 
-import '../button_bar.dart';
-import '../button_theme.dart';
 import '../color_scheme.dart';
 import '../debug.dart';
 import '../dialog.dart';
@@ -383,19 +381,23 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
       ? textTheme.headline5?.copyWith(color: dateColor)
       : textTheme.headline4?.copyWith(color: dateColor);
 
-    final Widget actions = ButtonBar(
-      buttonTextTheme: ButtonTextTheme.primary,
-      layoutBehavior: ButtonBarLayoutBehavior.constrained,
-      children: <Widget>[
-        TextButton(
-          child: Text(widget.cancelText ?? localizations.cancelButtonLabel),
-          onPressed: _handleCancel,
-        ),
-        TextButton(
-          child: Text(widget.confirmText ?? localizations.okButtonLabel),
-          onPressed: _handleOk,
-        ),
-      ],
+    final Widget actions = Container(
+      alignment: AlignmentDirectional.centerEnd,
+      constraints: const BoxConstraints(minHeight: 52.0),
+      padding: const EdgeInsets.symmetric(horizontal: 8),
+      child: OverflowBar(
+        spacing: 8,
+        children: <Widget>[
+          TextButton(
+            child: Text(widget.cancelText ?? localizations.cancelButtonLabel),
+            onPressed: _handleCancel,
+          ),
+          TextButton(
+            child: Text(widget.confirmText ?? localizations.okButtonLabel),
+            onPressed: _handleOk,
+          ),
+        ],
+      ),
     );
 
     Widget picker;
diff --git a/packages/flutter/test/material/date_picker_test.dart b/packages/flutter/test/material/date_picker_test.dart
index 9654f0b43ec..43ec31e7cc0 100644
--- a/packages/flutter/test/material/date_picker_test.dart
+++ b/packages/flutter/test/material/date_picker_test.dart
@@ -362,6 +362,80 @@ void main() {
       expect(themeDialogMaterial.elevation, customDialogTheme.elevation);
     });
 
+    testWidgets('OK Cancel button layout', (WidgetTester tester) async {
+       Widget buildFrame(TextDirection textDirection) {
+         return MaterialApp(
+           home: Material(
+             child: Center(
+               child: Builder(
+                 builder: (BuildContext context) {
+                   return ElevatedButton(
+                     child: const Text('X'),
+                     onPressed: () {
+                       showDatePicker(
+                         context: context,
+                         initialDate: DateTime(2016, DateTime.january, 15),
+                         firstDate:DateTime(2001, DateTime.january, 1),
+                         lastDate: DateTime(2031, DateTime.december, 31),
+                         builder: (BuildContext context, Widget child) {
+                           return Directionality(
+                             textDirection: textDirection,
+                             child: child,
+                           );
+                         },
+                       );
+                     },
+                   );
+                 },
+               ),
+             ),
+           ),
+         );
+       }
+
+      // Default landscape layout.
+
+      await tester.pumpWidget(buildFrame(TextDirection.ltr));
+      await tester.tap(find.text('X'));
+      await tester.pumpAndSettle();
+      expect(tester.getBottomRight(find.text('OK')).dx, 622);
+      expect(tester.getBottomLeft(find.text('OK')).dx, 594);
+      expect(tester.getBottomRight(find.text('CANCEL')).dx, 560);
+      await tester.tap(find.text('OK'));
+      await tester.pumpAndSettle();
+
+      await tester.pumpWidget(buildFrame(TextDirection.rtl));
+      await tester.tap(find.text('X'));
+      await tester.pumpAndSettle();
+      expect(tester.getBottomRight(find.text('OK')).dx, 206);
+      expect(tester.getBottomLeft(find.text('OK')).dx, 178);
+      expect(tester.getBottomRight(find.text('CANCEL')).dx, 324);
+      await tester.tap(find.text('OK'));
+      await tester.pumpAndSettle();
+
+      // Portrait layout.
+
+      addTearDown(tester.binding.window.clearPhysicalSizeTestValue);
+      tester.binding.window.physicalSizeTestValue = const Size(900, 1200);
+
+      await tester.pumpWidget(buildFrame(TextDirection.ltr));
+      await tester.tap(find.text('X'));
+      await tester.pumpAndSettle();
+      expect(tester.getBottomRight(find.text('OK')).dx, 258);
+      expect(tester.getBottomLeft(find.text('OK')).dx, 230);
+      expect(tester.getBottomRight(find.text('CANCEL')).dx, 196);
+      await tester.tap(find.text('OK'));
+      await tester.pumpAndSettle();
+
+      await tester.pumpWidget(buildFrame(TextDirection.rtl));
+      await tester.tap(find.text('X'));
+      await tester.pumpAndSettle();
+      expect(tester.getBottomRight(find.text('OK')).dx, 70);
+      expect(tester.getBottomLeft(find.text('OK')).dx, 42);
+      expect(tester.getBottomRight(find.text('CANCEL')).dx, 188);
+      await tester.tap(find.text('OK'));
+      await tester.pumpAndSettle();
+    });
   });
 
   group('Calendar mode', () {