Skip to content

Commit

Permalink
chore: update to flutter 3.22.0 (#74)
Browse files Browse the repository at this point in the history 
chore: Renamed 'MaterialState' to 'WidgetState'
chore: Deprecated colors: background, onBackground, surfaceVariant
chore: Added basic support for new material color variants (not used yet, just added to constructor for future use)
  • Loading branch information
@thelukewalton
thelukewalton committed May 16, 2024
1 parent 3e95547 commit bbfadac
Show file tree
Hide file tree
Showing 18 changed files with 258 additions and 218 deletions.
4 changes: 2 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,12 +76,12 @@ To tie everything together, use the `ZetaProvider` constructor. The `builder` ar
themeMode: themeMode,
theme: ThemeData(
fontFamily: themeData.fontFamily,
scaffoldBackgroundColor: light.background,
scaffoldBackgroundColor: light.surfaceTertiary,
colorScheme: light,
),
darkTheme: ThemeData(
fontFamily: themeData.fontFamily,
scaffoldBackgroundColor: dark.background,
scaffoldBackgroundColor: dark.surfaceTertiary,
colorScheme: dark,
),
);
Expand Down
4 changes: 2 additions & 2 deletions example/lib/main.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,14 +51,14 @@ class ZetaExample extends StatelessWidget {
theme: ThemeData(
useMaterial3: true,
fontFamily: themeData.fontFamily,
scaffoldBackgroundColor: light.background,
scaffoldBackgroundColor: light.surfaceTertiary,
colorScheme: light,
textTheme: zetaTextTheme,
),
darkTheme: ThemeData(
useMaterial3: true,
fontFamily: themeData.fontFamily,
scaffoldBackgroundColor: dark.background,
scaffoldBackgroundColor: dark.surfaceTertiary,
colorScheme: dark,
textTheme: zetaTextTheme,
),
Expand Down
2 changes: 1 addition & 1 deletion example/lib/pages/components/progress_example.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ class ProgressExample extends StatefulWidget {
}

class ProgressExampleState extends State<ProgressExample> {
MaterialStatesController controller = MaterialStatesController();
WidgetStatesController controller = WidgetStatesController();

@override
void initState() {
Expand Down
4 changes: 2 additions & 2 deletions example/widgetbook/main.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -190,14 +190,14 @@ class HotReload extends StatelessWidget {
themeMode: themeMode,
theme: ThemeData(
useMaterial3: true,
scaffoldBackgroundColor: light.background,
scaffoldBackgroundColor: light.surfaceTertiary,
colorScheme: light,
textTheme: zetaTextTheme,
brightness: Brightness.light,
),
darkTheme: ThemeData(
useMaterial3: true,
scaffoldBackgroundColor: dark.background,
scaffoldBackgroundColor: dark.surfaceTertiary,
colorScheme: dark,
textTheme: zetaTextTheme,
brightness: Brightness.dark,
Expand Down
14 changes: 7 additions & 7 deletions lib/src/components/accordion/accordion.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,25 +110,25 @@ class _ZetaAccordionState extends State<ZetaAccordion> with TickerProviderStateM
children: [
TextButton(
style: ButtonStyle(
shape: MaterialStatePropertyAll(
shape: WidgetStatePropertyAll(
RoundedRectangleBorder(borderRadius: widget.rounded ? ZetaRadius.minimal : ZetaRadius.none),
),
overlayColor: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.hovered)) {
overlayColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.hovered)) {
return zetaColors.cool.shade20;
}
if (states.contains(MaterialState.pressed)) {
if (states.contains(WidgetState.pressed)) {
return zetaColors.cool.shade30;
}

if (states.contains(MaterialState.focused)) {
if (states.contains(WidgetState.focused)) {
return Colors.transparent;
}

return null;
}),
side: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.focused)) {
side: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.focused)) {
return BorderSide(color: zetaColors.blue.shade50, width: 2);
}
return null;
Expand Down
34 changes: 17 additions & 17 deletions lib/src/components/breadcrumbs/breadcrumbs.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -169,7 +169,7 @@ class ZetaBreadCrumb extends StatefulWidget {
}

class _ZetaBreadCrumbState extends State<ZetaBreadCrumb> {
final controller = MaterialStatesController();
final controller = WidgetStatesController();

@override
void initState() {
Expand All @@ -189,7 +189,7 @@ class _ZetaBreadCrumbState extends State<ZetaBreadCrumb> {
onTap: widget.onPressed,
enableFeedback: false,
splashColor: Colors.transparent,
overlayColor: MaterialStateProperty.resolveWith((states) {
overlayColor: WidgetStateProperty.resolveWith((states) {
return Colors.transparent;
}),
child: Row(
Expand All @@ -212,8 +212,8 @@ class _ZetaBreadCrumbState extends State<ZetaBreadCrumb> {
}

/// Get color of breadcrumb based on state.
Color getColor(Set<MaterialState> states, ZetaColors colors) {
if (states.contains(MaterialState.hovered)) {
Color getColor(Set<WidgetState> states, ZetaColors colors) {
if (states.contains(WidgetState.hovered)) {
return colors.blue;
}
if (widget.isSelected) return colors.black;
Expand All @@ -224,7 +224,7 @@ class _ZetaBreadCrumbState extends State<ZetaBreadCrumb> {
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
super.debugFillProperties(properties);
properties.add(
DiagnosticsProperty<MaterialStatesController>(
DiagnosticsProperty<WidgetStatesController>(
'controller',
controller,
),
Expand Down Expand Up @@ -272,31 +272,31 @@ class _BreadCrumbsTruncatedState extends State<BreadCrumbsTruncated> {
});
},
style: ButtonStyle(
backgroundColor: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.hovered)) {
backgroundColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.hovered)) {
return colors.surfaceHovered;
}
if (states.contains(MaterialState.pressed)) {
if (states.contains(WidgetState.pressed)) {
return colors.primary.shade10;
}
if (states.contains(MaterialState.disabled)) {
if (states.contains(WidgetState.disabled)) {
return colors.surfaceDisabled;
}
return colors.warm.shade10;
}),
foregroundColor: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.disabled)) {
foregroundColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.disabled)) {
return colors.textDisabled;
}
return colors.textDefault;
}),
shape: MaterialStatePropertyAll(
shape: WidgetStatePropertyAll(
RoundedRectangleBorder(
borderRadius: (widget.rounded ? ZetaRadius.minimal : ZetaRadius.none),
),
),
side: MaterialStateProperty.resolveWith((states) {
if (states.contains(MaterialState.focused)) {
side: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.focused)) {
return BorderSide(
width: ZetaSpacing.x0_5,
color: colors.primary.shade100,
Expand All @@ -307,9 +307,9 @@ class _BreadCrumbsTruncatedState extends State<BreadCrumbsTruncated> {
}
return null;
}),
padding: MaterialStateProperty.all(EdgeInsets.zero),
minimumSize: MaterialStateProperty.all(Size.zero),
elevation: const MaterialStatePropertyAll(0),
padding: WidgetStateProperty.all(EdgeInsets.zero),
minimumSize: WidgetStateProperty.all(Size.zero),
elevation: const WidgetStatePropertyAll(0),
),
child: Icon(
widget.rounded ? ZetaIcons.more_horizontal_round : ZetaIcons.more_horizontal_sharp,
Expand Down
39 changes: 17 additions & 22 deletions lib/src/components/buttons/button_group.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -189,14 +189,14 @@ class ZetaGroupButton extends StatefulWidget {
}

class _ZetaGroupButtonState extends State<ZetaGroupButton> {
late MaterialStatesController controller;
late WidgetStatesController controller;

@override
void initState() {
super.initState();
controller = MaterialStatesController();
controller = WidgetStatesController();
controller.addListener(() {
if (!controller.value.contains(MaterialState.disabled) && context.mounted && mounted) {
if (!controller.value.contains(WidgetState.disabled) && context.mounted && mounted) {
// TODO(UX-1005): setState causing exception when going from disabled to enabled.
setState(() {});
}
Expand Down Expand Up @@ -225,7 +225,7 @@ class _ZetaGroupButtonState extends State<ZetaGroupButton> {
top: borderSide,
left: borderSide,
bottom: borderSide,
right: controller.value.contains(MaterialState.focused)
right: controller.value.contains(WidgetState.focused)
? BorderSide(color: colors.blue.shade50, width: 2)
: (widget.isFinal)
? borderSide
Expand Down Expand Up @@ -259,15 +259,15 @@ class _ZetaGroupButtonState extends State<ZetaGroupButton> {
double get _padding => widget.isLarge ? ZetaSpacing.x4 : ZetaSpacing.x3;

BorderSide _getBorderSide(
Set<MaterialState> states,
Set<WidgetState> states,
ZetaColors colors,
bool finalButton,
) {
if (states.contains(MaterialState.focused)) {
if (states.contains(WidgetState.focused)) {
return BorderSide(color: colors.blue.shade50, width: ZetaSpacing.x0_5);
}
if (widget.isInverse) return BorderSide(color: colors.black);
if (states.contains(MaterialState.disabled)) {
if (states.contains(WidgetState.disabled)) {
return BorderSide(color: colors.cool.shade40);
}
return BorderSide(
Expand All @@ -293,45 +293,40 @@ class _ZetaGroupButtonState extends State<ZetaGroupButton> {

ButtonStyle getStyle(ZetaWidgetBorder borderType, ZetaColors colors) {
return ButtonStyle(
shape: MaterialStateProperty.all(
shape: WidgetStateProperty.all(
RoundedRectangleBorder(
borderRadius: _getRadius(borderType),
),
),
backgroundColor: MaterialStateProperty.resolveWith<Color?>((states) {
backgroundColor: WidgetStateProperty.resolveWith<Color?>((states) {
if (widget.isInverse) return colors.cool.shade100;

if (states.contains(MaterialState.disabled)) {
if (states.contains(WidgetState.disabled)) {
return colors.surfaceDisabled;
}
if (states.contains(MaterialState.pressed)) {
if (states.contains(WidgetState.pressed)) {
return colors.primary.shade10;
}
if (states.contains(MaterialState.hovered)) {
if (states.contains(WidgetState.hovered)) {
return colors.cool.shade20;
}
return colors.surfacePrimary;
}),
foregroundColor: MaterialStateProperty.resolveWith<Color?>((states) {
if (states.contains(MaterialState.disabled)) {
foregroundColor: WidgetStateProperty.resolveWith<Color?>((states) {
if (states.contains(WidgetState.disabled)) {
return colors.textDisabled;
}
if (widget.isInverse) return colors.cool.shade100.onColor;
return colors.textDefault;
}),
elevation: const MaterialStatePropertyAll(0),
padding: MaterialStateProperty.all(EdgeInsets.zero),
elevation: const WidgetStatePropertyAll(0),
padding: WidgetStateProperty.all(EdgeInsets.zero),
);
}

@override
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
super.debugFillProperties(properties);
properties.add(
DiagnosticsProperty<MaterialStatesController>(
'controller',
controller,
),
);
properties.add(DiagnosticsProperty<WidgetStatesController>('controller', controller));
}
}
28 changes: 14 additions & 14 deletions lib/src/components/buttons/button_style.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,28 +91,28 @@ ButtonStyle buttonStyle(
final bool isSolid = type.solid || backgroundColor != null;

return ButtonStyle(
minimumSize: MaterialStateProperty.all(const Size.square(32)),
shape: MaterialStateProperty.all(
minimumSize: WidgetStateProperty.all(const Size.square(32)),
shape: WidgetStateProperty.all(
RoundedRectangleBorder(borderRadius: borderType.radius),
),
backgroundColor: MaterialStateProperty.resolveWith<Color?>(
backgroundColor: WidgetStateProperty.resolveWith<Color?>(
(states) {
if (states.contains(MaterialState.disabled)) {
if (states.contains(WidgetState.disabled)) {
return colors.surfaceDisabled;
}
if (states.contains(MaterialState.pressed)) {
if (states.contains(WidgetState.pressed)) {
return isSolid ? color.shade70 : colors.primary.shade10;
}
if (states.contains(MaterialState.hovered)) {
if (states.contains(WidgetState.hovered)) {
return isSolid ? color.shade50 : colors.cool.shade20;
}
if (backgroundColor != null) return backgroundColor;
return isSolid ? color : Colors.transparent;
},
),
foregroundColor: MaterialStateProperty.resolveWith<Color?>(
foregroundColor: WidgetStateProperty.resolveWith<Color?>(
(states) {
if (states.contains(MaterialState.disabled)) {
if (states.contains(WidgetState.disabled)) {
return colors.textDisabled;
}
switch (type) {
Expand All @@ -129,15 +129,15 @@ ButtonStyle buttonStyle(
}
},
),
overlayColor: MaterialStateProperty.resolveWith((Set<MaterialState> states) {
overlayColor: WidgetStateProperty.resolveWith((Set<WidgetState> states) {
return null;
}),
side: MaterialStateProperty.resolveWith((Set<MaterialState> states) {
if (type.border && states.contains(MaterialState.disabled)) {
side: WidgetStateProperty.resolveWith((Set<WidgetState> states) {
if (type.border && states.contains(WidgetState.disabled)) {
return BorderSide(color: colors.borderDisabled);
}
// TODO(thelukewalton): This removes a defualt border when focused, rather than adding a second border when focused.
if (states.contains(MaterialState.focused)) {
if (states.contains(WidgetState.focused)) {
return BorderSide(color: colors.blue, width: ZetaSpacing.x0_5);
}
if (type.border) {
Expand All @@ -148,7 +148,7 @@ ButtonStyle buttonStyle(

return null;
}),
elevation: const MaterialStatePropertyAll(0),
padding: MaterialStateProperty.all(EdgeInsets.zero),
elevation: const WidgetStatePropertyAll(0),
padding: WidgetStateProperty.all(EdgeInsets.zero),
);
}
12 changes: 6 additions & 6 deletions lib/src/components/buttons/fab.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -127,14 +127,14 @@ class _ZetaFABState extends State<ZetaFAB> {
backgroundColor: backgroundColor,
foregroundColor: backgroundColor.onColor,
).copyWith(
overlayColor: MaterialStateProperty.resolveWith((Set<MaterialState> states) {
if (states.contains(MaterialState.hovered)) return colors.hover;
if (states.contains(MaterialState.pressed)) return colors.selected;
overlayColor: WidgetStateProperty.resolveWith((Set<WidgetState> states) {
if (states.contains(WidgetState.hovered)) return colors.hover;
if (states.contains(WidgetState.pressed)) return colors.selected;
return null;
}),
side: MaterialStateProperty.resolveWith(
(Set<MaterialState> states) {
if (states.contains(MaterialState.focused)) {
side: WidgetStateProperty.resolveWith(
(Set<WidgetState> states) {
if (states.contains(WidgetState.focused)) {
// TODO(thelukewalton): This removes a defualt border when focused, rather than adding a second border when focused.
return BorderSide(color: Zeta.of(context).colors.blue.shade50, width: ZetaSpacing.x0_5);
}
Expand Down
Loading

0 comments on commit bbfadac

Please sign in to comment.