FlexKeyColors class

Immutable data class that configures if and how FlexColorScheme uses key colors to populate the Material-3 ColorScheme it creates and uses to generate its ThemeData object.

For more information on Material-3 color system and usage of key colors to generate tonal palettes and tones, see: https://m3.material.io/styles/color/the-color-system/key-colors-tones

When using FlexColorScheme a seed generated ColorScheme will be made if a FlexKeyColors instance is passed to FlexColorScheme.light or FlexColorScheme.dark parameter keyColorSetup with useKeyColors set to true, in its FlexKeyColors configuration input.

By default keyColors is null and key colors are not used. To activate the feature pass you can in a default FlexKeyColors instance, its useKeyColors defaults to true.

The default constructor creates a setup that creates a seeded generated ColorScheme for the active FlexColorScheme using its current primary color as key in a ColorScheme.fromSeed equivalent. If the default ColorScheme.fromSeed result is suitable, no further configuration is required. You can however further customize its behavior by adjusting the properties/ in FlexKeyColors.

Flutter standard ColorScheme only offers color scheme creation from one single input color using ColorScheme.fromSeed. With FlexColorScheme you can use its effective color value for primary, secondary, tertiary and error colors to generate the seeded TonalPalette for primary, secondary, tertiary and error colors in the ColorScheme, by using wn key seed input colors for them. To do so also set properties useSecondary and useTertiary to true. You will then get tonal palette's for secondary and tertiary colors that depend on these key colors and not on only the primary color.

If you use factory FlexColorScheme.light and FlexColorScheme.scheme, to use a built-in color scheme set, then the primary, secondary and tertiary colors for the associated FlexScheme enum will be used as key colors for those color categories in the resulting ColorScheme.

When using FlexColorScheme.dark and FlexColorScheme.scheme, the same colors from the light theme color definitions will be used as key color inputs to generate the tonal palettes for dark mode ColorScheme. This is because the light and dark theme mode colors should use the same TonalPalette, and only use different in M3 guide standardized tones from the same TonalPalette. Hence, the same base color is used to generate the tonal palette for both light and dark theme to adhere to this design principle.

If you use FlexColorScheme.colors in the factories light and dark, or direct color property inputs, or a custom FlexColorScheme.colorScheme as input, and combine them with key color usage via the useKeyColors flag, then it is possible to use different key color inputs for light and dark mode, as the provided effective colors are used as direct inputs to the seeding.

It is then up to you, the designer to create harmonious designs. If you want to get the Material-3 intended design when using custom FlexColorScheme based key color inputs, then use the same key color values as input for primary, secondary and tertiary colors for both dark and light mode FlexColorScheme based themes, when making themes with useKeyColors enabled. Typically this means providing the same color values for keyPrimary, keySecondary and keyTertiary in both light and dark mode FlexColorScheme instances when passing in a FlexKeyColors instance.

The neutral tonal palette and its variant are used as inputs to ColorScheme colors in the same way as in ColorScheme.fromSeed and are produced with a slight hint of primary key color in them using same algorithm as ColorScheme.fromSeed too. This color branding is a bit equivalent to using primary color alpha surface color blends, or so called primary color branding in FlexColorScheme. The surface mode and blend levels can even be combined with Material-3 based seed generated color schemes, for a bit different and stronger effects from key color generated themes too.

To completely customize how the tonal palettes for the seed generated ColorScheme are produced from key colors, and which tones from the generated tonal palettes are used by which color in the ColorScheme, please see FlexTones. With FlexTones you can completely customize the tonal palette generation and tone usage in produced ColorScheme.

Mixed-in types
Annotations

Constructors

FlexKeyColors({bool useKeyColors = true, Color? keyPrimary, bool keepPrimary = false, bool keepPrimaryContainer = false, Color? keySecondary, bool useSecondary = false, bool keepSecondary = false, bool keepSecondaryContainer = false, Color? keyTertiary, bool useTertiary = false, bool keepTertiary = false, bool keepTertiaryContainer = false, Color? keyError, bool useError = false, bool keepError = false, bool keepErrorContainer = false, double contrastLevel = 0.0, bool? useExpressiveOnContainerColors, bool? useLegacyMonochromeSeedBehavior})
Used to configure how key colors are used when generating a key color seeded ColorScheme for FlexColorScheme,
const

Properties

contrastLevel double
The contrastLevel parameter indicates the contrast level between color pairs, such as primary and onPrimary. The value 0.0 is the default (normal) contrast; -1.0 is the lowest; 1.0 is the highest. From Material Design guideline, the normal, medium and high contrast options correspond to 0.0, 0.5 and 1.0 respectively.
final
hashCode int
Override for hashcode, dart.ui Jenkins based.
no setteroverride
keepError bool
Lock error color to key color.
final
keepErrorContainer bool
Lock error container color to key color.
final
keepPrimary bool
Lock primary color to key color.
final
keepPrimaryContainer bool
Lock primary container color to key color.
final
keepSecondary bool
Lock secondary color to key color.
final
keepSecondaryContainer bool
Lock secondary container color to key color.
final
keepTertiary bool
Lock tertiary color to key color.
final
keepTertiaryContainer bool
Lock tertiary container color to key color.
final
keyError Color?
The key color to use as color for the seed generated error tonal palette in the seed generated ColorScheme.
final
keyPrimary Color?
The key color to use as color for the seed generated primary tonal palette and potentially entire ColorScheme if other key colors are not used.
final
keySecondary Color?
The key color to use as color for the seed generated secondary tonal palette in the seed generated ColorScheme.
final
keyTertiary Color?
The key color to use as color for the seed generated tertiary tonal palette in the seed generated ColorScheme.
final
runtimeType Type
A representation of the runtime type of the object.
no setterinherited
useError bool
Enable using own key color for the error tonal palette in the seed generated ColorScheme.
final
useExpressiveOnContainerColors bool?
Use expressive on container colors for light mode.
final
useKeyColors bool
Use a seed generated ColorScheme based on key colors.
final
useLegacyMonochromeSeedBehavior bool?
Set this to true to use the legacy behavior for monochrome seed colors.
final
useSecondary bool
Enable using own key color for the secondary tonal palette in the seed generated ColorScheme.
final
useTertiary bool
Enable using own key color for the tertiary tonal palette in the seed generated ColorScheme.
final

Methods

copyWith({bool? useKeyColors, Color? keyPrimary, bool? keepPrimary, bool? keepPrimaryContainer, Color? keySecondary, bool? useSecondary, bool? keepSecondary, bool? keepSecondaryContainer, Color? keyTertiary, bool? useTertiary, bool? keepTertiary, bool? keepTertiaryContainer, Color? keyError, bool? useError, bool? keepError, bool? keepErrorContainer, double? contrastLevel, bool? useExpressiveOnContainerColors, bool? useLegacyMonochromeSeedBehavior}) FlexKeyColors
Copy the object with one or more provided properties changed.
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Flutter debug properties override, includes toString.
override
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) String
A string representation of this object.
inherited
toStringShort() String
A brief description of this object, usually just the runtimeType and the hashCode.
inherited

Operators

operator ==(Object other) bool
Override the equality operator.
override