Introducir nuevos roles de ColorScheme para Material 3

Los nuevos roles de color en ColorScheme incluyen siete superficies y contenedores basados en tonos, y doce colores de acento para los grupos primary, secondary y tertiary. Esta actualización marca como obsoletos tres roles de color existentes: background, onBackground y surfaceVariant. El ColorScheme construido por el método ColorScheme.fromSeed actualizado ahora genera valores diferentes en comparación con la versión anterior, adaptándose a las directrices de Material Design 3.

Los colores de superficie basados en tonos incluyen:

• surfaceBright
• surfaceDim
• surfaceContainer
• surfaceContainerLow
• surfaceContainerLowest
• surfaceContainerHigh
• surfaceContainerHighest

Estos cambios ayudan a eliminar el uso de surfaceTintColor de los widgets y reemplazan el antiguo modelo basado en opacidad que aplicaba una superposición tintada sobre las superficies en función de su elevación.

El surfaceTintColor predeterminado para todos los widgets ahora es null y su color de fondo predeterminado ahora se basa en los nuevos colores de superficie basados en tonos.

ColorScheme.fromSeed también se ha actualizado para utilizar el último algoritmo del paquete Material color utilities. Este cambio evita que el ColorScheme construido sea demasiado brillante, incluso si el color de origen parece brillante y tenía una alta saturación (contiene poco negro, blanco y tonos de gris).

Las diferencias causadas por el ColorScheme.fromSeed actualizado y los nuevos roles de color deberían ser pequeñas y aceptables. Sin embargo, al proporcionar un color semilla más brillante a ColorScheme.fromSeed, podría construir una versión de ColorScheme relativamente más oscura. Para forzar que el resultado siga siendo brillante, establece dynamicSchemeVariant: DynamicSchemeVariant.fidelity en ColorScheme.fromSeed. Por ejemplo:

Código antes de la migración:

ColorScheme.fromSeed(
    seedColor: Color(0xFF0000FF), // Bright blue
)

Código después de la migración:

ColorScheme.fromSeed(
    seedColor: Color(0xFF0000FF), // Bright blue
    dynamicSchemeVariant: DynamicSchemeVariant.fidelity,
)

Material Design 3 elimina 3 colores.

Para configurar la apariencia de los componentes de material, background debe reemplazarse por surface, onBackground debe reemplazarse por onSurface y surfaceVariant debe migrarse a surfaceContainerHighest.

Código antes de la migración:

final ColorScheme colorScheme = ColorScheme();
MaterialApp(
  theme: ThemeData(
    //...
    colorScheme: colorScheme.copyWith(
      background: myColor1,
      onBackground: myColor2,
      surfaceVariant: myColor3,
    ),
  ),
  //...
)

Código después de la migración:

final ColorScheme colorScheme = ColorScheme();
MaterialApp(
  theme: ThemeData(
    //...
    colorScheme: colorScheme.copyWith(
      surface: myColor1,
      onSurface: myColor2,
      surfaceContainerHighest: myColor3,
    ),
  ),
  //...
)

Los componentes personalizados que solían consultar ColorScheme.background, ColorScheme.onBackground y ColorScheme.surfaceVariant ahora pueden consultar en su lugar ColorScheme.surface, ColorScheme.onSurface y ColorScheme.surfaceContainerHighest.

Código antes de la migración:

Color myColor1 = Theme.of(context).colorScheme.background;
Color myColor2 = Theme.of(context).colorScheme.onBackground;
Color myColor3 = Theme.of(context).colorScheme.surfaceVariant;

Código después de la migración:

Color myColor1 = Theme.of(context).colorScheme.surface;
Color myColor2 = Theme.of(context).colorScheme.onSurface;
Color myColor3 = Theme.of(context).colorScheme.surfaceContainerHighest;

Introducido en la versión: 3.21.0-4.0.pre
En la versión estable: 3.22.0

Issues relevantes:

• Soporte para roles de ColorScheme de contenedor de superficie y superficie basados en tonos
• Soporte para variante de fidelidad para ColorScheme.fromSeed

PRs relevantes:

• Introduce superficies basadas en tonos y complementos de color de acento - Parte 1
• Introduce superficies basadas en tonos y complementos de color de acento - Parte 2
• Mejorar ColorScheme.fromSeed con un nuevo parámetro variant