ThemeData constructor

ThemeData({Brightness brightness, MaterialColor primarySwatch, Color primaryColor, Brightness primaryColorBrightness, Color primaryColorLight, Color primaryColorDark, Color accentColor, Brightness accentColorBrightness, Color canvasColor, Color scaffoldBackgroundColor, Color bottomAppBarColor, Color cardColor, Color dividerColor, Color highlightColor, Color splashColor, InteractiveInkFeatureFactory splashFactory, Color selectedRowColor, Color unselectedWidgetColor, Color disabledColor, Color buttonColor, ButtonThemeData buttonTheme, Color secondaryHeaderColor, Color textSelectionColor, Color cursorColor, Color textSelectionHandleColor, Color backgroundColor, Color dialogBackgroundColor, Color indicatorColor, Color hintColor, Color errorColor, Color toggleableActiveColor, String fontFamily, TextTheme textTheme, TextTheme primaryTextTheme, TextTheme accentTextTheme, InputDecorationTheme inputDecorationTheme, IconThemeData iconTheme, IconThemeData primaryIconTheme, IconThemeData accentIconTheme, SliderThemeData sliderTheme, TabBarTheme tabBarTheme, ChipThemeData chipTheme, TargetPlatform platform, MaterialTapTargetSize materialTapTargetSize, PageTransitionsTheme pageTransitionsTheme, ColorScheme colorScheme, DialogTheme dialogTheme, Typography typography })

Create a ThemeData given a set of preferred values.

Default values will be derived for arguments that are omitted.

The most useful values to give are, in order of importance:

  • The desired theme brightness.

  • The primary color palette (the primarySwatch), chosen from one of the swatches defined by the material design spec. This should be one of the maps from the Colors class that do not have "accent" in their name.

  • The accentColor, sometimes called the secondary color, and, if the accent color is specified, its brightness (accentColorBrightness), so that the right contrasting text color will be used over the accent color.

See material.google.com/style/color.html for more discussion on how to pick the right colors.

Implementation

