Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Show context menu on desktop #179

Merged
merged 7 commits into from
Dec 7, 2023
Merged

Show context menu on desktop #179

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
bd3e219
Show context menu on desktop
Amir-P Dec 1, 2023
9863a64
Fix context menu anchor
Amir-P Dec 3, 2023
735a6a3
Add tests
Amir-P Dec 4, 2023
f727706
Add more tests
Amir-P Dec 4, 2023
2a588c6
Add more tests
Amir-P Dec 6, 2023
e0ff5d5
Update tests
Amir-P Dec 6, 2023
99bb395
Remove unused codes
Amir-P Dec 6, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 14 additions & 62 deletions packages/fleather/lib/src/rendering/editor.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,12 @@ abstract class RenderAbstractEditor implements TextLayoutMetrics {
Offset lastBoundedOffset, TextPosition lastTextPosition,
{double? resetLerpValue});

/// Tracks the position of a secondary tap event.
///
/// Should be called before attempting to change the selection based on the
/// position of a secondary tap.
void handleSecondaryTapDown(TapDownDetails details);

/// If [ignorePointer] is false (the default) then this method is called by
/// the internal gesture recognizer's [TapGestureRecognizer.onTapDown]
/// callback.
Expand Down Expand Up @@ -140,7 +146,6 @@ class RenderEditor extends RenderEditableContainerBox
}) : _document = document,
_hasFocus = hasFocus,
_selection = selection,
_extendSelectionOrigin = selection,
_startHandleLayerLink = startHandleLayerLink,
_endHandleLayerLink = endHandleLayerLink,
_cursorController = cursorController,
Expand Down Expand Up @@ -187,6 +192,9 @@ class RenderEditor extends RenderEditableContainerBox
markNeedsLayout();
}

Offset? _lastSecondaryTapDownPosition;
Offset? get lastSecondaryTapDownPosition => _lastSecondaryTapDownPosition;

/// The region of text that is selected, if any.
///
/// The caret position is represented by a collapsed selection.
Expand All @@ -200,18 +208,8 @@ class RenderEditor extends RenderEditableContainerBox
if (_selection == value) return;
_selection = value;
markNeedsPaint();

if (!_shiftPressed && !_isDragging) {
// Only update extend selection origin if Shift key is not pressed and
// user is not dragging selection.
_extendSelectionOrigin = _selection;
}
}

bool get _shiftPressed =>
RawKeyboard.instance.keysPressed.contains(LogicalKeyboardKey.shiftLeft) ||
RawKeyboard.instance.keysPressed.contains(LogicalKeyboardKey.shiftLeft);

/// The [LayerLink] of start selection handle.
///
/// [RenderEditable] is responsible for calculating the [Offset] of this
Expand Down Expand Up @@ -413,33 +411,15 @@ class RenderEditor extends RenderEditableContainerBox

Offset? _lastTapDownPosition;

// Used on Desktop (mouse and keyboard enabled platforms) as base offset
// for extending selection, either with combination of `Shift` + Click or
// by dragging
TextSelection? _extendSelectionOrigin;

@override
void handleTapDown(TapDownDetails details) {
void handleSecondaryTapDown(TapDownDetails details) {
_lastTapDownPosition = details.globalPosition;
_lastSecondaryTapDownPosition = details.globalPosition;
}

bool _isDragging = false;

void handleDragStart(DragStartDetails details) {
_isDragging = true;

final newSelection = selectPositionAt(
from: details.globalPosition,
cause: SelectionChangedCause.drag,
);

if (newSelection == null) return;
// Make sure to remember the origin for extend selection.
_extendSelectionOrigin = newSelection;
}

void handleDragEnd(DragEndDetails details) {
_isDragging = false;
@override
void handleTapDown(TapDownDetails details) {
_lastTapDownPosition = details.globalPosition;
}

/// Called when the selection changes.
Expand Down Expand Up @@ -472,34 +452,6 @@ class RenderEditor extends RenderEditableContainerBox
);
}

/// Extends current selection to the position closest to specified offset.
void extendSelection(Offset to, {required SelectionChangedCause cause}) {
/// The below logic does not exactly match the native version because
/// we do not allow swapping of base and extent positions.
assert(_extendSelectionOrigin != null);
final position = getPositionForOffset(to);

if (position.offset < _extendSelectionOrigin!.baseOffset) {
_handleSelectionChange(
TextSelection(
baseOffset: position.offset,
extentOffset: _extendSelectionOrigin!.extentOffset,
affinity: selection.affinity,
),
cause,
);
} else if (position.offset > _extendSelectionOrigin!.extentOffset) {
_handleSelectionChange(
TextSelection(
baseOffset: _extendSelectionOrigin!.baseOffset,
extentOffset: position.offset,
affinity: selection.affinity,
),
cause,
);
}
}

@override
void selectWordEdge({required SelectionChangedCause cause}) {
// _layoutText(minWidth: constraints.minWidth, maxWidth: constraints.maxWidth);
Expand Down
139 changes: 40 additions & 99 deletions packages/fleather/lib/src/widgets/editor.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -260,9 +260,8 @@
@override
GlobalKey<EditorState> get editableTextKey => widget.editorKey ?? _editorKey!;

// TODO: Add support for forcePress on iOS.
@override
bool get forcePressEnabled => false;
bool get forcePressEnabled => true;

@override
bool get selectionEnabled => widget.enableInteractiveSelection;
Expand Down Expand Up @@ -426,106 +425,28 @@
void onForcePressStart(ForcePressDetails details) {
super.onForcePressStart(details);
if (delegate.selectionEnabled && shouldShowSelectionToolbar) {
editor!.showToolbar();
editor.showToolbar();

Check warning on line 428 in packages/fleather/lib/src/widgets/editor.dart

View check run for this annotation

Codecov / codecov/patch

packages/fleather/lib/src/widgets/editor.dart#L428 

Added line #L428 was not covered by tests
}
}

@override
void onForcePressEnd(ForcePressDetails details) {
// Not required.
}

@override
void onSingleLongTapMoveUpdate(LongPressMoveUpdateDetails details) {
if (delegate.selectionEnabled) {
switch (Theme.of(_state.context).platform) {
case TargetPlatform.iOS:
case TargetPlatform.macOS:
renderEditor!.selectPositionAt(
from: details.globalPosition,
cause: SelectionChangedCause.longPress,
);
break;
case TargetPlatform.android:
case TargetPlatform.fuchsia:
case TargetPlatform.linux:
case TargetPlatform.windows:
renderEditor!.selectWordsInRange(
from: details.globalPosition - details.offsetFromOrigin,
to: details.globalPosition,
cause: SelectionChangedCause.longPress,
);
break;
}
}
}

bool isShiftClick(PointerDeviceKind deviceKind) {
final pressed = RawKeyboard.instance.keysPressed;
return deviceKind == PointerDeviceKind.mouse &&
(pressed.contains(LogicalKeyboardKey.shiftLeft) ||
pressed.contains(LogicalKeyboardKey.shiftRight));
}

@override
void onSingleTapUp(TapUpDetails details) {
editor!.hideToolbar();

if (delegate.selectionEnabled) {
switch (Theme.of(_state.context).platform) {
case TargetPlatform.iOS:
case TargetPlatform.macOS:
switch (details.kind) {
case PointerDeviceKind.mouse:
case PointerDeviceKind.stylus:
case PointerDeviceKind.invertedStylus:
// Precise devices should place the cursor at a precise position.
// If `Shift` key is pressed then extend current selection instead.
if (isShiftClick(details.kind)) {
renderEditor!.extendSelection(details.globalPosition,
cause: SelectionChangedCause.tap);
} else {
renderEditor!.selectPosition(cause: SelectionChangedCause.tap);
}
break;
case PointerDeviceKind.touch:
case PointerDeviceKind.trackpad:
case PointerDeviceKind.unknown:
// On macOS/iOS/iPadOS a touch tap places the cursor at the edge
// of the word.
renderEditor!.selectWordEdge(cause: SelectionChangedCause.tap);
break;
}
break;
case TargetPlatform.android:
case TargetPlatform.fuchsia:
case TargetPlatform.linux:
case TargetPlatform.windows:
renderEditor!.selectPosition(cause: SelectionChangedCause.tap);
break;
}
}
void onSingleTapUp(TapDragUpDetails details) {
super.onSingleTapUp(details);
_state._requestKeyboard();
// if (_state.widget.onTap != null)
// _state.widget.onTap();
}

@override
void onSingleLongTapStart(LongPressStartDetails details) {
super.onSingleLongTapStart(details);
if (delegate.selectionEnabled) {
switch (Theme.of(_state.context).platform) {
case TargetPlatform.iOS:
case TargetPlatform.macOS:
renderEditor!.selectPositionAt(
from: details.globalPosition,
cause: SelectionChangedCause.longPress,
);
break;
case TargetPlatform.android:
case TargetPlatform.fuchsia:
case TargetPlatform.linux:
case TargetPlatform.windows:
renderEditor!.selectWord(cause: SelectionChangedCause.longPress);
Feedback.forLongPress(_state.context);
break;
}
Expand Down Expand Up @@ -770,6 +691,8 @@

bool showToolbar();

void toggleToolbar([bool hideHandles = true]);

void requestKeyboard();

FocusNode get effectiveFocusNode;
Expand Down Expand Up @@ -883,6 +806,17 @@
return true;
}

@override
void toggleToolbar([bool hideHandles = true]) {
final selectionOverlay = _selectionOverlay ??= _createSelectionOverlay();

if (selectionOverlay.toolbarIsVisible) {
hideToolbar(hideHandles);
} else {
showToolbar();
}
}

/// Copy current selection to [Clipboard].
@override
void copySelection(SelectionChangedCause cause) {
Expand Down Expand Up @@ -1139,21 +1073,7 @@
_selectionOverlay = null;
} else {
if (_selectionOverlay == null) {
_selectionOverlay = EditorTextSelectionOverlay(
clipboardStatus: clipboardStatus,
context: context,
value: textEditingValue,
debugRequiredFor: widget,
toolbarLayerLink: _toolbarLayerLink,
startHandleLayerLink: _startHandleLayerLink,
endHandleLayerLink: _endHandleLayerLink,
renderObject: renderEditor,
selectionControls: widget.selectionControls,
selectionDelegate: this,
dragStartBehavior: DragStartBehavior.start,
contextMenuBuilder: (context) =>
widget.contextMenuBuilder(context, this),
);
_selectionOverlay = _createSelectionOverlay();
} else {
_selectionOverlay!.update(textEditingValue);
}
Expand All @@ -1180,6 +1100,23 @@
}
}

EditorTextSelectionOverlay _createSelectionOverlay() {
return EditorTextSelectionOverlay(
clipboardStatus: clipboardStatus,
context: context,
value: textEditingValue,
debugRequiredFor: widget,
toolbarLayerLink: _toolbarLayerLink,
startHandleLayerLink: _startHandleLayerLink,
endHandleLayerLink: _endHandleLayerLink,
renderObject: renderEditor,
selectionControls: widget.selectionControls,
selectionDelegate: this,
dragStartBehavior: DragStartBehavior.start,
contextMenuBuilder: (context) => widget.contextMenuBuilder(context, this),
);
}

void _handleFocusChanged() {
openOrCloseConnection();
_cursorController.startOrStopCursorTimerIfNeeded(
Expand Down Expand Up @@ -1612,6 +1549,10 @@
/// Returns the anchor points for the default context menu.
@override
TextSelectionToolbarAnchors get contextMenuAnchors {
if (renderEditor.lastSecondaryTapDownPosition != null) {
return TextSelectionToolbarAnchors(
primaryAnchor: renderEditor.lastSecondaryTapDownPosition!);
}
final selection = textEditingValue.selection;
// Find the horizontal midpoint, just above the selected text.
final List<TextSelectionPoint> endpoints =
Expand Down
Loading