Unverified Commit c5da5070 authored by Hasnen Tai's avatar Hasnen Tai Committed by GitHub

Feat : `TextField` cursor color matching M2 and M3 Spec in error state (#119225)

According to Material specs, cursor should be red in error state.
parent 9b13fda3
......@@ -917,6 +917,8 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
bool get _hasError => widget.decoration?.errorText != null || _hasIntrinsicError;
Color get _errorColor => widget.decoration?.errorStyle?.color ?? Theme.of(context).colorScheme.error;
InputDecoration _getEffectiveDecoration() {
final MaterialLocalizations localizations = MaterialLocalizations.of(context);
final ThemeData themeData = Theme.of(context);
......@@ -1247,7 +1249,7 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
textSelectionControls ??= cupertinoTextSelectionHandleControls;
paintCursorAboveText = true;
cursorOpacityAnimates = true;
cursorColor = widget.cursorColor ?? selectionStyle.cursorColor ?? cupertinoTheme.primaryColor;
cursorColor = _hasError ? _errorColor : widget.cursorColor ?? selectionStyle.cursorColor ?? cupertinoTheme.primaryColor;
selectionColor = selectionStyle.selectionColor ?? cupertinoTheme.primaryColor.withOpacity(0.40);
cursorRadius ??= const Radius.circular(2.0);
cursorOffset = Offset(iOSHorizontalOffset / MediaQuery.devicePixelRatioOf(context), 0);
......@@ -1260,7 +1262,7 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
textSelectionControls ??= cupertinoDesktopTextSelectionHandleControls;
paintCursorAboveText = true;
cursorOpacityAnimates = false;
cursorColor = widget.cursorColor ?? selectionStyle.cursorColor ?? cupertinoTheme.primaryColor;
cursorColor = _hasError ? _errorColor : widget.cursorColor ?? selectionStyle.cursorColor ?? cupertinoTheme.primaryColor;
selectionColor = selectionStyle.selectionColor ?? cupertinoTheme.primaryColor.withOpacity(0.40);
cursorRadius ??= const Radius.circular(2.0);
cursorOffset = Offset(iOSHorizontalOffset / MediaQuery.devicePixelRatioOf(context), 0);
......@@ -1278,7 +1280,7 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
textSelectionControls ??= materialTextSelectionHandleControls;
paintCursorAboveText = false;
cursorOpacityAnimates = false;
cursorColor = widget.cursorColor ?? selectionStyle.cursorColor ?? theme.colorScheme.primary;
cursorColor = _hasError ? _errorColor : widget.cursorColor ?? selectionStyle.cursorColor ?? theme.colorScheme.primary;
selectionColor = selectionStyle.selectionColor ?? theme.colorScheme.primary.withOpacity(0.40);
break;
......@@ -1287,7 +1289,7 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
textSelectionControls ??= desktopTextSelectionHandleControls;
paintCursorAboveText = false;
cursorOpacityAnimates = false;
cursorColor = widget.cursorColor ?? selectionStyle.cursorColor ?? theme.colorScheme.primary;
cursorColor = _hasError ? _errorColor : widget.cursorColor ?? selectionStyle.cursorColor ?? theme.colorScheme.primary;
selectionColor = selectionStyle.selectionColor ?? theme.colorScheme.primary.withOpacity(0.40);
break;
......@@ -1296,7 +1298,7 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
textSelectionControls ??= desktopTextSelectionHandleControls;
paintCursorAboveText = false;
cursorOpacityAnimates = false;
cursorColor = widget.cursorColor ?? selectionStyle.cursorColor ?? theme.colorScheme.primary;
cursorColor = _hasError ? _errorColor : widget.cursorColor ?? selectionStyle.cursorColor ?? theme.colorScheme.primary;
selectionColor = selectionStyle.selectionColor ?? theme.colorScheme.primary.withOpacity(0.40);
handleDidGainAccessibilityFocus = () {
// Automatically activate the TextField when it receives accessibility focus.
......
......@@ -1169,4 +1169,28 @@ void main() {
final EditableText editableText = tester.widget(find.byType(EditableText));
expect(editableText.magnifierConfiguration, equals(myTextMagnifierConfiguration));
});
testWidgets('Error color for cursor while validating', (WidgetTester tester) async {
const Color errorColor = Color(0xff123456);
await tester.pumpWidget(MaterialApp(
theme: ThemeData(
colorScheme: const ColorScheme.light(error: errorColor),
),
home: Material(
child: Center(
child: TextFormField(
enabled: true,
autovalidateMode: AutovalidateMode.always,
validator: (String? value) {
return 'Please enter value';
},
),
),
),
));
await tester.enterText(find.byType(TextField), 'a');
final EditableText textField = tester.widget(find.byType(EditableText).first);
await tester.pump();
expect(textField.cursorColor, errorColor);
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment