Skip to content

Commit 5892a00

Browse files
LongCatIsLooongLongCatIsLooong
authored
Remove more textScaleFactor references (#141816)
Remove more `textScaleFactor` references from flutter/flutter. - Some changes are related to label scaling: the padding EdgeInsets values of some chip subclasses scale linearly between predetermined "max" padding values and "min" padding values. Before they scale with the `textScaleFactor` scalar, now they scale with the font size and are still capped at the original "max" and "min" values. - The rest of them are tests or size heuristics that depend on `textScaleFactor`, these are replaced by an effective text scale factor computed using a default font size (which is determined in a pretty random fashion, but it will only make a difference on Android 14+). No API changes in this batch. There are still some references left that I intend to remove in a different batch that would introduce API changes.
1 parent bc254ce commit 5892a00

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+425
-300
lines changed

‎dev/tools/gen_defaults/lib/action_chip_template.dart‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -83,16 +83,24 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
8383
@override
8484
EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0);
8585
86-
/// The chip at text scale 1 starts with 8px on each side and as text scaling
87-
/// gets closer to 2 the label padding is linearly interpolated from 8px to 4px.
88-
/// Once the widget has a text scaling of 2 or higher than the label padding
89-
/// remains 4px.
86+
/// The label padding of the chip scales with the font size specified in the
87+
/// [labelStyle], and the system font size settings that scale font sizes
88+
/// globally.
89+
///
90+
/// The chip at effective font size 14.0 starts with 8px on each side and as
91+
/// the font size scales up to closer to 28.0, the label padding is linearly
92+
/// interpolated from 8px to 4px. Once the label has a font size of 2 or
93+
/// higher, label padding remains 4px.
9094
@override
91-
EdgeInsetsGeometry? get labelPadding => EdgeInsets.lerp(
92-
const EdgeInsets.symmetric(horizontal: 8.0),
93-
const EdgeInsets.symmetric(horizontal: 4.0),
94-
clampDouble(MediaQuery.textScalerOf(context).textScaleFactor - 1.0, 0.0, 1.0),
95-
)!;
95+
EdgeInsetsGeometry? get labelPadding {
96+
final double fontSize = labelStyle?.fontSize ?? 14.0;
97+
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0;
98+
return EdgeInsets.lerp(
99+
const EdgeInsets.symmetric(horizontal: 8.0),
100+
const EdgeInsets.symmetric(horizontal: 4.0),
101+
clampDouble(fontSizeRatio - 1.0, 0.0, 1.0),
102+
)!;
103+
}
96104
}
97105
''';
98106
}

‎dev/tools/gen_defaults/lib/chip_template.dart‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -62,16 +62,24 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
6262
@override
6363
EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0);
6464
65-
/// The chip at text scale 1 starts with 8px on each side and as text scaling
66-
/// gets closer to 2, the label padding is linearly interpolated from 8px to 4px.
67-
/// Once the widget has a text scaling of 2 or higher than the label padding
68-
/// remains 4px.
65+
/// The label padding of the chip scales with the font size specified in the
66+
/// [labelStyle], and the system font size settings that scale font sizes
67+
/// globally.
68+
///
69+
/// The chip at effective font size 14.0 starts with 8px on each side and as
70+
/// the font size scales up to closer to 28.0, the label padding is linearly
71+
/// interpolated from 8px to 4px. Once the label has a font size of 2 or
72+
/// higher, label padding remains 4px.
6973
@override
70-
EdgeInsetsGeometry? get labelPadding => EdgeInsets.lerp(
71-
const EdgeInsets.symmetric(horizontal: 8.0),
72-
const EdgeInsets.symmetric(horizontal: 4.0),
73-
clampDouble(MediaQuery.textScalerOf(context).textScaleFactor - 1.0, 0.0, 1.0),
74-
)!;
74+
EdgeInsetsGeometry? get labelPadding {
75+
final double fontSize = labelStyle?.fontSize ?? 14.0;
76+
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0;
77+
return EdgeInsets.lerp(
78+
const EdgeInsets.symmetric(horizontal: 8.0),
79+
const EdgeInsets.symmetric(horizontal: 4.0),
80+
clampDouble(fontSizeRatio - 1.0, 0.0, 1.0),
81+
)!;
82+
}
7583
}
7684
''';
7785
}

‎dev/tools/gen_defaults/lib/filter_chip_template.dart‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -100,16 +100,24 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
100100
@override
101101
EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0);
102102
103-
/// The chip at text scale 1 starts with 8px on each side and as text scaling
104-
/// gets closer to 2 the label padding is linearly interpolated from 8px to 4px.
105-
/// Once the widget has a text scaling of 2 or higher than the label padding
106-
/// remains 4px.
103+
/// The label padding of the chip scales with the font size specified in the
104+
/// [labelStyle], and the system font size settings that scale font sizes
105+
/// globally.
106+
///
107+
/// The chip at effective font size 14.0 starts with 8px on each side and as
108+
/// the font size scales up to closer to 28.0, the label padding is linearly
109+
/// interpolated from 8px to 4px. Once the label has a font size of 2 or
110+
/// higher, label padding remains 4px.
107111
@override
108-
EdgeInsetsGeometry? get labelPadding => EdgeInsets.lerp(
109-
const EdgeInsets.symmetric(horizontal: 8.0),
110-
const EdgeInsets.symmetric(horizontal: 4.0),
111-
clampDouble(MediaQuery.textScalerOf(context).textScaleFactor - 1.0, 0.0, 1.0),
112-
)!;
112+
EdgeInsetsGeometry? get labelPadding {
113+
final double fontSize = labelStyle?.fontSize ?? 14.0;
114+
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0;
115+
return EdgeInsets.lerp(
116+
const EdgeInsets.symmetric(horizontal: 8.0),
117+
const EdgeInsets.symmetric(horizontal: 4.0),
118+
clampDouble(fontSizeRatio - 1.0, 0.0, 1.0),
119+
)!;
120+
}
113121
}
114122
''';
115123
}

‎dev/tools/gen_defaults/lib/input_chip_template.dart‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -77,16 +77,24 @@ class _${blockName}DefaultsM3 extends ChipThemeData {
7777
@override
7878
EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0);
7979
80-
/// The chip at text scale 1 starts with 8px on each side and as text scaling
81-
/// gets closer to 2 the label padding is linearly interpolated from 8px to 4px.
82-
/// Once the widget has a text scaling of 2 or higher than the label padding
83-
/// remains 4px.
80+
/// The label padding of the chip scales with the font size specified in the
81+
/// [labelStyle], and the system font size settings that scale font sizes
82+
/// globally.
83+
///
84+
/// The chip at effective font size 14.0 starts with 8px on each side and as
85+
/// the font size scales up to closer to 28.0, the label padding is linearly
86+
/// interpolated from 8px to 4px. Once the label has a font size of 2 or
87+
/// higher, label padding remains 4px.
8488
@override
85-
EdgeInsetsGeometry? get labelPadding => EdgeInsets.lerp(
86-
const EdgeInsets.symmetric(horizontal: 8.0),
87-
const EdgeInsets.symmetric(horizontal: 4.0),
88-
clampDouble(MediaQuery.textScalerOf(context).textScaleFactor - 1.0, 0.0, 1.0),
89-
)!;
89+
EdgeInsetsGeometry? get labelPadding {
90+
final double fontSize = labelStyle?.fontSize ?? 14.0;
91+
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0;
92+
return EdgeInsets.lerp(
93+
const EdgeInsets.symmetric(horizontal: 8.0),
94+
const EdgeInsets.symmetric(horizontal: 4.0),
95+
clampDouble(fontSizeRatio - 1.0, 0.0, 1.0),
96+
)!;
97+
}
9098
}
9199
''';
92100
}

‎dev/tools/gen_defaults/lib/menu_template.dart‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -200,6 +200,11 @@ class _MenuButtonDefaultsM3 extends ButtonStyle {
200200
if (visualDensity.horizontal > 0) {
201201
visualDensity = VisualDensity(vertical: visualDensity.vertical);
202202
}
203+
// Since the threshold paddings used below are empirical values determined
204+
// at a font size of 14.0, 14.0 is used as the base value for scaling the
205+
// padding.
206+
final double fontSize = Theme.of(context).textTheme.labelLarge?.fontSize ?? 14.0;
207+
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0;
203208
return ButtonStyleButton.scaledPadding(
204209
EdgeInsets.symmetric(horizontal: math.max(
205210
_kMenuViewPadding,
@@ -210,7 +215,7 @@ class _MenuButtonDefaultsM3 extends ButtonStyle {
210215
8 + visualDensity.baseSizeAdjustment.dx,
211216
)),
212217
const EdgeInsets.symmetric(horizontal: _kMenuViewPadding),
213-
MediaQuery.maybeTextScaleFactorOf(context) ?? 1,
218+
fontSizeRatio,
214219
);
215220
}
216221
}

