From dbf8e0d5a5869f0bd6cdf8801b16c84bd83e9579 Mon Sep 17 00:00:00 2001 From: Yijing Huang Date: Thu, 29 Jun 2023 12:26:49 -0500 Subject: [PATCH 1/2] fix: keep keyboard appearance as same brightness as system theme --- .../service/ime/delta_input_service.dart | 12 ++++++++---- .../service/ime/non_delta_input_service.dart | 9 +++++++-- .../service/keyboard_service_widget.dart | 5 ++++- 3 files changed, 19 insertions(+), 7 deletions(-) diff --git a/lib/src/editor/editor_component/service/ime/delta_input_service.dart b/lib/src/editor/editor_component/service/ime/delta_input_service.dart index 1932cb26c..8ce8ca0e0 100644 --- a/lib/src/editor/editor_component/service/ime/delta_input_service.dart +++ b/lib/src/editor/editor_component/service/ime/delta_input_service.dart @@ -1,6 +1,7 @@ import 'dart:math'; import 'package:appflowy_editor/appflowy_editor.dart'; +import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; abstract class TextInputService { @@ -27,8 +28,10 @@ abstract class TextInputService { /// Updates the [TextEditingValue] of the text currently being edited. /// /// Note that if there are IME-related requirements, - /// please config `composing` value within [TextEditingValue] - void attach(TextEditingValue textEditingValue); + /// please config `composing` value within [TextEditingValue] + /// + /// [BuildContext] is used to get current keyboard appearance(light or dark) + void attach(TextEditingValue textEditingValue, BuildContext context); /// Applies insertion, deletion and replacement /// to the text currently being edited. @@ -82,16 +85,17 @@ class DeltaTextInputService extends TextInputService with DeltaTextInputClient { } @override - void attach(TextEditingValue textEditingValue) { + void attach(TextEditingValue textEditingValue, BuildContext context) { if (_textInputConnection == null || _textInputConnection!.attached == false) { _textInputConnection = TextInput.attach( this, - const TextInputConfiguration( + TextInputConfiguration( enableDeltaModel: true, inputType: TextInputType.multiline, textCapitalization: TextCapitalization.sentences, inputAction: TextInputAction.newline, + keyboardAppearance: Theme.of(context).brightness, ), ); } diff --git a/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart b/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart index e83da683a..7e2966599 100644 --- a/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart +++ b/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart @@ -2,6 +2,7 @@ import 'dart:math'; import 'package:appflowy_editor/appflowy_editor.dart'; import 'package:appflowy_editor/src/editor/editor_component/service/ime/text_diff.dart'; +import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; class NonDeltaTextInputService extends TextInputService with TextInputClient { @@ -54,7 +55,10 @@ class NonDeltaTextInputService extends TextInputService with TextInputClient { } @override - void attach(TextEditingValue textEditingValue) { + void attach( + TextEditingValue textEditingValue, + BuildContext context, + ) { final formattedValue = textEditingValue.format(); if (currentTextEditingValue == formattedValue) { return; @@ -64,11 +68,12 @@ class NonDeltaTextInputService extends TextInputService with TextInputClient { _textInputConnection!.attached == false) { _textInputConnection = TextInput.attach( this, - const TextInputConfiguration( + TextInputConfiguration( enableDeltaModel: false, inputType: TextInputType.multiline, textCapitalization: TextCapitalization.sentences, inputAction: TextInputAction.newline, + keyboardAppearance: Theme.of(context).brightness, ), ); } diff --git a/lib/src/editor/editor_component/service/keyboard_service_widget.dart b/lib/src/editor/editor_component/service/keyboard_service_widget.dart index dbb2a5b84..4adbf19b0 100644 --- a/lib/src/editor/editor_component/service/keyboard_service_widget.dart +++ b/lib/src/editor/editor_component/service/keyboard_service_widget.dart @@ -198,7 +198,10 @@ class KeyboardServiceWidgetState extends State void _attachTextInputService(Selection selection) { final textEditingValue = _getCurrentTextEditingValue(selection); if (textEditingValue != null) { - textInputService.attach(textEditingValue); + textInputService.attach( + textEditingValue, + context, + ); // disable shortcuts when the IME active enableShortcuts = textEditingValue.composing == TextRange.empty; } else { From 2a7cd9a2cfd1ae95f72241a48bc4b2fd6902c8f8 Mon Sep 17 00:00:00 2001 From: "Lucas.Xu" Date: Fri, 30 Jun 2023 16:37:43 +0800 Subject: [PATCH 2/2] feat: add dark theme for example project --- example/lib/main.dart | 5 +- .../service/ime/delta_input_impl.dart | 2 + .../service/ime/delta_input_service.dart | 61 ++++--------------- .../service/ime/non_delta_input_service.dart | 19 +++--- .../service/ime/text_input_service.dart | 44 +++++++++++++ .../service/keyboard_service_widget.dart | 9 ++- test/new/infra/testable_editor.dart | 3 +- 7 files changed, 79 insertions(+), 64 deletions(-) create mode 100644 lib/src/editor/editor_component/service/ime/text_input_service.dart diff --git a/example/lib/main.dart b/example/lib/main.dart index babf03a57..a72aab691 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -24,10 +24,7 @@ class MyApp extends StatelessWidget { supportedLocales: const [Locale('en', 'US')], debugShowCheckedModeBanner: false, home: const MyHomePage(title: 'AppFlowyEditor Example'), - theme: ThemeData( - colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), - useMaterial3: true, - ), + theme: ThemeData.light(useMaterial3: true), ); } } diff --git a/lib/src/editor/editor_component/service/ime/delta_input_impl.dart b/lib/src/editor/editor_component/service/ime/delta_input_impl.dart index ba1a9b3fc..dc050448f 100644 --- a/lib/src/editor/editor_component/service/ime/delta_input_impl.dart +++ b/lib/src/editor/editor_component/service/ime/delta_input_impl.dart @@ -3,3 +3,5 @@ export 'delta_input_on_delete_impl.dart'; export 'delta_input_on_insert_impl.dart'; export 'delta_input_on_non_text_update_impl.dart'; export 'delta_input_on_replace_impl.dart'; +export 'non_delta_input_service.dart'; +export 'text_input_service.dart'; diff --git a/lib/src/editor/editor_component/service/ime/delta_input_service.dart b/lib/src/editor/editor_component/service/ime/delta_input_service.dart index 8ce8ca0e0..fc7e1a308 100644 --- a/lib/src/editor/editor_component/service/ime/delta_input_service.dart +++ b/lib/src/editor/editor_component/service/ime/delta_input_service.dart @@ -1,48 +1,9 @@ import 'dart:math'; import 'package:appflowy_editor/appflowy_editor.dart'; -import 'package:flutter/material.dart'; +import 'package:appflowy_editor/src/editor/editor_component/service/ime/text_input_service.dart'; import 'package:flutter/services.dart'; -abstract class TextInputService { - TextInputService({ - required this.onInsert, - required this.onDelete, - required this.onReplace, - required this.onNonTextUpdate, - required this.onPerformAction, - }); - - Future Function(TextEditingDeltaInsertion insertion) onInsert; - Future Function(TextEditingDeltaDeletion deletion) onDelete; - Future Function(TextEditingDeltaReplacement replacement) onReplace; - Future Function(TextEditingDeltaNonTextUpdate nonTextUpdate) - onNonTextUpdate; - Future Function(TextInputAction action) onPerformAction; - - TextRange? get composingTextRange; - bool get attached; - - void updateCaretPosition(Size size, Matrix4 transform, Rect rect); - - /// Updates the [TextEditingValue] of the text currently being edited. - /// - /// Note that if there are IME-related requirements, - /// please config `composing` value within [TextEditingValue] - /// - /// [BuildContext] is used to get current keyboard appearance(light or dark) - void attach(TextEditingValue textEditingValue, BuildContext context); - - /// Applies insertion, deletion and replacement - /// to the text currently being edited. - /// - /// For more information, please check [TextEditingDelta]. - Future apply(List deltas); - - /// Closes the editing state of the text currently being edited. - void close(); -} - class DeltaTextInputService extends TextInputService with DeltaTextInputClient { DeltaTextInputService({ required super.onInsert, @@ -85,18 +46,22 @@ class DeltaTextInputService extends TextInputService with DeltaTextInputClient { } @override - void attach(TextEditingValue textEditingValue, BuildContext context) { + void attach( + TextEditingValue textEditingValue, + TextInputConfiguration configuration, + ) { if (_textInputConnection == null || _textInputConnection!.attached == false) { _textInputConnection = TextInput.attach( this, - TextInputConfiguration( - enableDeltaModel: true, - inputType: TextInputType.multiline, - textCapitalization: TextCapitalization.sentences, - inputAction: TextInputAction.newline, - keyboardAppearance: Theme.of(context).brightness, - ), + configuration, + // TextInputConfiguration( + // enableDeltaModel: true, + // inputType: TextInputType.multiline, + // textCapitalization: TextCapitalization.sentences, + // inputAction: TextInputAction.newline, + // keyboardAppearance: Theme.of(context).brightness, + // ), ); } diff --git a/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart b/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart index 7e2966599..c2dd27353 100644 --- a/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart +++ b/lib/src/editor/editor_component/service/ime/non_delta_input_service.dart @@ -2,7 +2,7 @@ import 'dart:math'; import 'package:appflowy_editor/appflowy_editor.dart'; import 'package:appflowy_editor/src/editor/editor_component/service/ime/text_diff.dart'; -import 'package:flutter/material.dart'; +import 'package:appflowy_editor/src/editor/editor_component/service/ime/text_input_service.dart'; import 'package:flutter/services.dart'; class NonDeltaTextInputService extends TextInputService with TextInputClient { @@ -57,7 +57,7 @@ class NonDeltaTextInputService extends TextInputService with TextInputClient { @override void attach( TextEditingValue textEditingValue, - BuildContext context, + TextInputConfiguration configuration, ) { final formattedValue = textEditingValue.format(); if (currentTextEditingValue == formattedValue) { @@ -68,13 +68,14 @@ class NonDeltaTextInputService extends TextInputService with TextInputClient { _textInputConnection!.attached == false) { _textInputConnection = TextInput.attach( this, - TextInputConfiguration( - enableDeltaModel: false, - inputType: TextInputType.multiline, - textCapitalization: TextCapitalization.sentences, - inputAction: TextInputAction.newline, - keyboardAppearance: Theme.of(context).brightness, - ), + configuration, + // TextInputConfiguration( + // enableDeltaModel: false, + // inputType: TextInputType.multiline, + // textCapitalization: TextCapitalization.sentences, + // inputAction: TextInputAction.newline, + // keyboardAppearance: Theme.of(context).brightness, + // ), ); } diff --git a/lib/src/editor/editor_component/service/ime/text_input_service.dart b/lib/src/editor/editor_component/service/ime/text_input_service.dart new file mode 100644 index 000000000..e04d85b30 --- /dev/null +++ b/lib/src/editor/editor_component/service/ime/text_input_service.dart @@ -0,0 +1,44 @@ +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; + +abstract class TextInputService { + TextInputService({ + required this.onInsert, + required this.onDelete, + required this.onReplace, + required this.onNonTextUpdate, + required this.onPerformAction, + }); + + Future Function(TextEditingDeltaInsertion insertion) onInsert; + Future Function(TextEditingDeltaDeletion deletion) onDelete; + Future Function(TextEditingDeltaReplacement replacement) onReplace; + Future Function(TextEditingDeltaNonTextUpdate nonTextUpdate) + onNonTextUpdate; + Future Function(TextInputAction action) onPerformAction; + + TextRange? get composingTextRange; + bool get attached; + + void updateCaretPosition(Size size, Matrix4 transform, Rect rect); + + /// Updates the [TextEditingValue] of the text currently being edited. + /// + /// Note that if there are IME-related requirements, + /// please config `composing` value within [TextEditingValue] + /// + /// [BuildContext] is used to get current keyboard appearance(light or dark) + void attach( + TextEditingValue textEditingValue, + TextInputConfiguration configuration, + ); + + /// Applies insertion, deletion and replacement + /// to the text currently being edited. + /// + /// For more information, please check [TextEditingDelta]. + Future apply(List deltas); + + /// Closes the editing state of the text currently being edited. + void close(); +} diff --git a/lib/src/editor/editor_component/service/keyboard_service_widget.dart b/lib/src/editor/editor_component/service/keyboard_service_widget.dart index 4adbf19b0..5bfbbc858 100644 --- a/lib/src/editor/editor_component/service/keyboard_service_widget.dart +++ b/lib/src/editor/editor_component/service/keyboard_service_widget.dart @@ -1,5 +1,4 @@ import 'package:appflowy_editor/appflowy_editor.dart'; -import 'package:appflowy_editor/src/editor/editor_component/service/ime/non_delta_input_service.dart'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; @@ -200,7 +199,13 @@ class KeyboardServiceWidgetState extends State if (textEditingValue != null) { textInputService.attach( textEditingValue, - context, + TextInputConfiguration( + enableDeltaModel: false, + inputType: TextInputType.multiline, + textCapitalization: TextCapitalization.sentences, + inputAction: TextInputAction.newline, + keyboardAppearance: Theme.of(context).brightness, + ), ); // disable shortcuts when the IME active enableShortcuts = textEditingValue.composing == TextRange.empty; diff --git a/test/new/infra/testable_editor.dart b/test/new/infra/testable_editor.dart index 094701201..f953df14c 100644 --- a/test/new/infra/testable_editor.dart +++ b/test/new/infra/testable_editor.dart @@ -1,4 +1,5 @@ import 'package:appflowy_editor/appflowy_editor.dart'; +import 'package:appflowy_editor/src/editor/editor_component/service/ime/text_input_service.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:flutter_localizations/flutter_localizations.dart'; @@ -81,7 +82,7 @@ class TestableEditor { home: Scaffold( body: wrapper == null ? editor - : wrapper!( + : wrapper( editor, ), ),