AppFlowy-IO/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-09-20 07:32:57 +03:00
Code Issues Projects Releases Wiki Activity

Merge pull request #1544 from LucasXu0/fix_1542

Browse Source 
fix: [Bug] Text formatting toolbar disappear under layout
This commit is contained in:
Lucas.Xu 2022-12-07 17:09:06 +08:00 committed by GitHub
commit 681d9028e3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 34 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/app_flowy/packages/appflowy_editor/lib/src/render/toolbar/toolbar_widget.dart
View File

@ -16,12 +16,14 @@ class ToolbarWidget extends StatefulWidget {
required this.layerLink,
required this.offset,
required this.items,
this.aligment = Alignment.topLeft,
}) : super(key: key);
final EditorState editorState;
final LayerLink layerLink;
final Offset offset;
final List<ToolbarItem> items;
final Alignment aligment;
@override
State<ToolbarWidget> createState() => _ToolbarWidgetState();
@ -39,6 +41,7 @@ class _ToolbarWidgetState extends State<ToolbarWidget> with ToolbarMixin {
link: widget.layerLink,
showWhenUnlinked: true,
offset: widget.offset,
followerAnchor: widget.aligment,
child: _buildToolbar(context),
),
);

30
frontend/app_flowy/packages/appflowy_editor/lib/src/service/selection_service.dart
View File

@ -388,9 +388,11 @@ class _AppFlowySelectionState extends State<AppFlowySelection>
// TODO: need to be refactored.
Offset? toolbarOffset;
Alignment? alignment;
LayerLink? layerLink;
final editorOffset =
editorState.renderBox?.localToGlobal(Offset.zero) ?? Offset.zero;
final editorSize = editorState.renderBox?.size ?? Size.zero;
final backwardNodes =
selection.isBackward ? nodes : nodes.reversed.toList(growable: false);
@ -438,10 +440,33 @@ class _AppFlowySelectionState extends State<AppFlowySelection>
// TODO: Need to compute more precise location.
if ((selectionRect.topLeft.dy - editorOffset.dy) <=
baseToolbarOffset.dy) {
toolbarOffset ??= rect.bottomLeft;
if (selectionRect.topLeft.dx <=
editorSize.width / 3.0 + editorOffset.dx) {
toolbarOffset ??= rect.bottomLeft;
alignment ??= Alignment.topLeft;
} else if (selectionRect.topRight.dx >=
editorSize.width * 2.0 / 3.0 + editorOffset.dx) {
toolbarOffset ??= rect.bottomRight;
alignment ??= Alignment.topRight;
} else {
toolbarOffset ??= rect.bottomCenter;
alignment ??= Alignment.topCenter;
}
} else {
toolbarOffset ??= rect.topLeft - baseToolbarOffset;
if (selectionRect.topLeft.dx <=
editorSize.width / 3.0 + editorOffset.dx) {
toolbarOffset ??= rect.topLeft - baseToolbarOffset;
alignment ??= Alignment.topLeft;
} else if (selectionRect.topRight.dx >=
editorSize.width * 2.0 / 3.0 + editorOffset.dx) {
toolbarOffset ??= rect.topRight - baseToolbarOffset;
alignment ??= Alignment.topRight;
} else {
toolbarOffset ??= rect.topCenter - baseToolbarOffset;
alignment ??= Alignment.topCenter;
}
}
layerLink ??= node.layerLink;
final overlay = OverlayEntry(
@ -460,6 +485,7 @@ class _AppFlowySelectionState extends State<AppFlowySelection>
if (toolbarOffset != null && layerLink != null) {
editorState.service.toolbarService?.showInOffset(
toolbarOffset,
alignment!,
layerLink,
);
}

5
frontend/app_flowy/packages/appflowy_editor/lib/src/service/toolbar_service.dart
View File

@ -8,7 +8,7 @@ import 'package:appflowy_editor/src/extensions/object_extensions.dart';
abstract class AppFlowyToolbarService {
/// Show the toolbar widget beside the offset.
void showInOffset(Offset offset, LayerLink layerLink);
void showInOffset(Offset offset, Alignment alignment, LayerLink layerLink);
/// Hide the toolbar widget.
void hide();
@ -37,7 +37,7 @@ class _FlowyToolbarState extends State<FlowyToolbar>
final _toolbarWidgetKey = GlobalKey(debugLabel: '_toolbar_widget');
@override
void showInOffset(Offset offset, LayerLink layerLink) {
void showInOffset(Offset offset, Alignment alignment, LayerLink layerLink) {
hide();
final items = _filterItems(defaultToolbarItems);
if (items.isEmpty) {
@ -50,6 +50,7 @@ class _FlowyToolbarState extends State<FlowyToolbar>
layerLink: layerLink,
offset: offset,
items: items,
aligment: alignment,
),
);
Overlay.of(context)?.insert(_toolbarOverlay!);