Use .fromMap() constructors in example code (#152535)

Currently, there are 21 `.resolveWith()` calls in example files.

This pull request changes 11 of them to use the new `.fromMap()` constructor. (Seven of them are now `const`!)

```dart
ListTile(
  iconColor: WidgetStateColor.fromMap(<WidgetStatesConstraint, Color>{
    WidgetState.disabled: Colors.red,
    WidgetState.selected: Colors.green,
    WidgetState.any:      Colors.black,
  }),
  // The same can be achieved using the .resolveWith() constructor.
  // The text color will be identical to the icon color above.
  textColor: WidgetStateColor.resolveWith((Set<WidgetState> states) {
    if (states.contains(WidgetState.disabled)) {
      return Colors.red;
    }
    if (states.contains(WidgetState.selected)) {
      return Colors.green;
    }
    return Colors.black;
  }),
),
```
This commit is contained in:
Nate Wilson 2024-08-01 16:28:22 -06:00 committed by GitHub
parent 8a4812a6da
commit 6ff806d74e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 67 additions and 102 deletions

View File

@ -32,12 +32,12 @@ class MaterialStateExample extends StatelessWidget {
initialValue: 'abc',
decoration: InputDecoration(
prefixIcon: const Icon(Icons.person),
prefixIconColor: WidgetStateColor.resolveWith((Set<WidgetState> states) {
if (states.contains(WidgetState.focused)) {
return Colors.green;
}
return Colors.grey;
}),
prefixIconColor: WidgetStateColor.fromMap(
<WidgetStatesConstraint, Color>{
WidgetState.focused: Colors.green,
WidgetState.any: Colors.grey,
},
),
),
);
}

View File

