[material_ui] Add Material 3 Expressive IconButton - #12832
Conversation
There was a problem hiding this comment.
Code Review
This pull request introduces Material 3 Expressive support for the IconButton component. It adds new size, width, and shape variants, updates the ButtonStyle class to include these new properties, and implements the necessary defaults in a generated file. A code review comment correctly identified that the generated code uses the deprecated MaterialStatePropertyAll instead of the preferred WidgetStatePropertyAll, which should be updated to ensure modern API usage.
| String get _sizeDependentProperties { | ||
| return ''' | ||
| @override | ||
| WidgetStateProperty<EdgeInsetsGeometry>? get padding => | ||
| MaterialStatePropertyAll<EdgeInsetsGeometry>($_paddingSwitch); | ||
|
|
||
| @override | ||
| WidgetStateProperty<Size>? get minimumSize => | ||
| MaterialStatePropertyAll<Size>($_minimumSizeSwitch); | ||
|
|
||
| @override | ||
| WidgetStateProperty<Size>? get maximumSize => | ||
| const MaterialStatePropertyAll<Size>(Size.infinite); | ||
|
|
||
| @override | ||
| WidgetStateProperty<double>? get iconSize => | ||
| MaterialStatePropertyAll<double>($_iconSizeSwitch); | ||
|
|
||
| @override | ||
| WidgetStateProperty<OutlinedBorder>? get shape => | ||
| WidgetStateProperty.resolveWith((Set<WidgetState> states) { | ||
| if (states.contains(WidgetState.pressed)) { | ||
| return $_pressedShapeSwitch; | ||
| } | ||
| if (toggleable && states.contains(WidgetState.selected)) { | ||
| return $_selectedShapeSwitch; | ||
| } | ||
| return $_containerShapeSwitch; | ||
| }); | ||
| '''; | ||
| } |
There was a problem hiding this comment.
In modern Flutter, MaterialStatePropertyAll is deprecated in favor of WidgetStatePropertyAll. Since this is a new template generating new code, we should use WidgetStatePropertyAll to avoid deprecation warnings.
Please also apply this replacement to other template methods in this file, such as _generateStandardDefaults, _generateFilledDefaults, _generateFilledTonalDefaults, and _generateOutlinedDefaults.
String get _sizeDependentProperties {
return '''
@override
WidgetStateProperty<EdgeInsetsGeometry>? get padding =>
WidgetStatePropertyAll<EdgeInsetsGeometry>($_paddingSwitch);
@override
WidgetStateProperty<Size>? get minimumSize =>
WidgetStatePropertyAll<Size>($_minimumSizeSwitch);
@override
WidgetStateProperty<Size>? get maximumSize =>
const WidgetStatePropertyAll<Size>(Size.infinite);
@override
WidgetStateProperty<double>? get iconSize =>
WidgetStatePropertyAll<double>($_iconSizeSwitch);
@override
WidgetStateProperty<OutlinedBorder>? get shape =>
WidgetStateProperty.resolveWith((Set<WidgetState> states) {
if (states.contains(WidgetState.pressed)) {
return $_pressedShapeSwitch;
}
if (toggleable && states.contains(WidgetState.selected)) {
return $_selectedShapeSwitch;
}
return $_containerShapeSwitch;
});
''';
}fe2b77a to
e8b4a71
Compare
This PR is to port #12093 which was created in
m3e_migrationfeature branch.The original PR description
This PR is to add Material 3 Expressive IconButton support behind an explicit component-level opt-in.
This PR adds:
ButtonStyleproperties used by the IconButton M3E migration:sizeVarianticonButtonWidthshapeVariantIconButtonThemeData.variantsoIconButtonscan opt intoStyleVariant.material3Expressive.IconButtonTemplateM3Eto generateIconButtondefaults from the M3E token data.IconButtondefaults in:packages/material_ui/lib/src/generated/icon_button_defaults_m3e.g.dartTODO:
Pre-Review Checklist
[shared_preferences]///).