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
andonPrimary
. 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