Skip to content

Commit f22280a

Browse files
godofredocgodofredoc
authored
Revert "M3 Button padding adjustments (#118449)" (#118598)
This reverts commit 8c2fdb8.
1 parent 8c2fdb8 commit f22280a

File tree

9 files changed

+26
-328
lines changed

9 files changed

+26
-328
lines changed

‎examples/api/lib/material/app_bar/app_bar.1.dart

+3-2
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ class _AppBarExampleState extends State<AppBarExample> {
9898
label: const Text('shadow color'),
9999
),
100100
const SizedBox(width: 5),
101-
ElevatedButton(
101+
ElevatedButton.icon(
102102
onPressed: () {
103103
if (scrolledUnderElevation == null) {
104104
setState(() {
@@ -111,7 +111,8 @@ class _AppBarExampleState extends State<AppBarExample> {
111111
});
112112
}
113113
},
114-
child: Text(
114+
icon: const Icon(Icons.add),
115+
label: Text(
115116
'scrolledUnderElevation: ${scrolledUnderElevation ?? 'default'}',
116117
),
117118
),

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

+8-20
Original file line numberDiff line numberDiff line change
@@ -333,10 +333,10 @@ class ElevatedButton extends ButtonStyleButton {
333333
/// * hovered - 3
334334
/// * focused or pressed - 1
335335
/// * `padding`
336-
/// * `textScaleFactor <= 1` - horizontal(24)
337-
/// * `1 < textScaleFactor <= 2` - lerp(horizontal(24), horizontal(12))
338-
/// * `2 < textScaleFactor <= 3` - lerp(horizontal(12), horizontal(6))
339-
/// * `3 < textScaleFactor` - horizontal(6)
336+
/// * `textScaleFactor <= 1` - horizontal(16)
337+
/// * `1 < textScaleFactor <= 2` - lerp(horizontal(16), horizontal(8))
338+
/// * `2 < textScaleFactor <= 3` - lerp(horizontal(8), horizontal(4))
339+
/// * `3 < textScaleFactor` - horizontal(4)
340340
/// * `minimumSize` - Size(64, 40)
341341
/// * `fixedSize` - null
342342
/// * `maximumSize` - Size.infinite
@@ -351,10 +351,6 @@ class ElevatedButton extends ButtonStyleButton {
351351
/// * `enableFeedback` - true
352352
/// * `alignment` - Alignment.center
353353
/// * `splashFactory` - Theme.splashFactory
354-
///
355-
/// For the [ElevatedButton.icon] factory, the start (generally the left) value of
356-
/// [padding] is reduced from 24 to 16.
357-
358354
@override
359355
ButtonStyle defaultStyleOf(BuildContext context) {
360356
final ThemeData theme = Theme.of(context);
@@ -394,12 +390,10 @@ class ElevatedButton extends ButtonStyleButton {
394390
}
395391

396392
EdgeInsetsGeometry _scaledPadding(BuildContext context) {
397-
final bool useMaterial3 = Theme.of(context).useMaterial3;
398-
final double padding1x = useMaterial3 ? 24.0 : 16.0;
399393
return ButtonStyleButton.scaledPadding(
400-
EdgeInsets.symmetric(horizontal: padding1x),
401-
EdgeInsets.symmetric(horizontal: padding1x / 2),
402-
EdgeInsets.symmetric(horizontal: padding1x / 2 / 2),
394+
const EdgeInsets.symmetric(horizontal: 16),
395+
const EdgeInsets.symmetric(horizontal: 8),
396+
const EdgeInsets.symmetric(horizontal: 4),
403397
MediaQuery.textScaleFactorOf(context),
404398
);
405399
}
@@ -502,13 +496,7 @@ class _ElevatedButtonWithIcon extends ElevatedButton {
502496

503497
@override
504498
ButtonStyle defaultStyleOf(BuildContext context) {
505-
final bool useMaterial3 = Theme.of(context).useMaterial3;
506-
final EdgeInsetsGeometry scaledPadding = useMaterial3 ? ButtonStyleButton.scaledPadding(
507-
const EdgeInsetsDirectional.fromSTEB(16, 0, 24, 0),
508-
const EdgeInsetsDirectional.fromSTEB(8, 0, 12, 0),
509-
const EdgeInsetsDirectional.fromSTEB(4, 0, 6, 0),
510-
MediaQuery.textScaleFactorOf(context),
511-
) : ButtonStyleButton.scaledPadding(
499+
final EdgeInsetsGeometry scaledPadding = ButtonStyleButton.scaledPadding(
512500
const EdgeInsetsDirectional.fromSTEB(12, 0, 16, 0),
513501
const EdgeInsets.symmetric(horizontal: 8),
514502
const EdgeInsetsDirectional.fromSTEB(8, 0, 4, 0),

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

+4-56
Original file line numberDiff line numberDiff line change
@@ -345,50 +345,6 @@ class FilledButton extends ButtonStyleButton {
345345
/// shape's [OutlinedBorder.side]. Typically the default value of an
346346
/// [OutlinedBorder]'s side is [BorderSide.none], so an outline is not drawn.
347347
///
348-
/// ## Material 3 defaults
349-
///
350-
/// If [ThemeData.useMaterial3] is set to true the following defaults will
351-
/// be used:
352-
///
353-
/// * `textStyle` - Theme.textTheme.labelLarge
354-
/// * `backgroundColor`
355-
/// * disabled - Theme.colorScheme.onSurface(0.12)
356-
/// * others - Theme.colorScheme.secondaryContainer
357-
/// * `foregroundColor`
358-
/// * disabled - Theme.colorScheme.onSurface(0.38)
359-
/// * others - Theme.colorScheme.onSecondaryContainer
360-
/// * `overlayColor`
361-
/// * hovered - Theme.colorScheme.onSecondaryContainer(0.08)
362-
/// * focused or pressed - Theme.colorScheme.onSecondaryContainer(0.12)
363-
/// * `shadowColor` - Theme.colorScheme.shadow
364-
/// * `surfaceTintColor` - Colors.transparent
365-
/// * `elevation`
366-
/// * disabled - 0
367-
/// * default - 1
368-
/// * hovered - 3
369-
/// * focused or pressed - 1
370-
/// * `padding`
371-
/// * `textScaleFactor <= 1` - horizontal(24)
372-
/// * `1 < textScaleFactor <= 2` - lerp(horizontal(24), horizontal(12))
373-
/// * `2 < textScaleFactor <= 3` - lerp(horizontal(12), horizontal(6))
374-
/// * `3 < textScaleFactor` - horizontal(6)
375-
/// * `minimumSize` - Size(64, 40)
376-
/// * `fixedSize` - null
377-
/// * `maximumSize` - Size.infinite
378-
/// * `side` - null
379-
/// * `shape` - StadiumBorder()
380-
/// * `mouseCursor`
381-
/// * disabled - SystemMouseCursors.basic
382-
/// * others - SystemMouseCursors.click
383-
/// * `visualDensity` - Theme.visualDensity
384-
/// * `tapTargetSize` - Theme.materialTapTargetSize
385-
/// * `animationDuration` - kThemeChangeDuration
386-
/// * `enableFeedback` - true
387-
/// * `alignment` - Alignment.center
388-
/// * `splashFactory` - Theme.splashFactory
389-
///
390-
/// For the [FilledButton.icon] factory, the start (generally the left) value of
391-
/// [padding] is reduced from 24 to 16.
392348
@override
393349
ButtonStyle defaultStyleOf(BuildContext context) {
394350
switch (_variant) {
@@ -408,12 +364,10 @@ class FilledButton extends ButtonStyleButton {
408364
}
409365

410366
EdgeInsetsGeometry _scaledPadding(BuildContext context) {
411-
final bool useMaterial3 = Theme.of(context).useMaterial3;
412-
final double padding1x = useMaterial3 ? 24.0 : 16.0;
413367
return ButtonStyleButton.scaledPadding(
414-
EdgeInsets.symmetric(horizontal: padding1x),
415-
EdgeInsets.symmetric(horizontal: padding1x / 2),
416-
EdgeInsets.symmetric(horizontal: padding1x / 2 / 2),
368+
const EdgeInsets.symmetric(horizontal: 16),
369+
const EdgeInsets.symmetric(horizontal: 8),
370+
const EdgeInsets.symmetric(horizontal: 4),
417371
MediaQuery.textScaleFactorOf(context),
418372
);
419373
}
@@ -513,13 +467,7 @@ class _FilledButtonWithIcon extends FilledButton {
513467

514468
@override
515469
ButtonStyle defaultStyleOf(BuildContext context) {
516-
final bool useMaterial3 = Theme.of(context).useMaterial3;
517-
final EdgeInsetsGeometry scaledPadding = useMaterial3 ? ButtonStyleButton.scaledPadding(
518-
const EdgeInsetsDirectional.fromSTEB(16, 0, 24, 0),
519-
const EdgeInsetsDirectional.fromSTEB(8, 0, 12, 0),
520-
const EdgeInsetsDirectional.fromSTEB(4, 0, 6, 0),
521-
MediaQuery.textScaleFactorOf(context),
522-
) : ButtonStyleButton.scaledPadding(
470+
final EdgeInsetsGeometry scaledPadding = ButtonStyleButton.scaledPadding(
523471
const EdgeInsetsDirectional.fromSTEB(12, 0, 16, 0),
524472
const EdgeInsets.symmetric(horizontal: 8),
525473
const EdgeInsetsDirectional.fromSTEB(8, 0, 4, 0),

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

+7-29
Original file line numberDiff line numberDiff line change
@@ -287,10 +287,10 @@ class OutlinedButton extends ButtonStyleButton {
287287
/// * `surfaceTintColor` - null
288288
/// * `elevation` - 0
289289
/// * `padding`
290-
/// * `textScaleFactor <= 1` - horizontal(24)
291-
/// * `1 < textScaleFactor <= 2` - lerp(horizontal(24), horizontal(12))
292-
/// * `2 < textScaleFactor <= 3` - lerp(horizontal(12), horizontal(6))
293-
/// * `3 < textScaleFactor` - horizontal(6)
290+
/// * `textScaleFactor <= 1` - horizontal(16)
291+
/// * `1 < textScaleFactor <= 2` - lerp(horizontal(16), horizontal(8))
292+
/// * `2 < textScaleFactor <= 3` - lerp(horizontal(8), horizontal(4))
293+
/// * `3 < textScaleFactor` - horizontal(4)
294294
/// * `minimumSize` - Size(64, 40)
295295
/// * `fixedSize` - null
296296
/// * `maximumSize` - Size.infinite
@@ -307,9 +307,6 @@ class OutlinedButton extends ButtonStyleButton {
307307
/// * `enableFeedback` - true
308308
/// * `alignment` - Alignment.center
309309
/// * `splashFactory` - Theme.splashFactory
310-
///
311-
/// For the [OutlinedButton.icon] factory, the start (generally the left) value of
312-
/// [padding] is reduced from 24 to 16.
313310
@override
314311
ButtonStyle defaultStyleOf(BuildContext context) {
315312
final ThemeData theme = Theme.of(context);
@@ -350,12 +347,10 @@ class OutlinedButton extends ButtonStyleButton {
350347
}
351348

352349
EdgeInsetsGeometry _scaledPadding(BuildContext context) {
353-
final bool useMaterial3 = Theme.of(context).useMaterial3;
354-
final double padding1x = useMaterial3 ? 24.0 : 16.0;
355350
return ButtonStyleButton.scaledPadding(
356-
EdgeInsets.symmetric(horizontal: padding1x),
357-
EdgeInsets.symmetric(horizontal: padding1x / 2),
358-
EdgeInsets.symmetric(horizontal: padding1x / 2 / 2),
351+
const EdgeInsets.symmetric(horizontal: 16),
352+
const EdgeInsets.symmetric(horizontal: 8),
353+
const EdgeInsets.symmetric(horizontal: 4),
359354
MediaQuery.textScaleFactorOf(context),
360355
);
361356
}
@@ -429,23 +424,6 @@ class _OutlinedButtonWithIcon extends OutlinedButton {
429424
clipBehavior: clipBehavior ?? Clip.none,
430425
child: _OutlinedButtonWithIconChild(icon: icon, label: label),
431426
);
432-
433-
@override
434-
ButtonStyle defaultStyleOf(BuildContext context) {
435-
final bool useMaterial3 = Theme.of(context).useMaterial3;
436-
if (!useMaterial3) {
437-
return super.defaultStyleOf(context);
438-
}
439-
final EdgeInsetsGeometry scaledPadding = ButtonStyleButton.scaledPadding(
440-
const EdgeInsetsDirectional.fromSTEB(16, 0, 24, 0),
441-
const EdgeInsetsDirectional.fromSTEB(8, 0, 12, 0),
442-
const EdgeInsetsDirectional.fromSTEB(4, 0, 6, 0),
443-
MediaQuery.textScaleFactorOf(context),
444-
);
445-
return super.defaultStyleOf(context).copyWith(
446-
padding: MaterialStatePropertyAll<EdgeInsetsGeometry>(scaledPadding),
447-
);
448-
}
449427
}
450428

451429
class _OutlinedButtonWithIconChild extends StatelessWidget {

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

+4-9
Original file line numberDiff line numberDiff line change
@@ -270,7 +270,7 @@ class TextButton extends ButtonStyleButton {
270270
/// * `shadowColor` - Theme.shadowColor
271271
/// * `elevation` - 0
272272
/// * `padding`
273-
/// * `textScaleFactor <= 1` - (horizontal(12), vertical(8))
273+
/// * `textScaleFactor <= 1` - all(8)
274274
/// * `1 < textScaleFactor <= 2` - lerp(all(8), horizontal(8))
275275
/// * `2 < textScaleFactor <= 3` - lerp(horizontal(8), horizontal(4))
276276
/// * `3 < textScaleFactor` - horizontal(4)
@@ -320,7 +320,7 @@ class TextButton extends ButtonStyleButton {
320320
/// * `surfaceTintColor` - null
321321
/// * `elevation` - 0
322322
/// * `padding`
323-
/// * `textScaleFactor <= 1` - lerp(horizontal(12), horizontal(4))
323+
/// * `textScaleFactor <= 1` - all(8)
324324
/// * `1 < textScaleFactor <= 2` - lerp(all(8), horizontal(8))
325325
/// * `2 < textScaleFactor <= 3` - lerp(horizontal(8), horizontal(4))
326326
/// * `3 < textScaleFactor` - horizontal(4)
@@ -338,9 +338,6 @@ class TextButton extends ButtonStyleButton {
338338
/// * `enableFeedback` - true
339339
/// * `alignment` - Alignment.center
340340
/// * `splashFactory` - Theme.splashFactory
341-
///
342-
/// For the [TextButton.icon] factory, the end (generally the right) value of
343-
/// [padding] is increased from 12 to 16.
344341
/// {@endtemplate}
345342
@override
346343
ButtonStyle defaultStyleOf(BuildContext context) {
@@ -381,9 +378,8 @@ class TextButton extends ButtonStyleButton {
381378
}
382379

383380
EdgeInsetsGeometry _scaledPadding(BuildContext context) {
384-
final bool useMaterial3 = Theme.of(context).useMaterial3;
385381
return ButtonStyleButton.scaledPadding(
386-
useMaterial3 ? const EdgeInsets.symmetric(horizontal: 12, vertical: 8) : const EdgeInsets.all(8),
382+
const EdgeInsets.all(8),
387383
const EdgeInsets.symmetric(horizontal: 8),
388384
const EdgeInsets.symmetric(horizontal: 4),
389385
MediaQuery.textScaleFactorOf(context),
@@ -495,9 +491,8 @@ class _TextButtonWithIcon extends TextButton {
495491

496492
@override
497493
ButtonStyle defaultStyleOf(BuildContext context) {
498-
final bool useMaterial3 = Theme.of(context).useMaterial3;
499494
final EdgeInsetsGeometry scaledPadding = ButtonStyleButton.scaledPadding(
500-
useMaterial3 ? const EdgeInsetsDirectional.fromSTEB(12, 8, 16, 8) : const EdgeInsets.all(8),
495+
const EdgeInsets.all(8),
501496
const EdgeInsets.symmetric(horizontal: 4),
502497
const EdgeInsets.symmetric(horizontal: 4),
503498
MediaQuery.textScaleFactorOf(context),

‎packages/flutter/test/material/elevated_button_test.dart

-53
Original file line numberDiff line numberDiff line change
@@ -1147,59 +1147,6 @@ void main() {
11471147
expect(paddingWidget.padding, const EdgeInsets.all(22));
11481148
});
11491149

1150-
testWidgets('M3 ElevatedButton has correct padding', (WidgetTester tester) async {
1151-
final Key key = UniqueKey();
1152-
await tester.pumpWidget(
1153-
MaterialApp(
1154-
theme: ThemeData.from(colorScheme: const ColorScheme.light(), useMaterial3: true),
1155-
home: Scaffold(
1156-
body: Center(
1157-
child: ElevatedButton(
1158-
key: key,
1159-
onPressed: () {},
1160-
child: const Text('ElevatedButton'),
1161-
),
1162-
),
1163-
),
1164-
),
1165-
);
1166-
1167-
final Padding paddingWidget = tester.widget<Padding>(
1168-
find.descendant(
1169-
of: find.byKey(key),
1170-
matching: find.byType(Padding),
1171-
),
1172-
);
1173-
expect(paddingWidget.padding, const EdgeInsets.symmetric(horizontal: 24));
1174-
});
1175-
1176-
testWidgets('M3 ElevatedButton.icon has correct padding', (WidgetTester tester) async {
1177-
final Key key = UniqueKey();
1178-
await tester.pumpWidget(
1179-
MaterialApp(
1180-
theme: ThemeData.from(colorScheme: const ColorScheme.light(), useMaterial3: true),
1181-
home: Scaffold(
1182-
body: Center(
1183-
child: ElevatedButton.icon(
1184-
key: key,
1185-
icon: const Icon(Icons.favorite),
1186-
onPressed: () {},
1187-
label: const Text('ElevatedButton'),
1188-
),
1189-
),
1190-
),
1191-
),
1192-
);
1193-
1194-
final Padding paddingWidget = tester.widget<Padding>(
1195-
find.descendant(
1196-
of: find.byKey(key),
1197-
matching: find.byType(Padding),
1198-
),
1199-
);
1200-
expect(paddingWidget.padding, const EdgeInsetsDirectional.fromSTEB(16.0, 0.0, 24.0, 0.0));
1201-
});
1202-
12031150
testWidgets('Elevated buttons animate elevation before color on disable', (WidgetTester tester) async {
12041151
// This is a regression test for https://github.com/flutter/flutter/issues/387
12051152

‎packages/flutter/test/material/filled_button_test.dart

-53
Original file line numberDiff line numberDiff line change
@@ -1224,59 +1224,6 @@ void main() {
12241224
expect(paddingWidget.padding, const EdgeInsets.all(22));
12251225
});
12261226

1227-
testWidgets('M3 FilledButton has correct padding', (WidgetTester tester) async {
1228-
final Key key = UniqueKey();
1229-
await tester.pumpWidget(
1230-
MaterialApp(
1231-
theme: ThemeData.from(colorScheme: const ColorScheme.light(), useMaterial3: true),
1232-
home: Scaffold(
1233-
body: Center(
1234-
child: ElevatedButton(
1235-
key: key,
1236-
onPressed: () {},
1237-
child: const Text('FilledButton'),
1238-
),
1239-
),
1240-
),
1241-
),
1242-
);
1243-
1244-
final Padding paddingWidget = tester.widget<Padding>(
1245-
find.descendant(
1246-
of: find.byKey(key),
1247-
matching: find.byType(Padding),
1248-
),
1249-
);
1250-
expect(paddingWidget.padding, const EdgeInsets.symmetric(horizontal: 24));
1251-
});
1252-
1253-
testWidgets('M3 FilledButton.icon has correct padding', (WidgetTester tester) async {
1254-
final Key key = UniqueKey();
1255-
await tester.pumpWidget(
1256-
MaterialApp(
1257-
theme: ThemeData.from(colorScheme: const ColorScheme.light(), useMaterial3: true),
1258-
home: Scaffold(
1259-
body: Center(
1260-
child: FilledButton.icon(
1261-
key: key,
1262-
icon: const Icon(Icons.favorite),
1263-
onPressed: () {},
1264-
label: const Text('ElevatedButton'),
1265-
),
1266-
),
1267-
),
1268-
),
1269-
);
1270-
1271-
final Padding paddingWidget = tester.widget<Padding>(
1272-
find.descendant(
1273-
of: find.byKey(key),
1274-
matching: find.byType(Padding),
1275-
),
1276-
);
1277-
expect(paddingWidget.padding, const EdgeInsetsDirectional.fromSTEB(16.0, 0.0, 24.0, 0.0));
1278-
});
1279-
12801227
testWidgets('By default, FilledButton shape outline is defined by shape.side', (WidgetTester tester) async {
12811228
const Color borderColor = Color(0xff4caf50);
12821229
await tester.pumpWidget(

0 commit comments

Comments
 (0)