Skip to content

Commit cb92ffc

Browse files
darrenaustindarrenaustin
authored
TextSelectionTheme support (step 2 of 3) (flutter#65044)
1 parent 277a87f commit cb92ffc

File tree

5 files changed

+37
-67
lines changed

5 files changed

+37
-67
lines changed

‎packages/flutter/lib/src/material/text_field.dart‎

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1098,11 +1098,6 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
10981098
}
10991099
}
11001100

1101-
Color _defaultSelectionColor(BuildContext context, Color primary) {
1102-
final bool isDark = Theme.of(context).brightness == Brightness.dark;
1103-
return primary.withOpacity(isDark ? 0.40 : 0.12);
1104-
}
1105-
11061101
@override
11071102
Widget build(BuildContext context) {
11081103
assert(debugCheckHasMaterial(context));
@@ -1136,13 +1131,14 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
11361131
switch (theme.platform) {
11371132
case TargetPlatform.iOS:
11381133
case TargetPlatform.macOS:
1134+
final CupertinoThemeData cupertinoTheme = CupertinoTheme.of(context);
11391135
forcePressEnabled = true;
11401136
textSelectionControls = cupertinoTextSelectionControls;
11411137
paintCursorAboveText = true;
11421138
cursorOpacityAnimates = true;
11431139
if (theme.useTextSelectionTheme) {
1144-
cursorColor ??= selectionTheme.cursorColor ?? CupertinoTheme.of(context).primaryColor;
1145-
selectionColor = selectionTheme.selectionColor ?? _defaultSelectionColor(context, CupertinoTheme.of(context).primaryColor);
1140+
cursorColor ??= selectionTheme.cursorColor ?? cupertinoTheme.primaryColor;
1141+
selectionColor = selectionTheme.selectionColor ?? cupertinoTheme.primaryColor.withOpacity(0.40);
11461142
} else {
11471143
cursorColor ??= CupertinoTheme.of(context).primaryColor;
11481144
selectionColor = theme.textSelectionColor;
@@ -1162,7 +1158,7 @@ class _TextFieldState extends State<TextField> with RestorationMixin implements
11621158
cursorOpacityAnimates = false;
11631159
if (theme.useTextSelectionTheme) {
11641160
cursorColor ??= selectionTheme.cursorColor ?? theme.colorScheme.primary;
1165-
selectionColor = selectionTheme.selectionColor ?? _defaultSelectionColor(context, theme.colorScheme.primary);
1161+
selectionColor = selectionTheme.selectionColor ?? theme.colorScheme.primary.withOpacity(0.40);
11661162
} else {
11671163
cursorColor ??= theme.cursorColor;
11681164
selectionColor = theme.textSelectionColor;

‎packages/flutter/lib/src/material/theme_data.dart‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -405,7 +405,7 @@ class ThemeData with Diagnosticable {
405405
dataTableTheme ??= const DataTableThemeData();
406406

407407
fixTextFieldOutlineLabel ??= false;
408-
useTextSelectionTheme ??= false;
408+
useTextSelectionTheme ??= true;
409409

410410
return ThemeData.raw(
411411
visualDensity: visualDensity,
@@ -883,12 +883,21 @@ class ThemeData with Diagnosticable {
883883
final Color secondaryHeaderColor;
884884

885885
/// The color of text selections in text fields, such as [TextField].
886+
///
887+
/// By default this property is no longer used. It has been replaced with
888+
/// [TextSelectionThemeData.selectionColor] and will soon be deprecated.
886889
final Color textSelectionColor;
887890

888891
/// The color of cursors in Material-style text fields, such as [TextField].
892+
///
893+
/// By default this property is no longer used. It has been replaced with
894+
/// [TextSelectionThemeData.cursorColor] and will soon be deprecated.
889895
final Color cursorColor;
890896

891897
/// The color of the handles used to adjust what part of the text is currently selected.
898+
///
899+
/// By default this property is no longer used. It has been replaced with
900+
/// [TextSelectionThemeData.selectionHandleColor] and will soon be deprecated.
892901
final Color textSelectionHandleColor;
893902

894903
/// A color that contrasts with the [primaryColor], e.g. used as the

‎packages/flutter/test/material/text_selection_test.dart‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -554,7 +554,9 @@ void main() {
554554
await tester.pumpWidget(RepaintBoundary(
555555
child: Theme(
556556
data: ThemeData(
557-
textSelectionHandleColor: const Color(0x550000AA),
557+
textSelectionTheme: const TextSelectionThemeData(
558+
selectionHandleColor: Color(0x550000AA),
559+
),
558560
),
559561
isMaterialAppTheme: true,
560562
child: Builder(

‎packages/flutter/test/material/text_selection_theme_test.dart‎

Lines changed: 7 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,10 @@ void main() {
5858
});
5959

6060
testWidgets('Empty textSelectionTheme will use defaults', (WidgetTester tester) async {
61+
const Color defaultCursorColor = Color(0x002196f3);
62+
const Color defaultSelectionColor = Color(0x662196f3);
63+
const Color defaultSelectionHandleColor = Color(0xff2196f3);
64+
6165
// Test TextField's cursor & selection color.
6266
await tester.pumpWidget(
6367
const MaterialApp(
@@ -69,52 +73,12 @@ void main() {
6973
await tester.pumpAndSettle();
7074
final EditableTextState editableTextState = tester.firstState(find.byType(EditableText));
7175
final RenderEditable renderEditable = editableTextState.renderEditable;
72-
expect(renderEditable.cursorColor, const Color(0x004285f4));
73-
expect(renderEditable.selectionColor, const Color(0xFF90CAF9));
76+
expect(renderEditable.cursorColor, defaultCursorColor);
77+
expect(Color(renderEditable.selectionColor.value), defaultSelectionColor);
7478

7579
// Test the selection handle color.
7680
await tester.pumpWidget(
7781
MaterialApp(
78-
home: Material(
79-
child: Builder(
80-
builder: (BuildContext context) {
81-
return materialTextSelectionControls.buildHandle(
82-
context, TextSelectionHandleType.left, 10.0
83-
);
84-
},
85-
),
86-
),
87-
),
88-
);
89-
await tester.pumpAndSettle();
90-
final RenderBox handle = tester.firstRenderObject<RenderBox>(find.byType(CustomPaint));
91-
expect(handle, paints..path(color: Colors.blue[300]));
92-
93-
});
94-
95-
testWidgets('Empty textSelectionTheme with useTextSelectionTheme set will use new defaults', (WidgetTester tester) async {
96-
final ThemeData theme = ThemeData.fallback().copyWith(useTextSelectionTheme: true);
97-
final Color primaryColor = Color(theme.colorScheme.primary.value);
98-
99-
// Test TextField's cursor & selection color.
100-
await tester.pumpWidget(
101-
MaterialApp(
102-
theme: theme,
103-
home: const Material(
104-
child: TextField(),
105-
),
106-
),
107-
);
108-
await tester.pumpAndSettle();
109-
final EditableTextState editableTextState = tester.firstState(find.byType(EditableText));
110-
final RenderEditable renderEditable = editableTextState.renderEditable;
111-
expect(renderEditable.cursorColor, primaryColor.withAlpha(0));
112-
expect(Color(renderEditable.selectionColor.value), primaryColor.withOpacity(0.12));
113-
114-
// Test the selection handle color.
115-
await tester.pumpWidget(
116-
MaterialApp(
117-
theme: theme,
11882
home: Material(
11983
child: Builder(
12084
builder: (BuildContext context) {
@@ -128,7 +92,7 @@ void main() {
12892
);
12993
await tester.pumpAndSettle();
13094
final RenderBox handle = tester.firstRenderObject<RenderBox>(find.byType(CustomPaint));
131-
expect(handle, paints..path(color: primaryColor));
95+
expect(handle, paints..path(color: defaultSelectionHandleColor));
13296
});
13397

13498
testWidgets('ThemeDate.textSelectionTheme will be used if provided', (WidgetTester tester) async {
@@ -138,7 +102,6 @@ void main() {
138102
selectionHandleColor: Color(0x00ccbbaa),
139103
);
140104
final ThemeData theme = ThemeData.fallback().copyWith(
141-
useTextSelectionTheme: true,
142105
textSelectionTheme: textSelectionTheme,
143106
);
144107

@@ -184,7 +147,6 @@ void main() {
184147
selectionHandleColor: Color(0x00ccbbaa),
185148
);
186149
final ThemeData theme = ThemeData.fallback().copyWith(
187-
useTextSelectionTheme: true,
188150
textSelectionTheme: defaultTextSelectionTheme,
189151
);
190152
const TextSelectionThemeData widgetTextSelectionTheme = TextSelectionThemeData(
@@ -240,7 +202,6 @@ void main() {
240202
selectionHandleColor: Color(0x00ccbbaa),
241203
);
242204
final ThemeData theme = ThemeData.fallback().copyWith(
243-
useTextSelectionTheme: true,
244205
textSelectionTheme: defaultTextSelectionTheme,
245206
);
246207
const TextSelectionThemeData widgetTextSelectionTheme = TextSelectionThemeData(

‎packages/flutter/test/widgets/editable_text_cursor_test.dart‎

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -208,6 +208,7 @@ void main() {
208208
}, variant: const TargetPlatformVariant(<TargetPlatform>{ TargetPlatform.iOS, TargetPlatform.macOS }));
209209

210210
testWidgets('Cursor does not animate on Android', (WidgetTester tester) async {
211+
final Color defaultCursorColor = Color(ThemeData.fallback().colorScheme.primary.value);
211212
const Widget widget = MaterialApp(
212213
home: Material(
213214
child: TextField(
@@ -225,12 +226,12 @@ void main() {
225226

226227
await tester.pump();
227228
expect(renderEditable.cursorColor.alpha, 255);
228-
expect(renderEditable, paints..rect(color: const Color(0xff4285f4)));
229+
expect(renderEditable, paints..rect(color: defaultCursorColor));
229230

230231
// Android cursor goes from exactly on to exactly off on the 500ms dot.
231232
await tester.pump(const Duration(milliseconds: 499));
232233
expect(renderEditable.cursorColor.alpha, 255);
233-
expect(renderEditable, paints..rect(color: const Color(0xff4285f4)));
234+
expect(renderEditable, paints..rect(color: defaultCursorColor));
234235

235236
await tester.pump(const Duration(milliseconds: 1));
236237
expect(renderEditable.cursorColor.alpha, 0);
@@ -239,7 +240,7 @@ void main() {
239240

240241
await tester.pump(const Duration(milliseconds: 500));
241242
expect(renderEditable.cursorColor.alpha, 255);
242-
expect(renderEditable, paints..rect(color: const Color(0xff4285f4)));
243+
expect(renderEditable, paints..rect(color: defaultCursorColor));
243244

244245
await tester.pump(const Duration(milliseconds: 500));
245246
expect(renderEditable.cursorColor.alpha, 0);
@@ -248,6 +249,7 @@ void main() {
248249

249250
testWidgets('Cursor does not animates when debugDeterministicCursor is set', (WidgetTester tester) async {
250251
EditableText.debugDeterministicCursor = true;
252+
final Color defaultCursorColor = Color(ThemeData.fallback().colorScheme.primary.value);
251253
const Widget widget = MaterialApp(
252254
home: Material(
253255
child: TextField(
@@ -268,24 +270,24 @@ void main() {
268270
await tester.pump();
269271
await tester.pump(const Duration(milliseconds: 200));
270272
expect(renderEditable.cursorColor.alpha, 255);
271-
expect(renderEditable, paints..rrect(color: const Color(0xff2196f3)));
273+
expect(renderEditable, paints..rrect(color: defaultCursorColor));
272274

273275
// Cursor draw never changes.
274276
await tester.pump(const Duration(milliseconds: 200));
275277
expect(renderEditable.cursorColor.alpha, 255);
276-
expect(renderEditable, paints..rrect(color: const Color(0xff2196f3)));
278+
expect(renderEditable, paints..rrect(color: defaultCursorColor));
277279

278280
// No more transient calls.
279281
await tester.pumpAndSettle();
280282
expect(renderEditable.cursorColor.alpha, 255);
281-
expect(renderEditable, paints..rrect(color: const Color(0xff2196f3)));
283+
expect(renderEditable, paints..rrect(color: defaultCursorColor));
282284

283285
EditableText.debugDeterministicCursor = false;
284286
}, variant: const TargetPlatformVariant(<TargetPlatform>{ TargetPlatform.iOS, TargetPlatform.macOS }));
285287

286288
testWidgets('Cursor does not animate on Android when debugDeterministicCursor is set', (WidgetTester tester) async {
289+
final Color defaultCursorColor = Color(ThemeData.fallback().colorScheme.primary.value);
287290
EditableText.debugDeterministicCursor = true;
288-
289291
const Widget widget = MaterialApp(
290292
home: Material(
291293
child: TextField(
@@ -303,21 +305,21 @@ void main() {
303305

304306
await tester.pump();
305307
expect(renderEditable.cursorColor.alpha, 255);
306-
expect(renderEditable, paints..rect(color: const Color(0xff4285f4)));
308+
expect(renderEditable, paints..rect(color: defaultCursorColor));
307309

308310
await tester.pump(const Duration(milliseconds: 500));
309311
expect(renderEditable.cursorColor.alpha, 255);
310-
expect(renderEditable, paints..rect(color: const Color(0xff4285f4)));
312+
expect(renderEditable, paints..rect(color: defaultCursorColor));
311313

312314
// Cursor draw never changes.
313315
await tester.pump(const Duration(milliseconds: 500));
314316
expect(renderEditable.cursorColor.alpha, 255);
315-
expect(renderEditable, paints..rect(color: const Color(0xff4285f4)));
317+
expect(renderEditable, paints..rect(color: defaultCursorColor));
316318

317319
// No more transient calls.
318320
await tester.pumpAndSettle();
319321
expect(renderEditable.cursorColor.alpha, 255);
320-
expect(renderEditable, paints..rect(color: const Color(0xff4285f4)));
322+
expect(renderEditable, paints..rect(color: defaultCursorColor));
321323

322324
EditableText.debugDeterministicCursor = false;
323325
});

0 commit comments

Comments
 (0)