factory ThemeData({
  Brightness brightness,
  MaterialColor primarySwatch,
  Color primaryColor,
  Brightness primaryColorBrightness,
  Color primaryColorLight,
  Color primaryColorDark,
  Color accentColor,
  Brightness accentColorBrightness,
  Color canvasColor,
  Color scaffoldBackgroundColor,
  Color bottomAppBarColor,
  Color cardColor,
  Color dividerColor,
  Color highlightColor,
  Color splashColor,
  InteractiveInkFeatureFactory splashFactory,
  Color selectedRowColor,
  Color unselectedWidgetColor,
  Color disabledColor,
  Color buttonColor,
  ButtonThemeData buttonTheme,
  Color secondaryHeaderColor,
  Color textSelectionColor,
  Color cursorColor,
  Color textSelectionHandleColor,
  Color backgroundColor,
  Color dialogBackgroundColor,
  Color indicatorColor,
  Color hintColor,
  Color errorColor,
  Color toggleableActiveColor,
  String fontFamily,
  TextTheme textTheme,
  TextTheme primaryTextTheme,
  TextTheme accentTextTheme,
  InputDecorationTheme inputDecorationTheme,
  IconThemeData iconTheme,
  IconThemeData primaryIconTheme,
  IconThemeData accentIconTheme,
  SliderThemeData sliderTheme,
  TabBarTheme tabBarTheme,
  ChipThemeData chipTheme,
  TargetPlatform platform,
  MaterialTapTargetSize materialTapTargetSize,
  PageTransitionsTheme pageTransitionsTheme,
  ColorScheme colorScheme,
  DialogTheme dialogTheme,
  Typography typography,
}) {
  brightness ??= Brightness.light;
  final bool isDark = brightness == Brightness.dark;
  primarySwatch ??= Colors.blue;
  primaryColor ??= isDark ? Colors.grey[900] : primarySwatch;
  primaryColorBrightness ??= estimateBrightnessForColor(primaryColor);
  primaryColorLight ??= isDark ? Colors.grey[500] : primarySwatch[100];
  primaryColorDark ??= isDark ? Colors.black : primarySwatch[700];
  final bool primaryIsDark = primaryColorBrightness == Brightness.dark;
  toggleableActiveColor ??= isDark ? Colors.tealAccent[200] : (accentColor ?? primarySwatch[600]);
  accentColor ??= isDark ? Colors.tealAccent[200] : primarySwatch[500];
  accentColorBrightness ??= estimateBrightnessForColor(accentColor);
  final bool accentIsDark = accentColorBrightness == Brightness.dark;
  canvasColor ??= isDark ? Colors.grey[850] : Colors.grey[50];
  scaffoldBackgroundColor ??= canvasColor;
  bottomAppBarColor ??= isDark ? Colors.grey[800] : Colors.white;
  cardColor ??= isDark ? Colors.grey[800] : Colors.white;
  dividerColor ??= isDark ? const Color(0x1FFFFFFF) : const Color(0x1F000000);

  // Create a ColorScheme that is backwards compatible as possible
  // with the existing default ThemeData color values.
  colorScheme ??= ColorScheme.fromSwatch(
    primarySwatch: primarySwatch,
    primaryColorDark: primaryColorDark,
    accentColor: accentColor,
    cardColor: cardColor,
    backgroundColor: backgroundColor,
    errorColor: errorColor,
    brightness: brightness,
  );

  splashFactory ??= InkSplash.splashFactory;
  selectedRowColor ??= Colors.grey[100];
  unselectedWidgetColor ??= isDark ? Colors.white70 : Colors.black54;
  // Spec doesn't specify a dark theme secondaryHeaderColor, this is a guess.
  secondaryHeaderColor ??= isDark ? Colors.grey[700] : primarySwatch[50];
  textSelectionColor ??= isDark ? accentColor : primarySwatch[200];
  // todo (sandrasandeep): change to color provided by Material Design team
  cursorColor = cursorColor ?? const Color.fromRGBO(66, 133, 244, 1.0);
  textSelectionHandleColor ??= isDark ? Colors.tealAccent[400] : primarySwatch[300];
  backgroundColor ??= isDark ? Colors.grey[700] : primarySwatch[200];
  dialogBackgroundColor ??= isDark ? Colors.grey[800] : Colors.white;
  indicatorColor ??= accentColor == primaryColor ? Colors.white : accentColor;
  hintColor ??= isDark ?  const Color(0x80FFFFFF) : const Color(0x8A000000);
  errorColor ??= Colors.red[700];
  inputDecorationTheme ??= const InputDecorationTheme();
  pageTransitionsTheme ??= const PageTransitionsTheme();
  primaryIconTheme ??= primaryIsDark ? const IconThemeData(color: Colors.white) : const IconThemeData(color: Colors.black);
  accentIconTheme ??= accentIsDark ? const IconThemeData(color: Colors.white) : const IconThemeData(color: Colors.black);
  iconTheme ??= isDark ? const IconThemeData(color: Colors.white) : const IconThemeData(color: Colors.black87);
  platform ??= defaultTargetPlatform;
  typography ??= Typography(platform: platform);
  final TextTheme defaultTextTheme = isDark ? typography.white : typography.black;
  textTheme = defaultTextTheme.merge(textTheme);
  final TextTheme defaultPrimaryTextTheme = primaryIsDark ? typography.white : typography.black;
  primaryTextTheme = defaultPrimaryTextTheme.merge(primaryTextTheme);
  final TextTheme defaultAccentTextTheme = accentIsDark ? typography.white : typography.black;
  accentTextTheme = defaultAccentTextTheme.merge(accentTextTheme);
  materialTapTargetSize ??= MaterialTapTargetSize.padded;
  if (fontFamily != null) {
    textTheme = textTheme.apply(fontFamily: fontFamily);
    primaryTextTheme = primaryTextTheme.apply(fontFamily: fontFamily);
    accentTextTheme = accentTextTheme.apply(fontFamily: fontFamily);
  }

  // Used as the default color (fill color) for RaisedButtons. Computing the
  // default for ButtonThemeData for the sake of backwards compatibility.
  buttonColor ??= isDark ? primarySwatch[600] : Colors.grey[300];
  buttonTheme ??= ButtonThemeData(
    colorScheme: colorScheme,
    buttonColor: buttonColor,
    disabledColor: disabledColor,
    highlightColor: highlightColor,
    splashColor: splashColor,
    materialTapTargetSize: materialTapTargetSize,
  );
  disabledColor ??= isDark ? Colors.white30 : Colors.black38;
  highlightColor ??= isDark ? _kDarkThemeHighlightColor : _kLightThemeHighlightColor;
  splashColor ??= isDark ? _kDarkThemeSplashColor : _kLightThemeSplashColor;

  sliderTheme ??= SliderThemeData.fromPrimaryColors(
    primaryColor: primaryColor,
    primaryColorLight: primaryColorLight,
    primaryColorDark: primaryColorDark,
    valueIndicatorTextStyle: accentTextTheme.body2,
  );
  tabBarTheme ??= const TabBarTheme();
  chipTheme ??= ChipThemeData.fromDefaults(
    secondaryColor: primaryColor,
    brightness: brightness,
    labelStyle: textTheme.body2,
  );
  dialogTheme ??= const DialogTheme();

  return ThemeData.raw(
    brightness: brightness,
    primaryColor: primaryColor,
    primaryColorBrightness: primaryColorBrightness,
    primaryColorLight: primaryColorLight,
    primaryColorDark: primaryColorDark,
    accentColor: accentColor,
    accentColorBrightness: accentColorBrightness,
    canvasColor: canvasColor,
    scaffoldBackgroundColor: scaffoldBackgroundColor,
    bottomAppBarColor: bottomAppBarColor,
    cardColor: cardColor,
    dividerColor: dividerColor,
    highlightColor: highlightColor,
    splashColor: splashColor,
    splashFactory: splashFactory,
    selectedRowColor: selectedRowColor,
    unselectedWidgetColor: unselectedWidgetColor,
    disabledColor: disabledColor,
    buttonTheme: buttonTheme,
    buttonColor: buttonColor,
    toggleableActiveColor: toggleableActiveColor,
    secondaryHeaderColor: secondaryHeaderColor,
    textSelectionColor: textSelectionColor,
    cursorColor: cursorColor,
    textSelectionHandleColor: textSelectionHandleColor,
    backgroundColor: backgroundColor,
    dialogBackgroundColor: dialogBackgroundColor,
    indicatorColor: indicatorColor,
    hintColor: hintColor,
    errorColor: errorColor,
    textTheme: textTheme,
    primaryTextTheme: primaryTextTheme,
    accentTextTheme: accentTextTheme,
    inputDecorationTheme: inputDecorationTheme,
    iconTheme: iconTheme,
    primaryIconTheme: primaryIconTheme,
    accentIconTheme: accentIconTheme,
    sliderTheme: sliderTheme,
    tabBarTheme: tabBarTheme,
    chipTheme: chipTheme,
    platform: platform,
    materialTapTargetSize: materialTapTargetSize,
    pageTransitionsTheme: pageTransitionsTheme,
    colorScheme: colorScheme,
    dialogTheme: dialogTheme,
    typography: typography,
  );
}