toThemeData method
Convert to ThemeData in Flutter.
Passing this to MaterialApp and others will change the Flutter widget to a design suitable for AppThemeData.
If brightness
is specified, it will change to that color theme.
defaultFontFamily
allows you to specify the default font for the app.
FlutterのThemeDataに変換します。
これをMaterialAppなどに渡すとFlutterのウィジェットがAppThemeDataに適したデザインに変更されます。
brightness
を指定するとそのカラーテーマに変更されます。
defaultFontFamily
を指定するとアプリのデフォルトのフォントを指定することができます。
Implementation
ThemeData toThemeData({
Brightness? brightness,
String? defaultFontFamily,
}) {
final text = this.text;
defaultFontFamily ??= text.defaultFontFamily;
switch (brightness ?? color.brightness) {
case Brightness.dark:
final color = _darkColor;
final theme = ThemeData.dark();
final colorScheme = theme.colorScheme.copyWith(
primary: color.primary,
primaryContainer: color.primaryContainer,
secondary: color.secondary,
secondaryContainer: color.secondaryContainer,
tertiary: color.tertiary,
tertiaryContainer: color.tertiaryContainer,
surface: color.surface,
error: color.error,
errorContainer: color.warning,
onPrimary: color.onPrimary,
onPrimaryContainer: color.onPrimaryContainer,
onSecondary: color.onSecondary,
onSecondaryContainer: color.onSecondaryContainer,
onTertiary: color.onTertiary,
onTertiaryContainer: color.onTertiaryContainer,
onSurface: color.onSurface,
onError: color.onError,
onErrorContainer: color.onWarning,
brightness: color.brightness,
outline: color.outline,
inversePrimary: color.inversePrimary,
inverseSurface: color.inverseSurface,
onInverseSurface: color.onInverseSurface,
);
final textTheme = theme.textTheme.copyWith(
displayLarge:
text.displayLarge.copyWith(fontFamily: text.defaultFontFamily),
displayMedium:
text.displayMedium.copyWith(fontFamily: text.defaultFontFamily),
displaySmall:
text.displaySmall.copyWith(fontFamily: text.defaultFontFamily),
headlineLarge:
text.headlineLarge.copyWith(fontFamily: text.defaultFontFamily),
headlineMedium:
text.headlineMedium.copyWith(fontFamily: text.defaultFontFamily),
headlineSmall:
text.headlineSmall.copyWith(fontFamily: text.defaultFontFamily),
titleLarge:
text.titleLarge.copyWith(fontFamily: text.defaultFontFamily),
titleMedium:
text.titleMedium.copyWith(fontFamily: text.defaultFontFamily),
titleSmall:
text.titleSmall.copyWith(fontFamily: text.defaultFontFamily),
bodyLarge:
text.bodyLarge.copyWith(fontFamily: text.defaultFontFamily),
bodyMedium:
text.bodyMedium.copyWith(fontFamily: text.defaultFontFamily),
bodySmall:
text.bodySmall.copyWith(fontFamily: text.defaultFontFamily),
labelLarge:
text.labelLarge.copyWith(fontFamily: text.defaultFontFamily),
labelMedium:
text.labelMedium.copyWith(fontFamily: text.defaultFontFamily),
labelSmall:
text.labelSmall.copyWith(fontFamily: text.defaultFontFamily),
);
final appBarForegroundColor = color.onAppBarColor ?? color.onBackground;
return ThemeData(
fontFamily: defaultFontFamily,
useMaterial3: useMaterial3,
platform: platform,
splashColor: color.splashColor,
canvasColor: color.canvas,
scaffoldBackgroundColor: color.scaffoldBackgroundColor,
dialogBackgroundColor: color.dialogColor ?? color.surface,
textTheme: textTheme.apply(
fontFamily: text.defaultFontFamily,
bodyColor: color.onBackground,
displayColor: color.onBackground,
fontSizeFactor: text.fontSizeFactor,
fontSizeDelta: text.fontSizeDelta,
decorationColor: color.onBackground,
),
iconTheme: theme.iconTheme.copyWith(color: color.onBackground),
appBarTheme: theme.appBarTheme.copyWith(
centerTitle: centerTitleOnAppBar,
backgroundColor: color.appBarColor ?? color.background,
surfaceTintColor: color.appBarColor ?? color.background,
elevation: color.appBarColor == Colors.transparent ? 0 : null,
foregroundColor: appBarForegroundColor,
toolbarTextStyle: theme.appBarTheme.toolbarTextStyle?.copyWith(
color: appBarForegroundColor,
decorationColor: appBarForegroundColor,
) ??
TextStyle(
color: appBarForegroundColor,
decorationColor: appBarForegroundColor,
),
titleTextStyle: theme.appBarTheme.titleTextStyle?.copyWith(
color: appBarForegroundColor,
decorationColor: appBarForegroundColor,
) ??
text.titleLarge.copyWith(color: appBarForegroundColor),
iconTheme: theme.appBarTheme.iconTheme?.copyWith(
color: appBarForegroundColor,
) ??
IconThemeData(color: appBarForegroundColor),
actionsIconTheme: theme.appBarTheme.actionsIconTheme?.copyWith(
color: appBarForegroundColor,
) ??
IconThemeData(color: appBarForegroundColor),
systemOverlayStyle: SystemUiOverlayStyle(
systemNavigationBarIconBrightness:
statusBarBrightnessOnIOS != null
? _inverse(statusBarBrightnessOnIOS!, false)
: Brightness.dark,
statusBarBrightness: statusBarBrightnessOnIOS != null
? _inverse(statusBarBrightnessOnIOS!, false)
: Brightness.dark,
statusBarIconBrightness:
statusBarBrightnessOnAndroid ?? Brightness.light,
),
),
dialogTheme: theme.dialogTheme.copyWith(
iconColor: color.onDialogColor ?? color.onSurface,
titleTextStyle: theme.dialogTheme.titleTextStyle
?.withColor(color.onDialogColor ?? color.onSurface) ??
text.headlineSmall
.withColor(color.onDialogColor ?? color.onSurface),
contentTextStyle: theme.dialogTheme.contentTextStyle
?.withColor(color.onDialogColor ?? color.onSurface) ??
text.bodyMedium
.withColor(color.onDialogColor ?? color.onSurface),
backgroundColor: color.dialogColor ?? color.surface,
surfaceTintColor: color.dialogColor ?? color.surface,
),
buttonTheme: theme.buttonTheme.copyWith(
textTheme: theme.buttonTheme.textTheme,
buttonColor: color.primary,
disabledColor: color.disabled,
colorScheme: colorScheme,
),
chipTheme: theme.chipTheme.copyWith(
side: BorderSide.none,
backgroundColor: color.surface,
disabledColor: color.disabled,
labelStyle: theme.chipTheme.labelStyle?.copyWith(
color: color.onSurface,
decorationColor: color.onSurface,
) ??
TextStyle(
color: color.onSurface,
decorationColor: color.onSurface,
),
secondaryLabelStyle: theme.chipTheme.secondaryLabelStyle?.copyWith(
color: color.onSurface, decorationColor: color.onSurface) ??
TextStyle(
color: color.onSurface, decorationColor: color.onSurface),
deleteIconColor: color.onSurface,
),
inputDecorationTheme: theme.inputDecorationTheme.copyWith(
labelStyle: TextStyle(
color: color.weak,
decorationColor: color.weak,
),
helperStyle: TextStyle(
color: color.weak,
decorationColor: color.weak,
),
hintStyle: TextStyle(
color: color.weak,
decorationColor: color.weak,
),
counterStyle: TextStyle(
color: color.weak,
decorationColor: color.weak,
),
errorStyle:
TextStyle(color: color.error, decorationColor: color.error),
prefixStyle: TextStyle(
color: color.onBackground,
decorationColor: color.onBackground,
),
suffixStyle: TextStyle(
color: color.onBackground,
decorationColor: color.onBackground,
),
border: OutlineInputBorder(
borderSide: BorderSide(color: color.weak, width: 2),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.weak, width: 2),
),
disabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.weak, width: 2),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.primary, width: 2),
),
errorBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.error, width: 2),
),
focusedErrorBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.error, width: 2),
),
),
listTileTheme: theme.listTileTheme.copyWith(
tileColor: color.background,
selectedTileColor: color.primary,
iconColor: color.onBackground,
textColor: color.onBackground,
),
iconButtonTheme: IconButtonThemeData(
style: IconButton.styleFrom(
foregroundColor: color.onBackground,
)),
indicatorColor: color.secondary,
brightness: color.brightness,
primaryColor: color.primary,
disabledColor: color.disabled,
dividerColor: color.outline,
dividerTheme: DividerThemeData(
color: color.outline,
),
colorScheme: colorScheme.copyWith(error: color.error),
extensions: [
ScaffoldThemeExtension(
backgroundColor: color.background,
foregourendColor: color.onBackground,
),
AppBarThemeExtension(
collapsedForegroundColor:
color.onAppBarColor ?? color.onBackground,
expandedForegroundColor: color.onExpandedAppBarColor ??
color.onAppBarColor ??
color.onBackground,
),
...theme.extensions.values,
],
);
default:
final color = _lightColor;
final theme = ThemeData.light();
final colorScheme = theme.colorScheme.copyWith(
primary: color.primary,
primaryContainer: color.primaryContainer,
secondary: color.secondary,
secondaryContainer: color.secondaryContainer,
tertiary: color.tertiary,
tertiaryContainer: color.tertiaryContainer,
surface: color.surface,
error: color.error,
onPrimary: color.onPrimary,
onPrimaryContainer: color.onPrimaryContainer,
onSecondary: color.onSecondary,
onSecondaryContainer: color.onSecondaryContainer,
onTertiary: color.onTertiary,
onTertiaryContainer: color.onTertiaryContainer,
onSurface: color.onSurface,
onError: color.onError,
brightness: color.brightness,
outline: color.outline,
inversePrimary: color.inversePrimary,
inverseSurface: color.inverseSurface,
onInverseSurface: color.onInverseSurface,
);
final textTheme = theme.textTheme.copyWith(
displayLarge:
text.displayLarge.copyWith(fontFamily: text.defaultFontFamily),
displayMedium:
text.displayMedium.copyWith(fontFamily: text.defaultFontFamily),
displaySmall:
text.displaySmall.copyWith(fontFamily: text.defaultFontFamily),
headlineLarge:
text.headlineLarge.copyWith(fontFamily: text.defaultFontFamily),
headlineMedium:
text.headlineMedium.copyWith(fontFamily: text.defaultFontFamily),
headlineSmall:
text.headlineSmall.copyWith(fontFamily: text.defaultFontFamily),
titleLarge:
text.titleLarge.copyWith(fontFamily: text.defaultFontFamily),
titleMedium:
text.titleMedium.copyWith(fontFamily: text.defaultFontFamily),
titleSmall:
text.titleSmall.copyWith(fontFamily: text.defaultFontFamily),
bodyLarge:
text.bodyLarge.copyWith(fontFamily: text.defaultFontFamily),
bodyMedium:
text.bodyMedium.copyWith(fontFamily: text.defaultFontFamily),
bodySmall:
text.bodySmall.copyWith(fontFamily: text.defaultFontFamily),
labelLarge:
text.labelLarge.copyWith(fontFamily: text.defaultFontFamily),
labelMedium:
text.labelMedium.copyWith(fontFamily: text.defaultFontFamily),
labelSmall:
text.labelSmall.copyWith(fontFamily: text.defaultFontFamily),
);
final appBarForegroundColor = color.onAppBarColor ?? color.onBackground;
return ThemeData(
fontFamily: defaultFontFamily,
useMaterial3: useMaterial3,
platform: platform,
splashColor: color.splashColor,
canvasColor: color.canvas,
scaffoldBackgroundColor: color.scaffoldBackgroundColor,
dialogBackgroundColor: color.dialogColor ?? color.surface,
appBarTheme: theme.appBarTheme.copyWith(
centerTitle: centerTitleOnAppBar,
backgroundColor: color.appBarColor ?? color.background,
surfaceTintColor: color.appBarColor ?? color.background,
elevation: color.appBarColor == Colors.transparent ? 0 : null,
foregroundColor: appBarForegroundColor,
toolbarTextStyle: theme.appBarTheme.toolbarTextStyle?.copyWith(
color: appBarForegroundColor,
decorationColor: appBarForegroundColor,
) ??
TextStyle(
color: appBarForegroundColor,
decorationColor: appBarForegroundColor,
),
titleTextStyle: theme.appBarTheme.titleTextStyle?.copyWith(
color: appBarForegroundColor,
decorationColor: appBarForegroundColor,
) ??
text.titleLarge.copyWith(
color: appBarForegroundColor,
decorationColor: appBarForegroundColor,
),
iconTheme: theme.appBarTheme.iconTheme?.copyWith(
color: appBarForegroundColor,
) ??
IconThemeData(color: appBarForegroundColor),
actionsIconTheme: theme.appBarTheme.actionsIconTheme?.copyWith(
color: appBarForegroundColor,
) ??
IconThemeData(color: appBarForegroundColor),
systemOverlayStyle: SystemUiOverlayStyle(
systemNavigationBarIconBrightness:
statusBarBrightnessOnIOS != null
? _inverse(statusBarBrightnessOnIOS!, false)
: Brightness.light,
statusBarBrightness: statusBarBrightnessOnIOS != null
? _inverse(statusBarBrightnessOnIOS!, false)
: Brightness.light,
statusBarIconBrightness:
statusBarBrightnessOnAndroid ?? Brightness.dark,
),
),
iconTheme: theme.iconTheme.copyWith(color: color.onBackground),
dialogTheme: theme.dialogTheme.copyWith(
iconColor: color.onDialogColor ?? color.onSurface,
titleTextStyle: theme.dialogTheme.titleTextStyle
?.withColor(color.onDialogColor ?? color.onSurface) ??
text.headlineSmall
.withColor(color.onDialogColor ?? color.onSurface),
contentTextStyle: theme.dialogTheme.contentTextStyle
?.withColor(color.onDialogColor ?? color.onSurface) ??
text.bodyMedium
.withColor(color.onDialogColor ?? color.onSurface),
backgroundColor: color.dialogColor ?? color.surface,
surfaceTintColor: color.dialogColor ?? color.surface,
),
textTheme: textTheme.apply(
fontFamily: text.defaultFontFamily,
bodyColor: color.onBackground,
displayColor: color.onBackground,
fontSizeFactor: text.fontSizeFactor,
fontSizeDelta: text.fontSizeDelta,
decorationColor: color.onBackground,
),
buttonTheme: theme.buttonTheme.copyWith(
buttonColor: color.primary,
disabledColor: color.disabled,
colorScheme: colorScheme,
),
chipTheme: theme.chipTheme.copyWith(
side: BorderSide.none,
backgroundColor: color.surface,
disabledColor: color.disabled,
labelStyle: theme.chipTheme.labelStyle?.copyWith(
color: color.onSurface,
decorationColor: color.onSurface,
) ??
TextStyle(
color: color.onSurface,
decorationColor: color.onSurface,
),
secondaryLabelStyle: theme.chipTheme.secondaryLabelStyle?.copyWith(
color: color.onSurface,
decorationColor: color.onSurface,
) ??
TextStyle(
color: color.onSurface,
decorationColor: color.onSurface,
),
deleteIconColor: color.onSurface,
),
listTileTheme: theme.listTileTheme.copyWith(
tileColor: color.background,
selectedTileColor: color.primary,
iconColor: color.onBackground,
textColor: color.onBackground,
),
iconButtonTheme: IconButtonThemeData(
style: IconButton.styleFrom(
foregroundColor: color.onBackground,
)),
inputDecorationTheme: theme.inputDecorationTheme.copyWith(
labelStyle:
TextStyle(color: color.weak, decorationColor: color.weak),
helperStyle:
TextStyle(color: color.weak, decorationColor: color.weak),
hintStyle:
TextStyle(color: color.weak, decorationColor: color.weak),
counterStyle:
TextStyle(color: color.weak, decorationColor: color.weak),
errorStyle:
TextStyle(color: color.error, decorationColor: color.error),
prefixStyle: TextStyle(
color: color.onBackground, decorationColor: color.onBackground),
suffixStyle: TextStyle(
color: color.onBackground, decorationColor: color.onBackground),
border: OutlineInputBorder(
borderSide: BorderSide(color: color.weak, width: 2),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.weak, width: 2),
),
disabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.weak, width: 2),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.primary, width: 2),
),
errorBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.error, width: 2),
),
focusedErrorBorder: OutlineInputBorder(
borderSide: BorderSide(color: color.error, width: 2),
),
),
indicatorColor: color.secondary,
brightness: color.brightness,
primaryColor: color.primary,
disabledColor: color.disabled,
dividerColor: color.outline,
dividerTheme: DividerThemeData(
color: color.outline,
),
colorScheme: colorScheme.copyWith(error: color.error),
extensions: [
ScaffoldThemeExtension(
backgroundColor: color.background,
foregourendColor: color.onBackground,
),
AppBarThemeExtension(
collapsedForegroundColor:
color.onAppBarColor ?? color.onBackground,
expandedForegroundColor: color.onExpandedAppBarColor ??
color.onAppBarColor ??
color.onBackground,
),
...theme.extensions.values,
],
);
}
}