toScheme property

ColorScheme toScheme

Returns the effective ColorScheme defined by your FlexColorScheme.

After you have defined your Flex scheme with FlexColorScheme or one of its recommended factories FlexColorScheme.light, FlexColorScheme.dark, you can use the toScheme method to get the effective standard Flutter ColorScheme object defined by your FlexColorScheme definition.

While you can use use this returned color scheme in a standard ThemeData.from color scheme based theme factory to create a theme from FlexColorScheme, this is NOT the recommended way to make a fully FlexColorScheme based theme. Normally you want to use FlexColorScheme.toTheme to make your ThemeData when using FlexColorScheme. The FlexColorScheme.toTheme method uses FlexColorScheme.toScheme internally when it creates its ThemeData object as well. It does however also apply a number of additional theme properties, that you loose if you extract the ColorScheme with toScheme and use it in a ThemeData.from from factory.

The main usage of this method is to get the effective resulting ColorScheme from FlexColorScheme and use it when making sub-themes that need access to the resulting color definitions, so you can use them in custom sub-themes in order to use the same color scheme for their definitions.

If you use ThemeData.from and the ColorScheme returned by FlexColorScheme.toScheme to create your theme, this will work and result in a theme that is based on the color scheme defined in FlexColorScheme, including the surface and background color branding, and e.g. true black for dark mode, if those were used in its creation via the light and dark factories. The big difference will be that Flutter's ThemeData.from theme creation from this scheme will not include any of the theme improvements included in the FlexColorScheme.toTheme method. The AppBar theme options will also not be available and scaffoldBackground will be equal to background, which might not be the design you intended.

The sub-theming is of course also not available, unless you apply them all with copyWith to the produced ThemeData.

Implementation

ColorScheme get toScheme {
  // Get effective scheme brightness. Passed in as a property value, or from
  // passed in colorScheme, if neither given, light is default fallback.
  final Brightness usedBrightness =
      brightness ?? colorScheme?.brightness ?? Brightness.light;
  final bool isDark = usedBrightness == Brightness.dark;
  // Get effective primary color. Passed in a as property, if not, then maybe
  // from colorScheme, if neither given, fallback color is light or dark mode
  // Material 2 guide default light and dark primary color.
  final Color usedPrimary = primary ??
      colorScheme?.primary ??
      (isDark
          ? FlexColor.materialDarkPrimary
          : FlexColor.materialLightPrimary);

  // Get default fallback error color.
  final Color errorFallback =
      isDark ? FlexColor.materialDarkError : FlexColor.materialLightError;
  final Color errorContainerFallback = isDark
      ? FlexColor.darkErrorContainer(FlexColor.materialDarkError)
      : FlexColor.lightErrorContainer(FlexColor.materialLightError);

  // Determine effective primary, secondary and tertiary colors, depending
  // on passed in properties as highest priority, then colorScheme values.
  // Containers fall back via none container values, tertiary via secondary.
  // All falls back to primary, if nothing else is available before that.
  final FlexSchemeColor colors = FlexSchemeColor.from(
    primary: usedPrimary,
    primaryContainer:
        primaryContainer ?? colorScheme?.primaryContainer ?? usedPrimary,
    secondary: secondary ?? colorScheme?.secondary ?? usedPrimary,
    secondaryContainer: secondaryContainer ??
        colorScheme?.secondaryContainer ??
        secondary ??
        colorScheme?.secondary ??
        usedPrimary,
    tertiary: tertiary ??
        colorScheme?.tertiary ??
        secondary ??
        colorScheme?.secondary ??
        usedPrimary,
    tertiaryContainer: tertiaryContainer ??
        colorScheme?.tertiaryContainer ??
        tertiary ??
        colorScheme?.tertiary ??
        secondary ??
        colorScheme?.secondary ??
        usedPrimary,
    error: error ?? colorScheme?.error ?? errorFallback,
    errorContainer: colorScheme?.errorContainer ?? errorContainerFallback,
  );
  // Determine effective surface surface and background.
  final Color effectiveSurfaceColor = surface ??
      colorScheme?.surface ??
      (isDark
          ? FlexColor.materialDarkSurface
          : FlexColor.materialLightSurface);
  final Color effectiveSurfaceVariantColor = colorScheme?.surfaceVariant ??
      (isDark ? FlexColor.darkSurfaceVariant : FlexColor.lightSurfaceVariant);

  final Color effectiveInverseSurfaceColor = colorScheme?.inverseSurface ??
      (isDark
          ? FlexColor.materialLightSurface
          : FlexColor.materialDarkSurface);

  final Color effectiveBackgroundColor = background ??
      colorScheme?.background ??
      (isDark
          ? FlexColor.materialDarkBackground
          : FlexColor.materialLightBackground);

  // Check brightness of primary, secondary, error, surface and background
  // colors, and returns appropriate computed colors for their onColors if an
  // onColor for it was was not passed in, or no colorScheme with them were
  // passed in. If they were, the passed in direct values have highest
  // priority, then the values in a given colorScheme, and lastly a value
  // computed from its main color pair is used.
  final FlexSchemeOnColors onColors = FlexSchemeOnColors.from(
    primary: colors.primary,
    primaryContainer: colors.primaryContainer,
    secondary: colors.secondary,
    secondaryContainer: colors.secondaryContainer,
    tertiary: colors.tertiary,
    tertiaryContainer: colors.tertiaryContainer,
    surface: effectiveSurfaceColor,
    surfaceVariant: effectiveSurfaceVariantColor,
    inverseSurface: effectiveInverseSurfaceColor,
    background: effectiveBackgroundColor,
    error: colors.error ?? errorFallback,
    errorContainer: colors.errorContainer ?? errorContainerFallback,
    onPrimary: onPrimary ?? colorScheme?.onPrimary,
    onPrimaryContainer: onPrimaryContainer ?? colorScheme?.onPrimaryContainer,
    onSecondary: onSecondary ?? colorScheme?.onSecondary,
    onSecondaryContainer:
        onSecondaryContainer ?? colorScheme?.onSecondaryContainer,
    onTertiary: onTertiary ?? colorScheme?.onTertiary,
    onTertiaryContainer:
        onTertiaryContainer ?? colorScheme?.onTertiaryContainer,
    onSurface: onSurface ?? colorScheme?.onSurface,
    onSurfaceVariant: colorScheme?.onSurfaceVariant,
    onInverseSurface: colorScheme?.onInverseSurface,
    onBackground: onBackground ?? colorScheme?.onBackground,
    onError: onError ?? colorScheme?.onError,
    onErrorContainer: colorScheme?.onErrorContainer,
  );
  // Return the ColorScheme as a copyWith on original passed in colorScheme
  // if one was passed in, with all the effective properties overriding its
  // corresponding properties. This will keep color properties not included in
  // FlexColorScheme as direct properties as they were in any given
  // colorScheme, in the returned ColorScheme as well.
  // If there was no colorScheme passed in, we create one with the effective
  // override properties, plus FlexColorScheme ColorScheme defaults.
  //
  // The factories FlexColorScheme.light and FlexColorScheme.dark have their
  // own logic for making the ColorScheme and set a colorScheme as well as
  // all override properties to define their target ColorScheme when the
  // toScheme methods is called.
  //
  // The toScheme method is used internally by the toTheme method to get
  // the effective ColorScheme for the the defined FlexColorScheme instance.
  return colorScheme?.copyWith(
        brightness: usedBrightness,
        primary: colors.primary,
        onPrimary: onColors.onPrimary,
        primaryContainer: colors.primaryContainer,
        onPrimaryContainer: onColors.onPrimaryContainer,
        secondary: colors.secondary,
        onSecondary: onColors.onSecondary,
        secondaryContainer: colors.secondaryContainer,
        onSecondaryContainer: onColors.onSecondaryContainer,
        tertiary: colors.tertiary,
        onTertiary: onColors.onTertiary,
        tertiaryContainer: colors.tertiaryContainer,
        onTertiaryContainer: onColors.onTertiaryContainer,
        error: colors.error ?? errorFallback,
        onError: onColors.onError,
        errorContainer: colors.errorContainer ?? errorContainerFallback,
        onErrorContainer: onColors.onErrorContainer,
        background: effectiveBackgroundColor,
        onBackground: onColors.onBackground,
        surface: effectiveSurfaceColor,
        onSurface: onColors.onSurface,
        surfaceVariant: effectiveSurfaceVariantColor,
        onSurfaceVariant: onColors.onSurfaceVariant,
        outline: colorScheme?.outline,
        outlineVariant: colorScheme?.outlineVariant,
        shadow: colorScheme?.shadow,
        scrim: colorScheme?.scrim,
        inverseSurface: effectiveInverseSurfaceColor,
        onInverseSurface: onColors.onInverseSurface,
        inversePrimary: colorScheme?.inversePrimary,
        surfaceTint:
            surfaceTint ?? colorScheme?.surfaceTint ?? colors.primary,
      ) ??
      // No passed in ColorScheme, we create one with the effective
      // override properties, plus FlexColorScheme ColorScheme defaults.
      ColorScheme(
        brightness: usedBrightness,
        primary: usedPrimary,
        onPrimary: onColors.onPrimary,
        primaryContainer: colors.primaryContainer,
        onPrimaryContainer: onColors.onPrimaryContainer,
        secondary: colors.secondary,
        onSecondary: onColors.onSecondary,
        secondaryContainer: colors.secondaryContainer,
        onSecondaryContainer: onColors.onSecondaryContainer,
        tertiary: colors.tertiary,
        onTertiary: onColors.onTertiary,
        tertiaryContainer: colors.tertiaryContainer,
        onTertiaryContainer: onColors.onTertiaryContainer,
        error: colors.error ?? errorFallback,
        onError: onColors.onError,
        errorContainer: colors.errorContainer ?? errorContainerFallback,
        onErrorContainer: onColors.onErrorContainer,
        background: effectiveBackgroundColor,
        onBackground: onColors.onBackground,
        surface: effectiveSurfaceColor,
        onSurface: onColors.onSurface,
        surfaceVariant: effectiveSurfaceVariantColor,
        onSurfaceVariant: onColors.onSurfaceVariant,
        outline: _outlineColor(usedBrightness, onColors.onBackground, 45),
        outlineVariant:
            _outlineColor(usedBrightness, onColors.onBackground, 75),
        shadow: Colors.black,
        scrim: Colors.black,
        inverseSurface: effectiveInverseSurfaceColor,
        onInverseSurface: onColors.onInverseSurface,
        inversePrimary: _inversePrimary(
            usedBrightness, colors.primary, effectiveSurfaceColor),
        surfaceTint: surfaceTint ?? usedPrimary,
      );
}