TextFields don't support disabled input text styling #118568
Description
Raised internally at b/245672222.
Issue When a text field is in a disabled state (enabled: false), any initialText value doesn't have disabled text styling:
Expected We'd expect to see the input text in the same state as the other disabled values (ie. opacity 0.38):
(from https://m3.material.io/components/text-fields/specs)
This can be verified in the following Dartpad: https://dartpad.dev/?4d3d979fd0ff6b00823573c9d7e0d609
Or with the following constructors:
TextField(
controller: TextEditingController(text: 'this text should be in disabled style but it is not'),
decoration: const InputDecoration(
enabled: false,
icon: Icon(Icons.person),
),
),
or for a TextFormField:
TextFormField(
initialValue: 'this text should be in disabled style but it is not',
decoration: const InputDecoration(
enabled: false,
icon: Icon(Icons.person),
),
onSaved: (String? value) { /* save something */ },
);
From some investigation, there's no direct way from the InputDecoration theme to override the input style.
It can, however, be overridden by changing the theme's value for textTheme.subtitle1, or directly modifying the input style in text_field.dart. This doesn't support state, so we cannot currently do something like:
TextStyle _m3InputStyle(BuildContext context) => MaterialStateTextStyle.resolveWith((Set<MaterialState> states) {
final textTheme = Theme.of(context).textTheme;
if (states.contains(MaterialState.disabled)) {
return textTheme.bodyLarge!.copyWith(color: textTheme.bodyLarge!.color!.withOpacity(0.38));
}
return textTheme.bodyLarge!;
});
Solution: Ideally, text_field.dart would be updated to permit state resolution.