@ -32,15 +32,11 @@ class MaterialStateExample extends StatelessWidget {
return Theme(
data: themeData.copyWith(
inputDecorationTheme: themeData.inputDecorationTheme.copyWith(
prefixIconColor: WidgetStateColor.resolveWith(
(Set<WidgetState> states) {
if (states.contains(WidgetState.error)) {
return Colors.red;
}
if (states.contains(WidgetState.focused)) {
return Colors.blue;
}
return Colors.grey;
prefixIconColor: WidgetStateColor.fromMap(
<WidgetStatesConstraint, Color>{
WidgetState.error: Colors.red,
WidgetState.focused: Colors.blue,
WidgetState.any: Colors.grey,
},
),
),

View File

@ -45,19 +45,13 @@ class _ListTileExampleState extends State<ListTileExample> {
_selected = !_selected;
});
},
// This sets text color and icon color to red when list tile is disabled and
// green when list tile is selected, otherwise sets it to black.
iconColor: WidgetStateColor.resolveWith((Set<WidgetState> states) {
if (states.contains(WidgetState.disabled)) {
return Colors.red;
}
if (states.contains(WidgetState.selected)) {
return Colors.green;
}
return Colors.black;
iconColor: WidgetStateColor.fromMap(<WidgetStatesConstraint, Color>{
WidgetState.disabled: Colors.red,
WidgetState.selected: Colors.green,
WidgetState.any: Colors.black,
}),
// This sets text color and icon color to red when list tile is disabled and
// green when list tile is selected, otherwise sets it to black.
// The same can be achieved using the .resolveWith() constructor.
// The text color will be identical to the icon color above.
textColor: WidgetStateColor.resolveWith((Set<WidgetState> states) {
if (states.contains(WidgetState.disabled)) {
return Colors.red;

View File

@ -37,32 +37,19 @@ class _SwitchExampleState extends State<SwitchExample> {
@override
Widget build(BuildContext context) {
final WidgetStateProperty<Color?> trackColor = WidgetStateProperty.resolveWith<Color?>(
(Set<WidgetState> states) {
// Track color when the switch is selected.
if (states.contains(WidgetState.selected)) {
return Colors.amber;
}
// Otherwise return null to set default track color
// for remaining states such as when the switch is
// hovered, focused, or disabled.
return null;
// This object sets amber as the track color when the switch is selected.
// Otherwise, it resolves to null and defers to values from the theme data.
const WidgetStateProperty<Color?> trackColor = WidgetStateProperty<Color?>.fromMap(
<WidgetStatesConstraint, Color>{
WidgetState.selected: Colors.amber,
},
);
final WidgetStateProperty<Color?> overlayColor = WidgetStateProperty.resolveWith<Color?>(
(Set<WidgetState> states) {
// Material color when switch is selected.
if (states.contains(WidgetState.selected)) {
return Colors.amber.withOpacity(0.54);
}
// Material color when switch is disabled.
if (states.contains(WidgetState.disabled)) {
return Colors.grey.shade400;
}
// Otherwise return null to set default material color
// for remaining states such as when the switch is
// hovered, or focused.
return null;
// This object sets the track color based on two WidgetState attributes.
// If neither state applies, it resolves to null.
final WidgetStateProperty<Color?> overlayColor = WidgetStateProperty<Color?>.fromMap(
<WidgetState, Color>{
WidgetState.selected: Colors.amber.withOpacity(0.54),
WidgetState.disabled: Colors.grey.shade400,
},
);

View File

@ -36,12 +36,10 @@ class _SwitchExampleState extends State<SwitchExample> {
bool light0 = true;
bool light1 = true;
final WidgetStateProperty<Icon?> thumbIcon = WidgetStateProperty.resolveWith<Icon?>(
(Set<WidgetState> states) {
if (states.contains(WidgetState.selected)) {
return const Icon(Icons.check);
}
return const Icon(Icons.close);
static const WidgetStateProperty<Icon> thumbIcon = WidgetStateProperty<Icon>.fromMap(
<WidgetStatesConstraint, Icon>{
WidgetState.selected: Icon(Icons.check),
WidgetState.any: Icon(Icons.close),
},
);

View File

@ -120,14 +120,12 @@ class _SwitchThemeAdaptation extends Adaptation<SwitchThemeData> {
return defaultValue;
case TargetPlatform.iOS:
case TargetPlatform.macOS:
return SwitchThemeData(
thumbColor: WidgetStateProperty.resolveWith<Color?>((Set<WidgetState> states) {
if (states.contains(WidgetState.selected)) {
return Colors.yellow;
}
return null; // Use the default.
return const SwitchThemeData(
thumbColor: WidgetStateProperty<Color?>.fromMap(<WidgetState, Color>{
WidgetState.selected: Colors.yellow,
// Resolves to null if not selected, deferring to default values.
}),
trackColor: const WidgetStatePropertyAll<Color>(Colors.brown),
trackColor: WidgetStatePropertyAll<Color>(Colors.brown),
);
}
}

View File

@ -66,30 +66,24 @@ class Home extends StatefulWidget {
class _HomeState extends State<Home> {
bool selected = false;
/// Sets the button's foreground and background colors.
/// If not selected, resolves to null and defers to default values.
static const ButtonStyle style = ButtonStyle(
foregroundColor: WidgetStateProperty<Color?>.fromMap(<WidgetState, Color>{
WidgetState.selected: Colors.white,
}),
backgroundColor: WidgetStateProperty<Color?>.fromMap(<WidgetState, Color>{
WidgetState.selected: Colors.indigo,
}),
);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: SelectableButton(
selected: selected,
style: ButtonStyle(
foregroundColor: WidgetStateProperty.resolveWith<Color?>(
(Set<WidgetState> states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return null; // defer to the defaults
},
),
backgroundColor: WidgetStateProperty.resolveWith<Color?>(
(Set<WidgetState> states) {
if (states.contains(WidgetState.selected)) {
return Colors.indigo;
}
return null; // defer to the defaults
},
),
),
style: style,
onPressed: () {
setState(() {
selected = !selected;

View File

@ -78,23 +78,6 @@ class _OrderedButtonState<T> extends State<OrderedButton<T>> {
order = LexicalFocusOrder(widget.order.toString());
}
Color? overlayColor(Set<WidgetState> states) {
if (states.contains(WidgetState.focused)) {
return Colors.red;
}
if (states.contains(WidgetState.hovered)) {
return Colors.blue;
}
return null; // defer to the default overlayColor
}
Color? foregroundColor(Set<WidgetState> states) {
if (states.contains(WidgetState.focused) || states.contains(WidgetState.hovered)) {
return Colors.white;
}
return null; // defer to the default foregroundColor
}
return FocusTraversalOrder(
order: order,
child: Padding(
@ -102,9 +85,24 @@ class _OrderedButtonState<T> extends State<OrderedButton<T>> {
child: OutlinedButton(
focusNode: focusNode,
autofocus: widget.autofocus,
style: ButtonStyle(
overlayColor: WidgetStateProperty.resolveWith<Color?>(overlayColor),
foregroundColor: WidgetStateProperty.resolveWith<Color?>(foregroundColor),
style: const ButtonStyle(
overlayColor: WidgetStateProperty<Color?>.fromMap(
// If neither of these states is active, the property will
// resolve to null, deferring to the default overlay color.
<WidgetState, Color>{
WidgetState.focused: Colors.red,
WidgetState.hovered: Colors.blue,
},
),
foregroundColor: WidgetStateProperty<Color?>.fromMap(
// "WidgetState.focused | WidgetState.hovered" could be used
// instead of separate map keys, but this setup allows setting
// the button style to a constant value for improved efficiency.
<WidgetState, Color>{
WidgetState.focused: Colors.white,
WidgetState.hovered: Colors.white,
},
),
),
onPressed: () => _handleOnPressed(),
child: Text(widget.name),