I am working through the 'Write your first Flutter app' tutorials and have gotten to part 2, step 7 without issues. However, on the line:
foregroundColor: Colors.black,
VSCode underlines foregroundColor
and says:
The named parameter 'foregroundColor' isn't defined
It didn't change the colour after a hot reload, and it won't build with the error, the Debug Console saying:
lib/main.dart:17
foregroundColor: Colors.black,
^^^^^^^^^^^^^^^
: Context: Found this candidate, but the arguments don't match.
../…/material/theme_data.dart:219
factory ThemeData({
^
Here is the full build
Widget (in the MyApp
class):
Widget build(BuildContext context) {
return MaterialApp(
title: 'Startup Name Generator',
theme: ThemeData(
backgroundColor: Colors.white,
foregroundColor: Colors.black,
),
home: RandomWords(),
);
}
UPDATE: I didn't have
appBarTheme: const AppBarTheme(
//themes here
),
inside ThemeData
, as the tutorial showed. After adding it, it works!
CodePudding user response:
Flutter theme data do not provide the foreground attribute. But appBarThemeData provide that. Like this
theme: ThemeData(
// This is the theme of your application.
//
// Try running your application with "flutter run". You'll see the
// application has a blue toolbar. Then, without quitting the app, try
// changing the primarySwatch below to Colors.green and then invoke
// "hot reload" (press "r" in the console where you ran "flutter run",
// or simply save your changes to "hot reload" in a Flutter IDE).
// Notice that the counter didn't reset back to zero; the application
// is not restarted.
backgroundColor: Colors.red,
appBarTheme: const AppBarTheme(foregroundColor: Colors.red),
primarySwatch: Colors.blue,
),
CodePudding user response:
I think you are referring to this codelab. https://codelabs.developers.google.com/codelabs/first-flutter-app-pt2#6
Don't worry, It's a mistake there. I already reported that one. There is no attribute named foregroundColor in the current ThemeData class.
Also now flutter team suggests using ColorScheme to define colors for the application. Here is an example of the same.
theme: ThemeData(
colorScheme: ColorScheme.light(
primary: Colors.blue,
secondary: Colors.red,
background: Colors.white,
),
appBarTheme: AppBarTheme(
backgroundColor: Colors.white,
elevation: 0,
iconTheme: IconThemeData(color: AppColor.primaryColor)),
scaffoldBackgroundColor: Colors.white);