firka/flutter
firka/flutter
5
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Constrain date picker to max width to avoid bending outwards (#120827)

Browse Source 
Constrain date picker to max width to avoid bending outwards
This commit is contained in:
Mitchell Goodwin 2023-03-10 13:51:07 -08:00 committed by GitHub
parent 7ce88694c5
commit e77cb1a06b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 69 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
packages/flutter/lib/src/cupertino/date_picker.dart
View File

@ -81,6 +81,7 @@ class _DatePickerLayoutDelegate extends MultiChildLayoutDelegate {
_DatePickerLayoutDelegate({
required this.columnWidths,
required this.textDirectionFactor,
required this.maxWidth,
});
// The list containing widths of all columns.
@ -89,16 +90,19 @@ class _DatePickerLayoutDelegate extends MultiChildLayoutDelegate {
// textDirectionFactor is 1 if text is written left to right, and -1 if right to left.
final int textDirectionFactor;
// The max width the children should reach to avoid bending outwards.
final double maxWidth;
@override
void performLayout(Size size) {
double remainingWidth = size.width;
double remainingWidth = maxWidth < size.width ? maxWidth : size.width;
double currentHorizontalOffset = (size.width - remainingWidth) / 2;
for (int i = 0; i < columnWidths.length; i++) {
remainingWidth -= columnWidths[i] + _kDatePickerPadSize * 2;
}
double currentHorizontalOffset = 0.0;
for (int i = 0; i < columnWidths.length; i++) {
final int index = textDirectionFactor == 1 ? i : columnWidths.length - i - 1;
@ -1024,6 +1028,7 @@ class _CupertinoDatePickerDateTimeState extends State<CupertinoDatePicker> {
}
final List<Widget> pickers = <Widget>[];
double totalColumnWidths = 4 * _kDatePickerPadSize;
for (int i = 0; i < columnWidths.length; i++) {
double offAxisFraction = 0.0;
@ -1044,6 +1049,8 @@ class _CupertinoDatePickerDateTimeState extends State<CupertinoDatePicker> {
padding = padding.flipped;
}
totalColumnWidths += columnWidths[i] + (2 * _kDatePickerPadSize);
pickers.add(LayoutId(
id: i,
child: pickerBuilders[i](
@ -1068,6 +1075,8 @@ class _CupertinoDatePickerDateTimeState extends State<CupertinoDatePicker> {
));
}
final double maxPickerWidth = totalColumnWidths > _kPickerWidth ? totalColumnWidths : _kPickerWidth;
return MediaQuery(
data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
child: DefaultTextStyle.merge(
@ -1076,6 +1085,7 @@ class _CupertinoDatePickerDateTimeState extends State<CupertinoDatePicker> {
delegate: _DatePickerLayoutDelegate(
columnWidths: columnWidths,
textDirectionFactor: textDirectionFactor,
maxWidth: maxPickerWidth,
),
children: pickers,
),
@ -1418,6 +1428,7 @@ class _CupertinoDatePickerDateState extends State<CupertinoDatePicker> {
}
final List<Widget> pickers = <Widget>[];
double totalColumnWidths = 4 * _kDatePickerPadSize;
for (int i = 0; i < columnWidths.length; i++) {
final double offAxisFraction = (i - 1) * 0.3 * textDirectionFactor;
@ -1434,6 +1445,8 @@ class _CupertinoDatePickerDateState extends State<CupertinoDatePicker> {
selectionOverlay = _endSelectionOverlay;
}
totalColumnWidths += columnWidths[i] + (2 * _kDatePickerPadSize);
pickers.add(LayoutId(
id: i,
child: pickerBuilders[i](
@ -1456,6 +1469,8 @@ class _CupertinoDatePickerDateState extends State<CupertinoDatePicker> {
));
}
final double maxPickerWidth = totalColumnWidths > _kPickerWidth ? totalColumnWidths : _kPickerWidth;
return MediaQuery(
data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
child: DefaultTextStyle.merge(
@ -1464,6 +1479,7 @@ class _CupertinoDatePickerDateState extends State<CupertinoDatePicker> {
delegate: _DatePickerLayoutDelegate(
columnWidths: columnWidths,
textDirectionFactor: textDirectionFactor,
maxWidth: maxPickerWidth,
),
children: pickers,
),

50
packages/flutter/test/cupertino/date_picker_test.dart
View File

@ -592,6 +592,56 @@ void main() {
);
});
testWidgets('width of wheel in background does not increase at large widths', (WidgetTester tester) async {
final Widget dateWidget = CupertinoDatePicker(
mode: CupertinoDatePickerMode.date,
onDateTimeChanged: (_) { },
initialDateTime: DateTime(2018, 1, 1, 10, 30),
);
await tester.pumpWidget(
CupertinoApp(
home: CupertinoPageScaffold(
child: Center(
child: SizedBox(
height: 200.0,
width: 300.0,
child: dateWidget,
),
),
),
),
);
double decemberX = tester.getBottomLeft(find.text('December')).dx;
double octoberX = tester.getBottomLeft(find.text('October')).dx;
final double distance = octoberX - decemberX;
await tester.pumpWidget(
CupertinoApp(
home: CupertinoPageScaffold(
child: Center(
child: SizedBox(
height: 200.0,
width: 3000.0,
child: dateWidget,
),
),
),
),
);
decemberX = tester.getBottomLeft(find.text('December')).dx;
octoberX = tester.getBottomLeft(find.text('October')).dx;
// The wheel does not bend outwards at large widths.
expect(
distance >= (octoberX - decemberX),
true,
);
});
testWidgets('picker automatically scrolls away from invalid date on month change', (WidgetTester tester) async {
late DateTime date;
await tester.pumpWidget(