‎packages/flutter/lib/src/cupertino/dialog.dart‎

Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -149,8 +149,9 @@ const double _kMaxRegularTextScaleFactor = 1.4;
149149
// Accessibility mode on iOS is determined by the text scale factor that the
150150
// user has selected.
151151
bool _isInAccessibilityMode(BuildContext context) {
152-
final double? factor = MediaQuery.maybeTextScalerOf(context)?.textScaleFactor;
153-
return factor != null && factor > _kMaxRegularTextScaleFactor;
152+
const double defaultFontSize = 14.0;
153+
final double? scaledFontSize = MediaQuery.maybeTextScalerOf(context)?.scale(defaultFontSize);
154+
return scaledFontSize != null && scaledFontSize > defaultFontSize * _kMaxRegularTextScaleFactor;
154155
}
155156

156157
/// An iOS-style alert dialog.
@@ -264,7 +265,8 @@ class _CupertinoAlertDialogState extends State<CupertinoAlertDialog> {
264265
widget.actionScrollController ?? (_backupActionScrollController ??= ScrollController());
265266

266267
Widget _buildContent(BuildContext context) {
267-
final double textScaleFactor = MediaQuery.textScalerOf(context).textScaleFactor;
268+
const double defaultFontSize = 14.0;
269+
final double effectiveTextScaleFactor = MediaQuery.textScalerOf(context).scale(defaultFontSize) / defaultFontSize;
268270

269271
final List<Widget> children = <Widget>[
270272
if (widget.title != null || widget.content != null)
@@ -278,12 +280,12 @@ class _CupertinoAlertDialogState extends State<CupertinoAlertDialog> {
278280
left: _kDialogEdgePadding,
279281
right: _kDialogEdgePadding,
280282
bottom: widget.content == null ? _kDialogEdgePadding : 1.0,
281-
top: _kDialogEdgePadding * textScaleFactor,
283+
top: _kDialogEdgePadding * effectiveTextScaleFactor,
282284
),
283285
messagePadding: EdgeInsets.only(
284286
left: _kDialogEdgePadding,
285287
right: _kDialogEdgePadding,
286-
bottom: _kDialogEdgePadding * textScaleFactor,
288+
bottom: _kDialogEdgePadding * effectiveTextScaleFactor,
287289
top: widget.title == null ? _kDialogEdgePadding : 1.0,
288290
),
289291
titleTextStyle: _kCupertinoDialogTitleStyle.copyWith(
@@ -1653,10 +1655,6 @@ class CupertinoDialogAction extends StatelessWidget {
16531655
/// value.
16541656
bool get enabled => onPressed != null;
16551657

1656-
double _calculatePadding(BuildContext context) {
1657-
return 8.0 * MediaQuery.textScalerOf(context).textScaleFactor;
1658-
}
1659-
16601658
// Dialog action content shrinks to fit, up to a certain point, and if it still
16611659
// cannot fit at the minimum size, the text content is ellipsized.
16621660
//
@@ -1665,6 +1663,7 @@ class CupertinoDialogAction extends StatelessWidget {
16651663
required BuildContext context,
16661664
required TextStyle textStyle,
16671665
required Widget content,
1666+
required double padding,
16681667
}) {
16691668
final bool isInAccessibilityMode = _isInAccessibilityMode(context);
16701669
final double dialogWidth = isInAccessibilityMode
@@ -1675,7 +1674,6 @@ class CupertinoDialogAction extends StatelessWidget {
16751674
// buttons. This ratio information is used to automatically scale down action
16761675
// button text to fit the available space.
16771676
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(textStyle.fontSize!) / _kDialogMinButtonFontSize;
1678-
final double padding = _calculatePadding(context);
16791677

16801678
return IntrinsicHeight(
16811679
child: SizedBox(
@@ -1724,8 +1722,7 @@ class CupertinoDialogAction extends StatelessWidget {
17241722
isDestructiveAction ? CupertinoColors.systemRed : CupertinoTheme.of(context).primaryColor,
17251723
context,
17261724
),
1727-
);
1728-
style = style.merge(textStyle);
1725+
).merge(textStyle);
17291726

17301727
if (isDefaultAction) {
17311728
style = style.copyWith(fontWeight: FontWeight.w600);
@@ -1734,7 +1731,10 @@ class CupertinoDialogAction extends StatelessWidget {
17341731
if (!enabled) {
17351732
style = style.copyWith(color: style.color!.withOpacity(0.5));
17361733
}
1737-
1734+
final double fontSize = style.fontSize ?? kDefaultFontSize;
1735+
final double fontSizeToScale = fontSize == 0.0 ? kDefaultFontSize : fontSize;
1736+
final double effectiveTextScale = MediaQuery.textScalerOf(context).scale(fontSizeToScale) / fontSizeToScale;
1737+
final double padding = 8.0 * effectiveTextScale;
17381738
// Apply a sizing policy to the action button's content based on whether or
17391739
// not the device is in accessibility mode.
17401740
// TODO(mattcarroll): The following logic is not entirely correct. It is also
@@ -1750,6 +1750,7 @@ class CupertinoDialogAction extends StatelessWidget {
17501750
context: context,
17511751
textStyle: style,
17521752
content: child,
1753+
padding: padding,
17531754
);
17541755

17551756
return MouseRegion(
@@ -1764,7 +1765,7 @@ class CupertinoDialogAction extends StatelessWidget {
17641765
),
17651766
child: Container(
17661767
alignment: Alignment.center,
1767-
padding: EdgeInsets.all(_calculatePadding(context)),
1768+
padding: EdgeInsets.all(padding),
17681769
child: sizedContent,
17691770
),
17701771
),

‎packages/flutter/lib/src/cupertino/search_field.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -408,7 +408,7 @@ class _CupertinoSearchTextFieldState extends State<CupertinoSearchTextField>
408408

409409
// The icon size will be scaled by a factor of the accessibility text scale,
410410
// to follow the behavior of `UISearchTextField`.
411-
final double scaledIconSize = MediaQuery.textScalerOf(context).textScaleFactor * widget.itemSize;
411+
final double scaledIconSize = MediaQuery.textScalerOf(context).scale(widget.itemSize);
412412

413413
// If decoration was not provided, create a decoration with the provided
414414
// background color and border radius.

‎packages/flutter/lib/src/material/action_chip.dart‎

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -304,16 +304,24 @@ class _ActionChipDefaultsM3 extends ChipThemeData {
304304
@override
305305
EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0);
306306

307-
/// The chip at text scale 1 starts with 8px on each side and as text scaling
308-
/// gets closer to 2 the label padding is linearly interpolated from 8px to 4px.
309-
/// Once the widget has a text scaling of 2 or higher than the label padding
310-
/// remains 4px.
311-
@override
312-
EdgeInsetsGeometry? get labelPadding => EdgeInsets.lerp(
313-
const EdgeInsets.symmetric(horizontal: 8.0),
314-
const EdgeInsets.symmetric(horizontal: 4.0),
315-
clampDouble(MediaQuery.textScalerOf(context).textScaleFactor - 1.0, 0.0, 1.0),
316-
)!;
307+
/// The label padding of the chip scales with the font size specified in the
308+
/// [labelStyle], and the system font size settings that scale font sizes
309+
/// globally.
310+
///
311+
/// The chip at effective font size 14.0 starts with 8px on each side and as
312+
/// the font size scales up to closer to 28.0, the label padding is linearly
313+
/// interpolated from 8px to 4px. Once the label has a font size of 2 or
314+
/// higher, label padding remains 4px.
315+
@override
316+
EdgeInsetsGeometry? get labelPadding {
317+
final double fontSize = labelStyle?.fontSize ?? 14.0;
318+
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0;
319+
return EdgeInsets.lerp(
320+
const EdgeInsets.symmetric(horizontal: 8.0),
321+
const EdgeInsets.symmetric(horizontal: 4.0),
322+
clampDouble(fontSizeRatio - 1.0, 0.0, 1.0),
323+
)!;
324+
}
317325
}
318326

319327
// END GENERATED TOKEN PROPERTIES - ActionChip

‎packages/flutter/lib/src/material/chip.dart‎

Lines changed: 34 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1158,16 +1158,6 @@ class _RawChipState extends State<RawChip> with MaterialStateMixin, TickerProvid
11581158
assert(debugCheckHasDirectionality(context));
11591159
assert(debugCheckHasMaterialLocalizations(context));
11601160

1161-
/// The chip at text scale 1 starts with 8px on each side and as text scaling
1162-
/// gets closer to 2 the label padding is linearly interpolated from 8px to 4px.
1163-
/// Once the widget has a text scaling of 2 or higher than the label padding
1164-
/// remains 4px.
1165-
final EdgeInsetsGeometry defaultLabelPadding = EdgeInsets.lerp(
1166-
const EdgeInsets.symmetric(horizontal: 8.0),
1167-
const EdgeInsets.symmetric(horizontal: 4.0),
1168-
clampDouble(MediaQuery.textScalerOf(context).textScaleFactor - 1.0, 0.0, 1.0),
1169-
)!;
1170-
11711161
final ThemeData theme = Theme.of(context);
11721162
final ChipThemeData chipTheme = ChipTheme.of(context);
11731163
final Brightness brightness = chipTheme.brightness ?? theme.brightness;
@@ -1212,10 +1202,6 @@ class _RawChipState extends State<RawChip> with MaterialStateMixin, TickerProvid
12121202
// Widget's label style is merged with this below.
12131203
final TextStyle labelStyle = chipTheme.labelStyle
12141204
?? chipDefaults.labelStyle!;
1215-
final EdgeInsetsGeometry labelPadding = widget.labelPadding
1216-
?? chipTheme.labelPadding
1217-
?? chipDefaults.labelPadding
1218-
?? defaultLabelPadding;
12191205
final IconThemeData? iconTheme = widget.iconTheme
12201206
?? chipTheme.iconTheme
12211207
?? chipDefaults.iconTheme;
@@ -1230,6 +1216,23 @@ class _RawChipState extends State<RawChip> with MaterialStateMixin, TickerProvid
12301216
)
12311217
: widget.avatar;
12321218

1219+
/// The chip at text scale 1 starts with 8px on each side and as text scaling
1220+
/// gets closer to 2 the label padding is linearly interpolated from 8px to 4px.
1221+
/// Once the widget has a text scaling of 2 or higher than the label padding
1222+
/// remains 4px.
1223+
final double defaultFontSize = effectiveLabelStyle.fontSize ?? 14.0;
1224+
final double effectiveTextScale = MediaQuery.textScalerOf(context).scale(defaultFontSize) / 14.0;
1225+
final EdgeInsetsGeometry defaultLabelPadding = EdgeInsets.lerp(
1226+
const EdgeInsets.symmetric(horizontal: 8.0),
1227+
const EdgeInsets.symmetric(horizontal: 4.0),
1228+
clampDouble(effectiveTextScale - 1.0, 0.0, 1.0),
1229+
)!;
1230+
1231+
final EdgeInsetsGeometry labelPadding = widget.labelPadding
1232+
?? chipTheme.labelPadding
1233+
?? chipDefaults.labelPadding
1234+
?? defaultLabelPadding;
1235+
12331236
Widget result = Material(
12341237
elevation: isTapping ? pressElevation : elevation,
12351238
shadowColor: widget.selected ? selectedShadowColor : shadowColor,
@@ -2319,16 +2322,24 @@ class _ChipDefaultsM3 extends ChipThemeData {
23192322
@override
23202323
EdgeInsetsGeometry? get padding => const EdgeInsets.all(8.0);
23212324

2322-
/// The chip at text scale 1 starts with 8px on each side and as text scaling
2323-
/// gets closer to 2, the label padding is linearly interpolated from 8px to 4px.
2324-
/// Once the widget has a text scaling of 2 or higher than the label padding
2325-
/// remains 4px.
2325+
/// The label padding of the chip scales with the font size specified in the
2326+
/// [labelStyle], and the system font size settings that scale font sizes
2327+
/// globally.
2328+
///
2329+
/// The chip at effective font size 14.0 starts with 8px on each side and as
2330+
/// the font size scales up to closer to 28.0, the label padding is linearly
2331+
/// interpolated from 8px to 4px. Once the label has a font size of 2 or
2332+
/// higher, label padding remains 4px.
23262333
@override
2327-
EdgeInsetsGeometry? get labelPadding => EdgeInsets.lerp(
2328-
const EdgeInsets.symmetric(horizontal: 8.0),
2329-
const EdgeInsets.symmetric(horizontal: 4.0),
2330-
clampDouble(MediaQuery.textScalerOf(context).textScaleFactor - 1.0, 0.0, 1.0),
2331-
)!;
2334+
EdgeInsetsGeometry? get labelPadding {
2335+
final double fontSize = labelStyle?.fontSize ?? 14.0;
2336+
final double fontSizeRatio = MediaQuery.textScalerOf(context).scale(fontSize) / 14.0;
2337+
return EdgeInsets.lerp(
2338+
const EdgeInsets.symmetric(horizontal: 8.0),
2339+
const EdgeInsets.symmetric(horizontal: 4.0),
2340+
clampDouble(fontSizeRatio - 1.0, 0.0, 1.0),
2341+
)!;
2342+
}
23322343
}
23332344

23342345
// END GENERATED TOKEN PROPERTIES - Chip

0 commit comments

Comments
 (0)