Reputation: 29016
Minimal reproducible code:
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: Theme(
data: ThemeData(
textButtonTheme: TextButtonThemeData(
style: ButtonStyle(
textStyle: MaterialStateProperty.resolveWith(
(Set<MaterialState> states) {
final headline = Theme.of(context).textTheme.headline6;
final textStyle = headline.copyWith(
fontSize: 40, // Works
backgroundColor: Colors.red, // Works
color: Colors.white, // Doesn't work
);
return textStyle;
},
),
),
),
),
child: TextButton(
onPressed: () {},
style: Theme.of(context).textButtonTheme.style,
child: Text('Button'),
),
),
),
);
}
Output:
As you can see fontSize
and backgroundColor
, both are applied to the TextButton
but only the color
is not applied. How can that be possible?
Note: I'm not looking for making it work the other way (there are many ways of doing it). I just want to know why the color
isn't passed.
Upvotes: 0
Views: 42
Reputation: 494
If you want to change the text's color you should do this :
final textStyle = headline.copyWith(
fontSize: 40,
backgroundColor: Colors.red,
foreground: Paint()..color = Colors.white,
);
and if you check text_style documentaion they say:
/// One of [color] or [foreground] must be null, and if this has [foreground]
/// specified it will be given preference over any color parameter.
I think the foreground has some default color or something that overriding the "color" so it won't change.
Upvotes: 1