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

Convert button .icon and .tonalIcon constructors to take nullable icons. (#142644)

Browse Source 
## Description

This changes the factory constructors for `TextButton.icon`, `ElevatedButton.icon`, `FilledButton.icon`, and `FilledButton.tonalIcon` to take nullable icons. If the icon is null, then the "regular" version of the button is created.

## Tests
 - Added tests for all four constructors.
This commit is contained in:
Greg Spencer 2024-01-31 16:24:54 -08:00 committed by GitHub
parent b34ee07372
commit 2652b9a305
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 345 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
packages/flutter/lib/src/material/elevated_button.dart
View File

@ -81,6 +81,8 @@ class ElevatedButton extends ButtonStyleButton {
///
/// The icon and label are arranged in a row and padded by 12 logical pixels
/// at the start, and 16 at the end, with an 8 pixel gap in between.
///
/// If [icon] is null, will create an [ElevatedButton] instead.
factory ElevatedButton.icon({
Key? key,
required VoidCallback? onPressed,
@ -92,9 +94,39 @@ class ElevatedButton extends ButtonStyleButton {
bool? autofocus,
Clip? clipBehavior,
MaterialStatesController? statesController,
required Widget icon,
Widget? icon,
required Widget label,
}) = _ElevatedButtonWithIcon;
}) {
if (icon == null) {
return ElevatedButton(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
onHover: onHover,
onFocusChange: onFocusChange,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
child: label,
);
}
return _ElevatedButtonWithIcon(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
onHover: onHover,
onFocusChange: onFocusChange,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
icon: icon,
label: label,
);
}
/// A static convenience method that constructs an elevated button
/// [ButtonStyle] given simple values.

59
packages/flutter/lib/src/material/filled_button.dart
View File

@ -81,6 +81,8 @@ class FilledButton extends ButtonStyleButton {
///
/// The icon and label are arranged in a row with padding at the start and end
/// and a gap between them.
///
/// If [icon] is null, will create a [FilledButton] instead.
factory FilledButton.icon({
Key? key,
required VoidCallback? onPressed,
@ -92,9 +94,39 @@ class FilledButton extends ButtonStyleButton {
bool? autofocus,
Clip? clipBehavior,
MaterialStatesController? statesController,
required Widget icon,
Widget? icon,
required Widget label,
}) = _FilledButtonWithIcon;
}) {
if (icon == null) {
return FilledButton(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
onHover: onHover,
onFocusChange: onFocusChange,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
child: label,
);
}
return _FilledButtonWithIcon(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
onHover: onHover,
onFocusChange: onFocusChange,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
icon: icon,
label: label,
);
}
/// Create a tonal variant of FilledButton.
///
@ -118,8 +150,10 @@ class FilledButton extends ButtonStyleButton {
/// Create a filled tonal button from [icon] and [label].
///
/// The icon and label are arranged in a row with padding at the start and end
/// and a gap between them.
/// The [icon] and [label] are arranged in a row with padding at the start and
/// end and a gap between them.
///
/// If [icon] is null, will create a [FilledButton.tonal] instead.
factory FilledButton.tonalIcon({
Key? key,
required VoidCallback? onPressed,
@ -131,9 +165,24 @@ class FilledButton extends ButtonStyleButton {
bool? autofocus,
Clip? clipBehavior,
MaterialStatesController? statesController,
required Widget icon,
Widget? icon,
required Widget label,
}) {
if (icon == null) {
return FilledButton.tonal(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
onHover: onHover,
onFocusChange: onFocusChange,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
child: label,
);
}
return _FilledButtonWithIcon.tonal(
key: key,
onPressed: onPressed,

32
packages/flutter/lib/src/material/outlined_button.dart
View File

@ -85,6 +85,8 @@ class OutlinedButton extends ButtonStyleButton {
///
/// The icon and label are arranged in a row and padded by 12 logical pixels
/// at the start, and 16 at the end, with an 8 pixel gap in between.
///
/// If [icon] is null, will create an [OutlinedButton] instead.
factory OutlinedButton.icon({
Key? key,
required VoidCallback? onPressed,
@ -94,9 +96,35 @@ class OutlinedButton extends ButtonStyleButton {
bool? autofocus,
Clip? clipBehavior,
MaterialStatesController? statesController,
required Widget icon,
Widget? icon,
required Widget label,
}) = _OutlinedButtonWithIcon;
}) {
if (icon == null) {
return OutlinedButton(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
child: label,
);
}
return _OutlinedButtonWithIcon(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
icon: icon,
label: label,
);
}
/// A static convenience method that constructs an outlined button
/// [ButtonStyle] given simple values.

33
packages/flutter/lib/src/material/text_button.dart
View File

@ -105,9 +105,38 @@ class TextButton extends ButtonStyleButton {
bool? autofocus,
Clip? clipBehavior,
MaterialStatesController? statesController,
required Widget icon,
Widget? icon,
required Widget label,
}) = _TextButtonWithIcon;
}) {
if (icon == null) {
return TextButton(
key: key,
onPressed: onPressed,
onLongPress: onLongPress,
onHover: onHover,
onFocusChange: onFocusChange,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
child: label,
);
}
return _TextButtonWithIcon( key: key,
onPressed: onPressed,
onLongPress: onLongPress,
onHover: onHover,
onFocusChange: onFocusChange,
style: style,
focusNode: focusNode,
autofocus: autofocus ?? false,
clipBehavior: clipBehavior ?? Clip.none,
statesController: statesController,
icon: icon,
label: label,
);
}
/// A static convenience method that constructs a text button
/// [ButtonStyle] given simple values.

39
packages/flutter/test/material/elevated_button_test.dart
View File

@ -159,6 +159,45 @@ void main() {
expect(material.type, MaterialType.button);
});
testWidgets('ElevatedButton.icon produces the correct widgets if icon is null', (WidgetTester tester) async {
const ColorScheme colorScheme = ColorScheme.light();
final ThemeData theme = ThemeData.from(colorScheme: colorScheme);
final Key iconButtonKey = UniqueKey();
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: ElevatedButton.icon(
key: iconButtonKey,
onPressed: () { },
icon: const Icon(Icons.add),
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsOneWidget);
expect(find.text('label'), findsOneWidget);
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: ElevatedButton.icon(
key: iconButtonKey,
onPressed: () { },
// No icon specified.
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsNothing);
expect(find.text('label'), findsOneWidget);
});
testWidgets('Default ElevatedButton meets a11y contrast guidelines', (WidgetTester tester) async {
final FocusNode focusNode = FocusNode();

78
packages/flutter/test/material/filled_button_test.dart
View File

@ -127,6 +127,84 @@ void main() {
await tester.pumpAndSettle();
});
testWidgets('FilledButton.icon produces the correct widgets if icon is null', (WidgetTester tester) async {
const ColorScheme colorScheme = ColorScheme.light();
final ThemeData theme = ThemeData.from(colorScheme: colorScheme);
final Key iconButtonKey = UniqueKey();
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: FilledButton.icon(
key: iconButtonKey,
onPressed: () { },
icon: const Icon(Icons.add),
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsOneWidget);
expect(find.text('label'), findsOneWidget);
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: FilledButton.icon(
key: iconButtonKey,
onPressed: () { },
// No icon specified.
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsNothing);
expect(find.text('label'), findsOneWidget);
});
testWidgets('FilledButton.tonalIcon produces the correct widgets if icon is null', (WidgetTester tester) async {
const ColorScheme colorScheme = ColorScheme.light();
final ThemeData theme = ThemeData.from(colorScheme: colorScheme);
final Key iconButtonKey = UniqueKey();
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: FilledButton.tonalIcon(
key: iconButtonKey,
onPressed: () { },
icon: const Icon(Icons.add),
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsOneWidget);
expect(find.text('label'), findsOneWidget);
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: FilledButton.tonalIcon(
key: iconButtonKey,
onPressed: () { },
// No icon specified.
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsNothing);
expect(find.text('label'), findsOneWidget);
});
testWidgets('FilledButton.tonal, FilledButton.tonalIcon defaults', (WidgetTester tester) async {
const ColorScheme colorScheme = ColorScheme.light();
final ThemeData theme = ThemeData.from(colorScheme: colorScheme);

39
packages/flutter/test/material/outlined_button_test.dart
View File

@ -174,6 +174,45 @@ void main() {
expect(material.type, MaterialType.button);
});
testWidgets('OutlinedButton.icon produces the correct widgets if icon is null', (WidgetTester tester) async {
const ColorScheme colorScheme = ColorScheme.light();
final ThemeData theme = ThemeData.from(colorScheme: colorScheme);
final Key iconButtonKey = UniqueKey();
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: OutlinedButton.icon(
key: iconButtonKey,
onPressed: () { },
icon: const Icon(Icons.add),
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsOneWidget);
expect(find.text('label'), findsOneWidget);
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: OutlinedButton.icon(
key: iconButtonKey,
onPressed: () { },
// No icon specified.
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsNothing);
expect(find.text('label'), findsOneWidget);
});
testWidgets('OutlinedButton default overlayColor resolves pressed state', (WidgetTester tester) async {
final FocusNode focusNode = FocusNode();
final ThemeData theme = ThemeData(useMaterial3: true);

39
packages/flutter/test/material/text_button_test.dart
View File

@ -154,6 +154,45 @@ void main() {
expect(material.type, MaterialType.button);
});
testWidgets('TextButton.icon produces the correct widgets when icon is null', (WidgetTester tester) async {
const ColorScheme colorScheme = ColorScheme.light();
final ThemeData theme = ThemeData.from(colorScheme: colorScheme);
final Key iconButtonKey = UniqueKey();
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: TextButton.icon(
key: iconButtonKey,
onPressed: () { },
icon: const Icon(Icons.add),
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsOneWidget);
expect(find.text('label'), findsOneWidget);
await tester.pumpWidget(
MaterialApp(
theme: theme,
home: Center(
child: TextButton.icon(
key: iconButtonKey,
onPressed: () { },
// No icon specified.
label: const Text('label'),
),
),
),
);
expect(find.byIcon(Icons.add), findsNothing);
expect(find.text('label'), findsOneWidget);
});
testWidgets('Default TextButton meets a11y contrast guidelines', (WidgetTester tester) async {
final FocusNode focusNode = FocusNode();