mirror of
https://github.com/flutter/flutter
synced 2024-10-30 01:59:05 +00:00
implement
This commit is contained in:
parent
a6b2e54ca2
commit
6b6172a827
2 changed files with 128 additions and 0 deletions
|
@ -239,6 +239,65 @@ class ColorScheme with Diagnosticable {
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/// Create a [ColorScheme] from the given `palette`.
|
||||||
|
///
|
||||||
|
/// Use this constructor to create a [ColorScheme] from the dynamic colors
|
||||||
|
/// obtained from the Android OS. See the [dynamic_color](https://pub.dev/packages/dynamic_color)
|
||||||
|
/// package for more information.
|
||||||
|
///
|
||||||
|
/// See also:
|
||||||
|
///
|
||||||
|
/// * <https://pub.dev/packages/dynamic_color>, the package used
|
||||||
|
/// to obtain dynamic colors from the Android OS.
|
||||||
|
/// * <https://m3.material.io/styles/color/the-color-system/color-roles>, the
|
||||||
|
/// Material 3 Color system specification.
|
||||||
|
/// * <https://pub.dev/packages/material_color_utilities>, the package
|
||||||
|
/// used to convert a `CorePalette` to a [ColorScheme].
|
||||||
|
factory ColorScheme.fromCorePalette({
|
||||||
|
required CorePalette palette,
|
||||||
|
Brightness brightness = Brightness.light,
|
||||||
|
}) {
|
||||||
|
final Scheme scheme;
|
||||||
|
switch (brightness) {
|
||||||
|
case Brightness.light:
|
||||||
|
scheme = Scheme.lightFromCorePalette(palette);
|
||||||
|
break;
|
||||||
|
case Brightness.dark:
|
||||||
|
scheme = Scheme.darkFromCorePalette(palette);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return ColorScheme(
|
||||||
|
primary: Color(scheme.primary),
|
||||||
|
onPrimary: Color(scheme.onPrimary),
|
||||||
|
primaryContainer: Color(scheme.primaryContainer),
|
||||||
|
onPrimaryContainer: Color(scheme.onPrimaryContainer),
|
||||||
|
secondary: Color(scheme.secondary),
|
||||||
|
onSecondary: Color(scheme.onSecondary),
|
||||||
|
secondaryContainer: Color(scheme.secondaryContainer),
|
||||||
|
onSecondaryContainer: Color(scheme.onSecondaryContainer),
|
||||||
|
tertiary: Color(scheme.tertiary),
|
||||||
|
onTertiary: Color(scheme.onTertiary),
|
||||||
|
tertiaryContainer: Color(scheme.tertiaryContainer),
|
||||||
|
onTertiaryContainer: Color(scheme.onTertiaryContainer),
|
||||||
|
error: Color(scheme.error),
|
||||||
|
onError: Color(scheme.onError),
|
||||||
|
errorContainer: Color(scheme.errorContainer),
|
||||||
|
onErrorContainer: Color(scheme.onErrorContainer),
|
||||||
|
outline: Color(scheme.outline),
|
||||||
|
background: Color(scheme.background),
|
||||||
|
onBackground: Color(scheme.onBackground),
|
||||||
|
surface: Color(scheme.surface),
|
||||||
|
onSurface: Color(scheme.onSurface),
|
||||||
|
surfaceVariant: Color(scheme.surfaceVariant),
|
||||||
|
onSurfaceVariant: Color(scheme.onSurfaceVariant),
|
||||||
|
inverseSurface: Color(scheme.inverseSurface),
|
||||||
|
onInverseSurface: Color(scheme.inverseOnSurface),
|
||||||
|
inversePrimary: Color(scheme.inversePrimary),
|
||||||
|
shadow: Color(scheme.shadow),
|
||||||
|
brightness: brightness,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
/// Create a ColorScheme based on a purple primary color that matches the
|
/// Create a ColorScheme based on a purple primary color that matches the
|
||||||
/// [baseline Material color scheme](https://material.io/design/color/the-color-system.html#color-theme-creation).
|
/// [baseline Material color scheme](https://material.io/design/color/the-color-system.html#color-theme-creation).
|
||||||
const ColorScheme.light({
|
const ColorScheme.light({
|
||||||
|
|
|
@ -4,6 +4,7 @@
|
||||||
|
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:flutter_test/flutter_test.dart';
|
import 'package:flutter_test/flutter_test.dart';
|
||||||
|
import 'package:material_color_utilities/material_color_utilities.dart';
|
||||||
|
|
||||||
void main() {
|
void main() {
|
||||||
test('light scheme matches the spec', () {
|
test('light scheme matches the spec', () {
|
||||||
|
@ -296,4 +297,72 @@ void main() {
|
||||||
},
|
},
|
||||||
skip: isBrowser, // https://github.com/flutter/flutter/issues/44115
|
skip: isBrowser, // https://github.com/flutter/flutter/issues/44115
|
||||||
);
|
);
|
||||||
|
|
||||||
|
test('can generate a light scheme from a CorePalette', () {
|
||||||
|
final List<int> ints = List<int>.generate(CorePalette.size * TonalPalette.commonSize, (int i) => i);
|
||||||
|
final CorePalette corePalette = CorePalette.fromList(ints);
|
||||||
|
final ColorScheme scheme = ColorScheme.fromCorePalette(palette: corePalette);
|
||||||
|
expect(scheme.primary, const Color(0x00000004));
|
||||||
|
expect(scheme.onPrimary, const Color(0x0000000c));
|
||||||
|
expect(scheme.primaryContainer, const Color(0x00000009));
|
||||||
|
expect(scheme.onPrimaryContainer, const Color(0x00000001));
|
||||||
|
expect(scheme.secondary, const Color(0x00000011));
|
||||||
|
expect(scheme.onSecondary, const Color(0x00000019));
|
||||||
|
expect(scheme.secondaryContainer, const Color(0x00000016));
|
||||||
|
expect(scheme.onSecondaryContainer, const Color(0x0000000e));
|
||||||
|
expect(scheme.tertiary, const Color(0x0000001e));
|
||||||
|
expect(scheme.onTertiary, const Color(0x00000026));
|
||||||
|
expect(scheme.tertiaryContainer, const Color(0x00000023));
|
||||||
|
expect(scheme.onTertiaryContainer, const Color(0x0000001b));
|
||||||
|
expect(scheme.error, const Color(0xffba1b1b));
|
||||||
|
expect(scheme.onError, const Color(0xffffffff));
|
||||||
|
expect(scheme.errorContainer, const Color(0xffffdad4));
|
||||||
|
expect(scheme.onErrorContainer, const Color(0xff410001));
|
||||||
|
expect(scheme.outline, const Color(0x00000039));
|
||||||
|
expect(scheme.background, const Color(0x00000032));
|
||||||
|
expect(scheme.onBackground, const Color(0x00000028));
|
||||||
|
expect(scheme.surface, const Color(0x00000032));
|
||||||
|
expect(scheme.onSurface, const Color(0x00000028));
|
||||||
|
expect(scheme.surfaceVariant, const Color(0x0000003d));
|
||||||
|
expect(scheme.onSurfaceVariant, const Color(0x00000037));
|
||||||
|
expect(scheme.inverseSurface, const Color(0x00000029));
|
||||||
|
expect(scheme.onInverseSurface, const Color(0x00000031));
|
||||||
|
expect(scheme.inversePrimary, const Color(0x00000008));
|
||||||
|
expect(scheme.shadow, const Color(0x00000027));
|
||||||
|
expect(scheme.brightness, Brightness.light);
|
||||||
|
});
|
||||||
|
|
||||||
|
test('can generate a dark scheme from a CorePalette', () {
|
||||||
|
final List<int> ints = List<int>.generate(CorePalette.size * TonalPalette.commonSize, (int i) => i);
|
||||||
|
final CorePalette corePalette = CorePalette.fromList(ints);
|
||||||
|
final ColorScheme scheme = ColorScheme.fromCorePalette(palette: corePalette, brightness: Brightness.dark);
|
||||||
|
expect(scheme.primary, const Color(0x00000008));
|
||||||
|
expect(scheme.onPrimary, const Color(0x00000002));
|
||||||
|
expect(scheme.primaryContainer, const Color(0x00000003));
|
||||||
|
expect(scheme.onPrimaryContainer, const Color(0x00000009));
|
||||||
|
expect(scheme.secondary, const Color(0x00000015));
|
||||||
|
expect(scheme.onSecondary, const Color(0x0000000f));
|
||||||
|
expect(scheme.secondaryContainer, const Color(0x00000010));
|
||||||
|
expect(scheme.onSecondaryContainer, const Color(0x00000016));
|
||||||
|
expect(scheme.tertiary, const Color(0x00000022));
|
||||||
|
expect(scheme.onTertiary, const Color(0x0000001c));
|
||||||
|
expect(scheme.tertiaryContainer, const Color(0x0000001d));
|
||||||
|
expect(scheme.onTertiaryContainer, const Color(0x00000023));
|
||||||
|
expect(scheme.error, const Color(0xffffb4a9));
|
||||||
|
expect(scheme.onError, const Color(0xff680003));
|
||||||
|
expect(scheme.errorContainer, const Color(0xff930006));
|
||||||
|
expect(scheme.onErrorContainer, const Color(0xffffb4a9));
|
||||||
|
expect(scheme.outline, const Color(0x0000003a));
|
||||||
|
expect(scheme.background, const Color(0x00000028));
|
||||||
|
expect(scheme.onBackground, const Color(0x00000030));
|
||||||
|
expect(scheme.surface, const Color(0x00000028));
|
||||||
|
expect(scheme.onSurface, const Color(0x00000030));
|
||||||
|
expect(scheme.surfaceVariant, const Color(0x00000037));
|
||||||
|
expect(scheme.onSurfaceVariant, const Color(0x0000003c));
|
||||||
|
expect(scheme.inverseSurface, const Color(0x00000030));
|
||||||
|
expect(scheme.onInverseSurface, const Color(0x00000029));
|
||||||
|
expect(scheme.inversePrimary, const Color(0x00000004));
|
||||||
|
expect(scheme.shadow, const Color(0x00000027));
|
||||||
|
expect(scheme.brightness, Brightness.dark);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue