Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter theme - primarySwatch vs primaryColor

Tags:

flutter

When defining theme data, what should I use - primarySwatch or primaryColor?

Can they be used together?

And finaly, what's the difference between them?

ThemeData(
    primarySwatch: kBaseColor,
    brightness: Brightness.light,
    primaryColor: kBaseColor,
    visualDensity: VisualDensity.adaptivePlatformDensity,
),
like image 384
rozerro Avatar asked Apr 21 '26 19:04

rozerro


1 Answers

primaryColor has a type Color with shade[500] of primarySwatch, that itself has type MaterialColor.

Preferable to use primarySwatch to let app define different shades for its components.

This is a code fragment how theme colors are defined in theme_data.dart (material library):

    final Brightness _brightness = brightness ?? colorScheme?.brightness ?? Brightness.light;
    final bool isDark = _brightness == Brightness.dark;

    primaryColor ??= isDark ? Colors.grey[900]! : primarySwatch;
    primaryColorLight ??= isDark ? Colors.grey[500] : primarySwatch[100]!
    toggleableActiveColor ??= isDark ? Colors.tealAccent[200]! : (accentColor ?? primarySwatch[600]!);
    secondaryHeaderColor ??= isDark ? Colors.grey[700]! : primarySwatch[50]!;
    textSelectionHandleColor ??= isDark ? Colors.tealAccent[400]! : primarySwatch[300]!;

and so on.

like image 72
Simon Sot Avatar answered Apr 29 '26 12:04

Simon Sot