Support selecting all text on triple click

Use case

On native platforms and browsers using a triple click (with a mouse) on text in a textfield one selects all text in the textfield. Flutter doesn't do this, but rather deselects the selected word.

Proposal

Flutter should support this to match native platforms and browsers.

@justinmc

CC @justinmc

Thanks for pointing this out! I agree Flutter should support this.

Two details I want to call attention to:

I don't see native Android apps producing this behavior. I tried on a physical Pixel 2 running Android 10. Does anyone see this on Android?
On native iOS and web, it appears to select the entire paragraph, but not all text.

I noticed this within a few minutes of playing with a flutter app on my iPhone, so I'd say it's a significant issue.

Can't speak for Android but as you say the usual behaviour on iOS is to select the paragraph.

I also note that a double tap followed by a drag doesn't replicate the native iOS behaviour. In native apps, this gesture selects a block of text. I've added this as a separate issue: #64550

@mdebbar

/cc @mdebbar

Triple click doesn't work as expected on flutter web macOS (select all in element?)

I’ll be taking this on as one of my priorities. It depends on a refactor but I am working on it. I’ll post updates here as I progress.

@Renzo-Olivares

I’ll be taking this on as one of my priorities. It depends on a refactor but I am working on it. I’ll post updates here as I progress.

Hey, @Renzo-Olivares I would like to hear about your progress so far?

@umitk34

Hey @umitk34 I'm currently working on a proof of concept and design doc and will post it here as soon as it's ready. Thank you for the interest.

@Renzo-Olivares

@Renzo-Olivares Any update on this?

@djsjr

Hey @djsjr, thanks for your interest in this project. I have a proof of concept PR as well as a design doc here. I'm currently working on some related work #109573 which is building a GestureRecognizer that can handle taps and drags for text selection (e.g. double tap to drag, triple tap to drag). Once that is done, I will continue moving this project forward.

@djsjr

Hey @djsjr, thanks for your interest in this project. I have a proof of concept PR as well as a design doc here. I'm currently working on some related work #109573 which is building a GestureRecognizer that can handle taps and drags for text selection (e.g. double tap to drag, triple tap to drag). Once that is done, I will continue moving this project forward.

If double tap/triple tap enabled, there is a delay issue (#110300) which makes user experience awful.
Does Flutter have the plan to polish these basic controls thoroughly according to the desktop usage habits?
It is useless to just bring all the mobile controls to the desktop without making any changes.
Desktop users use mouse frequently, click(double/triple)/scroll events are important.

@ngugcx

@ngugcx I am working on a new TapAndDragGestureRecognizer, where that delay is not an issue.

A solution to this issue

bool _canSelectAll = false;
final TextEditingController _controller = TextEditingController();
Timer? _selectAllTimer;

void _onTap() {
  _selectAllTimer?.cancel();
  _selectAllTimer = null;

  if (_controller.selection.isCollapsed) {
    _canSelectAll = true;
    _selectAllTimer = Timer(const Duration(milliseconds: 500), () {
      _canSelectAll = false;
    });
    return;
  }

  if (!_canSelectAll) return;

  final selection = TextSelection(
    baseOffset: 0,
    extentOffset: _controller.document.length,
  );

  _controller.selection = selection;
  _canSelectAll = false;

  return;
}



@override
Widget build(BuildContext context) {
  return TextField(
    onTap: _onTap,
  );
}

@Renzo-Olivares

Hi @Renzo-Olivares! Any chance there has been some progress on this? Many thanks!! 🙏

@bionascu

Sure thing @bionascu!

In terms of just closing this issue "Supporting select all text on triple click" I am currently working on introducing a ParagraphBoundary subclass in #116549 that will allow for this behavior. That PR is centered around keyboard actions but the boundary subclass will be reusable. Once that is merged I'll start another PR to add triple tap to select for tap/clicks and that should close this issue.

Updates on other touch/mouse text gestures:

As of recent #117502 was merged that added support for double tap/click + drag to select text word by word. It also added support for dragging to move the cursor on mobile platforms.

#101151 is the larger project that aims to make these tap/click gestures overridable. This is still in progress and was waiting on #117502 to get merged.

@Renzo-Olivares

@Renzo-Olivares , Hi!
I faced this issue even in the latest release, did it fixed somewhere else?

@reza00farjam

@reza00farjam Hello, it is not fixed in the most recent stable release but it is fixed in master.

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Navigation Menu

Repository navigation

Support selecting all text on triple click #63576

Use case

Proposal

27 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Support selecting all text on triple click #63576

Description

Use case

Proposal

Activity

HansMuller commented on Aug 12, 2020

justinmc commented on Aug 12, 2020

dave commented on Aug 25, 2020

dave commented on Aug 25, 2020

ferhatb commented on Dec 17, 2020

lukepighetti commented on Feb 13, 2021

27 remaining items

Renzo-Olivares commented on Mar 17, 2022

umitk34 commented on May 19, 2022

Renzo-Olivares commented on May 19, 2022

djsjr commented on Aug 21, 2022

Renzo-Olivares commented on Aug 23, 2022

ngugcx commented on Aug 30, 2022

Renzo-Olivares commented on Sep 7, 2022

seel-channel commented on Oct 21, 2022

bionascu commented on Jan 5, 2023

Renzo-Olivares commented on Jan 5, 2023

reza00farjam commented on Apr 5, 2023

Renzo-Olivares commented on Apr 6, 2023

github-actions commented on Apr 20, 2023

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions