Material Date Picker should honor DialogTheme shape, and elevation. (#53713)

* Date Picker should honor DialogTheme shape, and elevation.
This commit is contained in:
Darren Austin 2020-04-01 00:45:45 -07:00 committed by GitHub
parent 0d07788069
commit f2acfbca82
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 77 additions and 2 deletions

View File

@ -12,6 +12,7 @@ import '../button_theme.dart';
import '../color_scheme.dart'; import '../color_scheme.dart';
import '../debug.dart'; import '../debug.dart';
import '../dialog.dart'; import '../dialog.dart';
import '../dialog_theme.dart';
import '../flat_button.dart'; import '../flat_button.dart';
import '../icons.dart'; import '../icons.dart';
import '../material_localizations.dart'; import '../material_localizations.dart';
@ -427,6 +428,7 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
); );
final Size dialogSize = _dialogSize(context) * textScaleFactor; final Size dialogSize = _dialogSize(context) * textScaleFactor;
final DialogTheme dialogTheme = Theme.of(context).dialogTheme;
return Dialog( return Dialog(
child: AnimatedContainer( child: AnimatedContainer(
width: dialogSize.width, width: dialogSize.width,
@ -473,11 +475,13 @@ class _DatePickerDialogState extends State<_DatePickerDialog> {
), ),
), ),
insetPadding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 24.0), insetPadding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 24.0),
shape: const RoundedRectangleBorder( // The default dialog shape is radius 2 rounded rect, but the spec has
// been updated to 4, so we will use that here for the Date Picker, but
// only if there isn't one provided in the theme.
shape: dialogTheme.shape ?? const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(4.0)) borderRadius: BorderRadius.all(Radius.circular(4.0))
), ),
clipBehavior: Clip.antiAlias, clipBehavior: Clip.antiAlias,
elevation: 24.0,
); );
} }
} }

View File

@ -247,6 +247,77 @@ void main() {
expect(nestedObserver.datePickerCount, 1); expect(nestedObserver.datePickerCount, 1);
}); });
testWidgets('honors DialogTheme for shape and elevation', (WidgetTester tester) async {
// Test that the defaults work
const DialogTheme datePickerDefaultDialogTheme = DialogTheme(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(4.0))
),
elevation: 24,
);
await tester.pumpWidget(
MaterialApp(
home: Center(
child: Builder(
builder: (BuildContext context) {
return RaisedButton(
child: const Text('X'),
onPressed: () {
showDatePicker(
context: context,
initialDate: DateTime.now(),
firstDate: DateTime(2018),
lastDate: DateTime(2030),
);
},
);
},
),
),
),
);
await tester.tap(find.text('X'));
await tester.pumpAndSettle();
final Material defaultDialogMaterial = tester.widget<Material>(find.descendant(of: find.byType(Dialog), matching: find.byType(Material)).first);
expect(defaultDialogMaterial.shape, datePickerDefaultDialogTheme.shape);
expect(defaultDialogMaterial.elevation, datePickerDefaultDialogTheme.elevation);
// Test that it honors ThemeData.dialogTheme settings
const DialogTheme customDialogTheme = DialogTheme(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(40.0))
),
elevation: 50,
);
await tester.pumpWidget(
MaterialApp(
theme: ThemeData.fallback().copyWith(dialogTheme: customDialogTheme),
home: Center(
child: Builder(
builder: (BuildContext context) {
return RaisedButton(
child: const Text('X'),
onPressed: () {
showDatePicker(
context: context,
initialDate: DateTime.now(),
firstDate: DateTime(2018),
lastDate: DateTime(2030),
);
},
);
},
),
),
),
);
await tester.tap(find.text('X'));
await tester.pumpAndSettle();
final Material themeDialogMaterial = tester.widget<Material>(find.descendant(of: find.byType(Dialog), matching: find.byType(Material)).first);
expect(themeDialogMaterial.shape, customDialogTheme.shape);
expect(themeDialogMaterial.elevation, customDialogTheme.elevation);
});
}); });
group('Calendar mode', () { group('Calendar mode', () {