getStyle static method

ButtonStyle getStyle(
  1. {required ZdsButtonVariant variant,
  2. required ZetaColors zetaColors,
  3. required TextTheme textTheme,
  4. EdgeInsetsGeometry? textPadding,
  5. bool isDangerButton = false,
  6. bool isOnDarkBackground = false,
  7. Color? customColor}
)

Returns a ButtonStyle based on the provided parameters.

  • variant: The style variant of the button.
  • zetaColors: Colors configuration for the application/theme.
  • textTheme: The text theme for the application/theme.
  • textPadding: Optional padding for the button's text content.
  • isDangerButton: Flag to determine if the button indicates a dangerous action.
  • isOnDarkBackground: Flag to determine if the button is on a dark background.
  • customColor: An optional color to override the default button color.

Implementation

static ButtonStyle getStyle({
  required ZdsButtonVariant variant,
  required ZetaColors zetaColors,
  required TextTheme textTheme,
  EdgeInsetsGeometry? textPadding,
  bool isDangerButton = false,
  bool isOnDarkBackground = false,
  Color? customColor,
}) {
  // Default text padding if none is provided.
  final EdgeInsetsGeometry tp = textPadding ?? const EdgeInsets.symmetric(horizontal: 16, vertical: 6);

  // Determine the default background color.
  final Color defaultBackground = customColor ?? (isDangerButton ? zetaColors.negative : zetaColors.secondary);

  // Common textStyle for all variants.
  final textStyle = MaterialStateProperty.all(textTheme.titleMedium?.copyWith(fontWeight: FontWeight.w500));

  // Helper function to calculate the overlay color.
  Color calculateOverlay({double opacity = 0.1, Color? background}) {
    return customColor?.withOpacity(opacity) ?? (background ?? defaultBackground).withOpacity(opacity);
  }

  switch (variant) {
    case ZdsButtonVariant.filled:
      return ButtonStyle(
        padding: MaterialStateProperty.all(tp),
        textStyle: textStyle,
        foregroundColor: materialStatePropertyResolver(
          defaultValue: defaultBackground.onColor,
          disabledValue: zetaColors.textDisabled,
        ),
        backgroundColor: materialStatePropertyResolver(
          defaultValue: defaultBackground,
          disabledValue: zetaColors.surfaceDisabled,
        ),
        overlayColor: materialStatePropertyResolver(
          hoveredValue: defaultBackground.darken(5), // Slight darkening for hover
          pressedValue: defaultBackground.darken(15), // More noticeable darkening for pressed state
          defaultValue: Colors.transparent,
        ),
        side: materialStatePropertyResolver(
          focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3),
          disabledValue: BorderSide(color: zetaColors.borderDisabled),
        ),
      );
    case ZdsButtonVariant.outlined:
      return ButtonStyle(
        padding: MaterialStateProperty.all(tp),
        textStyle: textStyle,
        foregroundColor: materialStatePropertyResolver(
          defaultValue: defaultBackground,
          disabledValue: zetaColors.textDisabled,
        ),
        backgroundColor: materialStatePropertyResolver(
          defaultValue: Colors.transparent,
          disabledValue: zetaColors.surfaceDisabled,
        ),
        overlayColor: materialStatePropertyResolver(
          defaultValue: Colors.transparent,
          hoveredValue: calculateOverlay(),
          pressedValue: calculateOverlay(opacity: 0.2),
        ),
        side: materialStatePropertyResolver(
          focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3),
          defaultValue: BorderSide(color: defaultBackground),
          disabledValue: BorderSide(color: zetaColors.borderDisabled),
        ),
      );
    case ZdsButtonVariant.text:
      return ButtonStyle(
        padding: MaterialStateProperty.all(tp),
        textStyle: textStyle,
        foregroundColor: materialStatePropertyResolver(
          defaultValue: isOnDarkBackground ? zetaColors.textInverse : defaultBackground,
          disabledValue: zetaColors.textDisabled,
        ),
        backgroundColor: materialStatePropertyResolver(
          defaultValue: Colors.transparent,
        ),
        overlayColor: materialStatePropertyResolver(
          defaultValue: Colors.transparent,
          hoveredValue: calculateOverlay(),
          pressedValue: calculateOverlay(opacity: 0.2),
        ),
        side: materialStatePropertyResolver(
          focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3),
          disabledValue: const BorderSide(color: Colors.transparent),
        ),
      );
    case ZdsButtonVariant.muted:
      return ButtonStyle(
        padding: MaterialStateProperty.all(tp),
        textStyle: textStyle,
        foregroundColor: materialStatePropertyResolver(
          defaultValue: zetaColors.textDefault,
          disabledValue: zetaColors.textDisabled,
        ),
        backgroundColor: materialStatePropertyResolver(
          defaultValue: Colors.transparent,
          disabledValue: zetaColors.surfaceDisabled,
        ),
        overlayColor: materialStatePropertyResolver(
          defaultValue: Colors.transparent,
          hoveredValue: calculateOverlay(background: zetaColors.borderDefault),
          pressedValue: calculateOverlay(background: zetaColors.borderDefault, opacity: 0.2),
        ),
        side: materialStatePropertyResolver(
          focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3),
          disabledValue: BorderSide(color: zetaColors.borderDisabled),
          defaultValue: BorderSide(color: zetaColors.borderDefault),
        ),
      );
  }
}