Use OverflowBar instead of ButtonBar in DatePicker (#62686)
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 962eedf..3381120 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 '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 @@
? 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 9654f0b..43ec31e 100644
--- a/packages/flutter/test/material/date_picker_test.dart
+++ b/packages/flutter/test/material/date_picker_test.dart
@@ -362,6 +362,80 @@
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', () {