Я создаю приложение для флаттера с использованием материалов Google.Но я не могу применить цвет поверхности к карточкам и листам.Материал должен наносить цвет поверхности на карточки, нижние листы и меню в соответствии с рекомендациями material.io.
Определены цвета в файле AppColor.dart как:
class AppColor {
static Color primaryColor = Colors.deepPurple[500];
static Color secondaryColor = Colors.teal[200];
static Color accentColor = Colors.green[100];
static Color surface = Colors.grey[200];
static Color background = Colors.grey[50];
static Color onPrimary = Colors.white;
static Color onSecondary = Colors.black;
static Color onSurface = Colors.black;
static Color onError = Colors.white;
}
Добавлен цвет поверхности как серый [200] в файле Themes.dart как
Themes.dart
static ColorScheme colorScheme = const ColorScheme.light().copyWith(
primary: AppColor.primaryColor,
secondary: AppColor.secondaryColor,
surface: AppColor.surface,
background: AppColor.background,
onPrimary: AppColor.onPrimary,
onSecondary: AppColor.onSecondary,
onSurface: AppColor.onSurface,
onBackground: AppColor.onBackground,
onError: AppColor.onError,
);
Appplied it in Main.dart as:
return MaterialApp(
theme: ThemeData(
primaryColor: AppColor.primaryColor,
accentColor: AppColor.secondaryColor,
colorScheme: Themes.colorScheme,
textTheme: TextTheme(
overline:
TextStyle(fontFamily: AppFont.ROBOTO_MEDIUM, fontSize: 12),
button: TextStyle(fontFamily: AppFont.ROBOTO_MEDIUM, fontSize: 14),
caption:
TextStyle(fontFamily: AppFont.ROBOTO_REGULAR, fontSize: 12),
body1: TextStyle(fontFamily: AppFont.ROBOTO_REGULAR, fontSize: 14),
body2: TextStyle(fontFamily: AppFont.ROBOTO_REGULAR, fontSize: 16),
title: TextStyle(fontFamily: AppFont.ROBOTO_MEDIUM, fontSize: 20),
),
));
Цвет серыйне распространяется на любую поверхность (карты, листы, меню).Карты отображаются по умолчанию в белом цвете.Я должен вручную изменить цвет карты, чтобы добавить цвет на карту.Благодаря этому цвет поверхности для текста также не изменяется для текста на карточке.