From fcb09e96367259d9a1951dad97dcc1141b3e3b9d Mon Sep 17 00:00:00 2001 From: "Lucas.Xu" Date: Mon, 25 Jul 2022 20:18:14 +0800 Subject: [PATCH] feat: typo and document --- .../flowy_editor/example/lib/main.dart | 17 +++++++-- .../example/lib/plugin/image_node_widget.dart | 6 ++-- .../lib/plugin/selected_text_node_widget.dart | 6 ++-- .../selection/floating_shortcut_widget.dart | 12 +++---- ...idget.dart => flowy_selection_widget.dart} | 0 .../lib/render/selection/selectable.dart | 36 +++++++++++++------ .../lib/service/editor_service.dart | 8 ++--- .../service/floating_shortcut_service.dart | 22 ++++++------ .../arrow_keys_handler.dart | 4 +-- .../delete_single_text_node_handler.dart | 2 +- .../shortcut_handler.dart | 2 +- .../lib/service/selection_service.dart | 8 ++--- .../flowy_editor/lib/service/service.dart | 8 ++--- 13 files changed, 80 insertions(+), 51 deletions(-) rename frontend/app_flowy/packages/flowy_editor/lib/render/selection/{selection_widget.dart => flowy_selection_widget.dart} (100%) diff --git a/frontend/app_flowy/packages/flowy_editor/example/lib/main.dart b/frontend/app_flowy/packages/flowy_editor/example/lib/main.dart index 6764c2faf1..9cc4d8c536 100644 --- a/frontend/app_flowy/packages/flowy_editor/example/lib/main.dart +++ b/frontend/app_flowy/packages/flowy_editor/example/lib/main.dart @@ -97,11 +97,22 @@ class _MyHomePageState extends State { return FlowyEditor( editorState: _editorState, keyEventHandler: const [], - shortCuts: [ + shortcuts: [ // TODO: this won't work, just a example for now. { - 'heading': (editorState, eventName) => - debugPrint('shortcut => $eventName') + 'h1': (editorState, eventName) { + debugPrint('shortcut => $eventName'); + final selectedNodes = editorState.selectedNodes; + if (selectedNodes.isEmpty) { + return; + } + final textNode = selectedNodes.first as TextNode; + TransactionBuilder(editorState) + ..formatText(textNode, 0, textNode.toRawString().length, { + 'heading': 'h1', + }) + ..commit(); + } }, { 'bold': (editorState, eventName) => diff --git a/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/image_node_widget.dart b/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/image_node_widget.dart index 193cc879c9..8a9c96b22e 100644 --- a/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/image_node_widget.dart +++ b/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/image_node_widget.dart @@ -52,7 +52,7 @@ class __ImageNodeWidgetState extends State<_ImageNodeWidget> with Selectable { } @override - TextSelection? getTextSelection() { + TextSelection? getCurrentTextSelection() { return null; } @@ -62,12 +62,12 @@ class __ImageNodeWidgetState extends State<_ImageNodeWidget> with Selectable { } @override - Offset getLeftOfOffset() { + Offset getBackwardOffset() { return Offset.zero; } @override - Offset getRightOfOffset() { + Offset getForwardOffset() { return Offset.zero; } diff --git a/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/selected_text_node_widget.dart b/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/selected_text_node_widget.dart index d827fdfde8..b234ecd967 100644 --- a/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/selected_text_node_widget.dart +++ b/frontend/app_flowy/packages/flowy_editor/example/lib/plugin/selected_text_node_widget.dart @@ -100,7 +100,7 @@ class _SelectedTextNodeWidgetState extends State<_SelectedTextNodeWidget> } @override - TextSelection? getTextSelection() { + TextSelection? getCurrentTextSelection() { return _textSelection; } @@ -111,7 +111,7 @@ class _SelectedTextNodeWidgetState extends State<_SelectedTextNodeWidget> } @override - Offset getLeftOfOffset() { + Offset getBackwardOffset() { final textSelection = _textSelection; if (textSelection != null) { final leftTextSelection = TextSelection.collapsed( @@ -123,7 +123,7 @@ class _SelectedTextNodeWidgetState extends State<_SelectedTextNodeWidget> } @override - Offset getRightOfOffset() { + Offset getForwardOffset() { final textSelection = _textSelection; if (textSelection != null) { final leftTextSelection = TextSelection.collapsed( diff --git a/frontend/app_flowy/packages/flowy_editor/lib/render/selection/floating_shortcut_widget.dart b/frontend/app_flowy/packages/flowy_editor/lib/render/selection/floating_shortcut_widget.dart index b91ed19fe2..9fbbbbcb01 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/render/selection/floating_shortcut_widget.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/render/selection/floating_shortcut_widget.dart @@ -1,9 +1,9 @@ import 'package:flowy_editor/flowy_editor.dart'; import 'package:flutter/material.dart'; -typedef FloatingShortCutHandler = void Function( +typedef FloatingShortcutHandler = void Function( EditorState editorState, String eventName); -typedef FloatingShortCuts = List>; +typedef FloatingShortcuts = List>; class FloatingShortcutWidget extends StatelessWidget { const FloatingShortcutWidget({ @@ -17,11 +17,11 @@ class FloatingShortcutWidget extends StatelessWidget { final EditorState editorState; final LayerLink layerLink; final Rect rect; - final FloatingShortCuts floatingShortcuts; + final FloatingShortcuts floatingShortcuts; List get _shortcutNames => floatingShortcuts.map((shortcut) => shortcut.keys.first).toList(); - List get _shortcutHandlers => + List get _shortcutHandlers => floatingShortcuts.map((shortcut) => shortcut.values.first).toList(); @override @@ -38,7 +38,7 @@ class FloatingShortcutWidget extends StatelessWidget { itemCount: floatingShortcuts.length, itemBuilder: ((context, index) { final name = _shortcutNameInIndex(index); - final handler = _shortCutHandlerInIndex(index); + final handler = _shortcutHandlerInIndex(index); return Card( child: GestureDetector( onTap: () => handler(editorState, name), @@ -53,6 +53,6 @@ class FloatingShortcutWidget extends StatelessWidget { } String _shortcutNameInIndex(int index) => _shortcutNames[index]; - FloatingShortCutHandler _shortCutHandlerInIndex(int index) => + FloatingShortcutHandler _shortcutHandlerInIndex(int index) => _shortcutHandlers[index]; } diff --git a/frontend/app_flowy/packages/flowy_editor/lib/render/selection/selection_widget.dart b/frontend/app_flowy/packages/flowy_editor/lib/render/selection/flowy_selection_widget.dart similarity index 100% rename from frontend/app_flowy/packages/flowy_editor/lib/render/selection/selection_widget.dart rename to frontend/app_flowy/packages/flowy_editor/lib/render/selection/flowy_selection_widget.dart diff --git a/frontend/app_flowy/packages/flowy_editor/lib/render/selection/selectable.dart b/frontend/app_flowy/packages/flowy_editor/lib/render/selection/selectable.dart index 098c246569..6fc51049a1 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/render/selection/selectable.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/render/selection/selectable.dart @@ -2,24 +2,40 @@ import 'package:flutter/material.dart'; /// mixin Selectable on State { - /// Returns a [Rect] list for overlay. - /// [start] and [end] are global offsets. - /// The return result must be an local offset. + /// Returns a [List] of the [Rect] selection sorrounded by start and end + /// in current widget. + /// + /// [start] and [end] are the offsets under the global coordinate system. + /// + /// The return result must be a [List] of the [Rect] + /// under the local coordinate system. List getSelectionRectsInRange(Offset start, Offset end); - /// Returns a [Rect] for cursor. - /// The return result must be an local offset. + /// Returns a [Rect] for the offset in current widget. + /// + /// [start] is the offset of the global coordination system. + /// + /// The return result must be an offset of the local coordinate system. Rect getCursorRect(Offset start); - /// Returns one unit offset to the left of the offset - Offset getLeftOfOffset(/* Cause */); + /// Returns a backward offset of the current offset based on the cause. + Offset getBackwardOffset(/* Cause */); - /// Returns one unit offset to the right of the offset - Offset getRightOfOffset(/* Cause */); + /// Returns a forward offset of the current offset based on the cause. + Offset getForwardOffset(/* Cause */); /// For [TextNode] only. - TextSelection? getTextSelection(); + /// + /// Returns a [TextSelection] or [Null]. + /// + /// Only the widget rendered by [TextNode] need to implement the detail, + /// and the rest can return null. + TextSelection? getCurrentTextSelection(); /// For [TextNode] only. + /// + /// Retruns a [Offset]. + /// Only the widget rendered by [TextNode] need to implement the detail, + /// and the rest can return [Offset.zero]. Offset getOffsetByTextSelection(TextSelection textSelection); } diff --git a/frontend/app_flowy/packages/flowy_editor/lib/service/editor_service.dart b/frontend/app_flowy/packages/flowy_editor/lib/service/editor_service.dart index 0571cf4e03..7cd4eaf708 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/service/editor_service.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/service/editor_service.dart @@ -15,12 +15,12 @@ class FlowyEditor extends StatefulWidget { Key? key, required this.editorState, required this.keyEventHandler, - required this.shortCuts, + required this.shortcuts, }) : super(key: key); final EditorState editorState; final List keyEventHandler; - final FloatingShortCuts shortCuts; + final FloatingShortcuts shortcuts; @override State createState() => _FlowyEditorState(); @@ -44,11 +44,11 @@ class _FlowyEditorState extends State { ...widget.keyEventHandler, ], editorState: editorState, - child: FloatingShortCut( + child: FloatingShortcut( key: editorState.service.floatingShortcutServiceKey, size: const Size(200, 150), // TODO: support customize size. editorState: editorState, - floatingShortCuts: widget.shortCuts, + floatingShortcuts: widget.shortcuts, child: editorState.build(context), ), ), diff --git a/frontend/app_flowy/packages/flowy_editor/lib/service/floating_shortcut_service.dart b/frontend/app_flowy/packages/flowy_editor/lib/service/floating_shortcut_service.dart index ed1a6a4528..774d906acc 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/service/floating_shortcut_service.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/service/floating_shortcut_service.dart @@ -1,33 +1,35 @@ -import 'package:flowy_editor/document/node.dart'; import 'package:flowy_editor/flowy_editor.dart'; import 'package:flowy_editor/render/selection/floating_shortcut_widget.dart'; import 'package:flutter/material.dart'; -mixin FlowyFloatingShortCutService { +mixin FlowyFloatingShortcutService { + /// Show the floating shortcut widget beside the offset. void showInOffset(Offset offset, LayerLink layerLink); + + /// Hide the floating shortcut widget. void hide(); } -class FloatingShortCut extends StatefulWidget { - const FloatingShortCut({ +class FloatingShortcut extends StatefulWidget { + const FloatingShortcut({ Key? key, required this.size, required this.editorState, - required this.floatingShortCuts, + required this.floatingShortcuts, required this.child, }) : super(key: key); final Size size; final EditorState editorState; final Widget child; - final FloatingShortCuts floatingShortCuts; + final FloatingShortcuts floatingShortcuts; @override - State createState() => _FloatingShortCutState(); + State createState() => _FloatingShortcutState(); } -class _FloatingShortCutState extends State - with FlowyFloatingShortCutService { +class _FloatingShortcutState extends State + with FlowyFloatingShortcutService { OverlayEntry? _floatintShortcutOverlay; @override @@ -38,7 +40,7 @@ class _FloatingShortCutState extends State editorState: widget.editorState, layerLink: layerLink, rect: offset.translate(10, 0) & widget.size, - floatingShortcuts: widget.floatingShortCuts), + floatingShortcuts: widget.floatingShortcuts), ); Overlay.of(context)?.insert(_floatintShortcutOverlay!); } diff --git a/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/arrow_keys_handler.dart b/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/arrow_keys_handler.dart index 4de5b61968..3049f54453 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/arrow_keys_handler.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/arrow_keys_handler.dart @@ -24,9 +24,9 @@ FlowyKeyEventHandler arrowKeysHandler = (editorState, event) { final selectable = node?.key?.currentState?.unwrapOrNull(); Offset? offset; if (event.logicalKey == LogicalKeyboardKey.arrowLeft) { - offset = selectable?.getLeftOfOffset(); + offset = selectable?.getBackwardOffset(); } else if (event.logicalKey == LogicalKeyboardKey.arrowRight) { - offset = selectable?.getRightOfOffset(); + offset = selectable?.getForwardOffset(); } final selectionService = editorState.service.selectionService; if (offset != null) { diff --git a/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/delete_single_text_node_handler.dart b/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/delete_single_text_node_handler.dart index 1358276f47..db12d2bbb2 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/delete_single_text_node_handler.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/delete_single_text_node_handler.dart @@ -17,7 +17,7 @@ FlowyKeyEventHandler deleteSingleTextNodeHandler = (editorState, event) { final node = selectionNodes.first.unwrapOrNull(); final selectable = node?.key?.currentState?.unwrapOrNull(); if (selectable != null) { - final textSelection = selectable.getTextSelection(); + final textSelection = selectable.getCurrentTextSelection(); if (textSelection != null) { if (textSelection.isCollapsed) { /// Three cases: diff --git a/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/shortcut_handler.dart b/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/shortcut_handler.dart index 074e021f79..4e52d1bbe9 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/shortcut_handler.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/service/flowy_key_event_handlers/shortcut_handler.dart @@ -17,7 +17,7 @@ FlowyKeyEventHandler slashShortcutHandler = (editorState, event) { final textNode = selectedNodes.first.unwrapOrNull(); final selectable = textNode?.key?.currentState?.unwrapOrNull(); - final textSelection = selectable?.getTextSelection(); + final textSelection = selectable?.getCurrentTextSelection(); if (textNode != null && selectable != null && textSelection != null) { final offset = selectable.getOffsetByTextSelection(textSelection); final rect = selectable.getCursorRect(offset); diff --git a/frontend/app_flowy/packages/flowy_editor/lib/service/selection_service.dart b/frontend/app_flowy/packages/flowy_editor/lib/service/selection_service.dart index 778e657340..2f4bba86ec 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/service/selection_service.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/service/selection_service.dart @@ -1,5 +1,5 @@ import 'package:flowy_editor/render/selection/cursor_widget.dart'; -import 'package:flowy_editor/render/selection/selection_widget.dart'; +import 'package:flowy_editor/render/selection/flowy_selection_widget.dart'; import 'package:flowy_editor/extensions/object_extensions.dart'; import 'package:flowy_editor/service/floating_shortcut_service.dart'; import 'package:flutter/gestures.dart'; @@ -293,9 +293,9 @@ class _FlowySelectionState extends State } void _clearFloatingShorts() { - final shortCutService = editorState + final shortcutService = editorState .service.floatingShortcutServiceKey.currentState - ?.unwrapOrNull(); - shortCutService?.hide(); + ?.unwrapOrNull(); + shortcutService?.hide(); } } diff --git a/frontend/app_flowy/packages/flowy_editor/lib/service/service.dart b/frontend/app_flowy/packages/flowy_editor/lib/service/service.dart index 8ade6d26be..7833e6d379 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/service/service.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/service/service.dart @@ -14,14 +14,14 @@ class FlowyService { // keyboard service final keyboardServiceKey = GlobalKey(debugLabel: 'flowy_keyboard_service'); - // floating toolbar service + // floating shortcut service final floatingShortcutServiceKey = GlobalKey(debugLabel: 'flowy_floating_shortcut_service'); - FlowyFloatingShortCutService get floatingToolbarService { + FlowyFloatingShortcutService get floatingToolbarService { assert(floatingShortcutServiceKey.currentState != null && floatingShortcutServiceKey.currentState - is FlowyFloatingShortCutService); + is FlowyFloatingShortcutService); return floatingShortcutServiceKey.currentState! - as FlowyFloatingShortCutService; + as FlowyFloatingShortcutService; } }