Saltar al contenido principal

La propiedad toggleableActiveColor de ThemeData ha sido desaprobada

Los widgets de Material que usan la propiedad toggleableActiveColor se migran para usar ColorScheme de Material.

Resumen

#

Los widgets de Material Switch, SwitchListTile, Checkbox, CheckboxListTile, Radio, y RadioListTile ahora usan el color ColorScheme.secondary para sus widgets interactivos. ThemeData.toggleableActiveColor está deprecada y eventualmente será eliminada.

Contexto

#

La migración de los widgets que dependen de ThemeData.toggleableActiveColor a ColorScheme.secondary hizo que la propiedad toggleableActiveColor fuera innecesaria. Esta propiedad eventualmente será eliminada, de acuerdo con la política de deprecación de Flutter.

Descripción del cambio

#

Los widgets que usan el color ThemeData.toggleableActiveColor para el estado activo/seleccionado ahora usan ColorScheme.secondary.

Guía de migración

#

El color activo/seleccionado de los widgets interactivos (toggleable) generalmente se puede personalizar de 3 formas:

  1. Usando ColorScheme.secondary de ThemeData.
  2. Usando los temas de componentes SwitchThemeData, ListTileThemeData, CheckboxThemeData, y RadioThemeData.
  3. Personalizando las propiedades de color del widget.

Código antes de la migración:

dart
MaterialApp(
  theme: ThemeData(toggleableActiveColor: myColor),
  // ...
);

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

dart
final ThemeData theme = ThemeData();
MaterialApp(
  theme: theme.copyWith(
    switchTheme: SwitchThemeData(
      thumbColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
      trackColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
    ),
    radioTheme: RadioThemeData(
      fillColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
    ),
    checkboxTheme: CheckboxThemeData(
      fillColor: MaterialStateProperty.resolveWith<Color?>(
          (Set<MaterialState> states) {
        if (states.contains(MaterialState.disabled)) {
          return null;
        }
        if (states.contains(MaterialState.selected)) {
          return myColor;
        }
        return null;
      }),
    ),
  ),
  //...
)

Timeline

#

En versión estable: 3.7

Referencias

#

Documentación de la API:

Issues relevantes:

PRs relevantes: