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.

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

SelectableText has no selection handle on iOS when long press #59600

Closed
nathanael-h opened this issue Jun 16, 2020 · 13 comments · Fixed by #62072
Closed

SelectableText has no selection handle on iOS when long press #59600

nathanael-h opened this issue Jun 16, 2020 · 13 comments · Fixed by #62072
Assignees
Labels
a: fidelity Matching the OEM platforms better a: typography Text rendering, possibly libtxt f: material design flutter/packages/flutter/material repository. found in release: 1.17 Found to occur in 1.17 found in release: 1.20 Found to occur in 1.20 framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on platform-ios iOS applications specifically

Comments

@nathanael-h
Copy link

Steps to Reproduce

  1. Create a new app with
    flutter create myapp
  2. In the main.dart, replace text with selectabletext :
SelectableText(
   'You have pushed the button this many 
),
  1. Run on Android, long press on the sentence, you can select and there are handles.
  2. Run on iOS, long press on the sentence, you can hit select all, but there is no handles.

Expected results:
I expect to have handles on iOS to select the text I want.

Actual results:
On iOS there is no handle. I can only hit select all.

flutter doctor --verbose

[✓] Flutter (Channel stable, v1.17.3, on Mac OS X 10.14.6 18G4032, locale fr-FR)
    • Flutter version 1.17.3 at /Users/user919727/Downloads/flutter
    • Framework revision b041144f83 (il y a 12 jours), 2020-06-04 09:26:11 -0700
    • Engine revision ee76268252
    • Dart version 2.8.4

 
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
    • Android SDK at /Users/user919727/Library/Android/sdk
    • Platform android-29, build-tools 29.0.3
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_212-release-1586-b4-5784211)
    • All Android licenses accepted.

[!] Xcode - develop for iOS and macOS (Xcode 11.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.3.1, Build version 11C505
    ✗ Xcode requires additional components to be installed in order to run.
      Launch Xcode and install additional required components when prompted or
      run:
        sudo xcodebuild -runFirstLaunch
    • CocoaPods version 1.9.1

[✓] Android Studio (version 3.6)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 46.0.1
    • Dart plugin version 192.8052
    • Java version OpenJDK Runtime Environment (build
      1.8.0_212-release-1586-b4-5784211)

[!] IntelliJ IDEA Community Edition (version 2018.2.6)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • For information about installing plugins, see
      https://flutter.dev/intellij-setup/#installing-the-plugins

[✓] VS Code (version 1.45.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.11.0

[!] Connected device
    ! No devices available

! Doctor found issues in 3 categories.

@TahaTesser
Copy link
Member

Hi @nathanael-h
Running on latest stable, no issues

Code Sample
import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      theme: ThemeData.dark(),
      home: Home(),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Material App Bar'),
      ),
      body: Center(
        child: SelectableText('You have pushed the button this many'),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: () {},
      ),
    );
  }
}

flutter_01

flutter doctor -v
[✓] Flutter (Channel stable, v1.17.3, on Mac OS X 10.15.5 19F101, locale en-GB)
    • Flutter version 1.17.3 at /Users/tahatesser/Code/flutter_stable
    • Framework revision b041144f83 (13 days ago), 2020-06-04 09:26:11 -0700
    • Engine revision ee76268252
    • Dart version 2.8.4

 
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.0)
    • Android SDK at /Users/tahatesser/Code/sdk
    • Platform android-30, build-tools 30.0.0
    • ANDROID_HOME = /Users/tahatesser/Code/sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.5, Build version 11E608c
    • CocoaPods version 1.9.3

[✓] Android Studio (version 4.0)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 46.0.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)

[✓] VS Code (version 1.46.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.11.0

[✓] Connected device (1 available)
    • Taha’s iPhone • 00008020-001059882212002E • ios • iOS 13.5.1

• No issues found!

@TahaTesser TahaTesser added in triage Presently being triaged by the triage team waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds labels Jun 17, 2020
@nathanael-h
Copy link
Author

Hi @TahaTesser thanks for the reply, and the test you did. I saw no handle on your screenshot. Do you have the possibility to select the text you want, for example select only "the button" on iOS ?

@no-response no-response bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Jun 17, 2020
@nathanael-h
Copy link
Author

long press on the text

Here is a test done tonight. Android is on the left, i can use handles to select text. iOS is on the right, I can only hit select all button, I do not know how to make handles visible o that I could select the text I want.

I did the same test also on flutter master, and it is the same.

flutter doctor :
Downloading package sky_engine...                                   0,4s
Downloading flutter_patched_sdk tools...                            1,4s
Downloading flutter_patched_sdk_product tools...                    0,7s
Downloading darwin-x64 tools...                                     1,3s
Downloading darwin-x64/font-subset tools...                         0,2s
Downloading android-arm-profile/darwin-x64 tools...                 0,4s
Downloading android-arm-release/darwin-x64 tools...                 0,5s
Downloading android-arm64-profile/darwin-x64 tools...               0,4s
Downloading android-arm64-release/darwin-x64 tools...               0,5s
Downloading android-x64-profile/darwin-x64 tools...                 0,5s
Downloading android-x64-release/darwin-x64 tools...                 0,5s
[✓] Flutter (Channel master, 1.20.0-1.0.pre.90, on Mac OS X 10.14.6 18G4032, locale fr-FR)
    • Flutter version 1.20.0-1.0.pre.90 at /Users/user919727/Downloads/flutter
    • Framework revision 42e02d60d3 (il y a 3 heures), 2020-06-17 10:57:40 -0700
    • Engine revision 965fbbed17
    • Dart version 2.9.0 (build 2.9.0-14.0.dev 2b917f5b6a)

 
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
    • Android SDK at /Users/user919727/Library/Android/sdk
    • Platform android-29, build-tools 29.0.3
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_212-release-1586-b4-5784211)
    • All Android licenses accepted.

[!] Xcode - develop for iOS and macOS (Xcode 11.3.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.3.1, Build version 11C505
    ✗ Xcode requires additional components to be installed in order to run.
      Launch Xcode and install additional required components when prompted or run:
        sudo xcodebuild -runFirstLaunch
    • CocoaPods version 1.9.1

[✓] Android Studio (version 3.6)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 46.0.1
    • Dart plugin version 192.8052
    • Java version OpenJDK Runtime Environment (build 1.8.0_212-release-1586-b4-5784211)

[!] IntelliJ IDEA Community Edition (version 2018.2.6)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • For information about installing plugins, see
      https://flutter.dev/intellij-setup/#installing-the-plugins

[✓] VS Code (version 1.45.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.11.0

[✓] Connected device (1 available)
    • iPad Pro (12.9-inch) (3rd generation) • 9F863193-FF47-4A50-9B05-D550FD52D376 • ios •
      com.apple.CoreSimulator.SimRuntime.iOS-13-3 (simulator)

! Doctor found issues in 2 categories.

@TahaTesser
Copy link
Member

Hi @nathanael-h
Looks like you're using older Xcode and simulator with iOS 13.3, please upgrade
There is no issue on latest master and latest Xcode using iPad pro simulator

Simulator Screen Shot - iPad Pro (11-inch) (2nd generation) - 2020-06-18 at 12 46 17

flutter doctor -v
[✓] Flutter (Channel master, 1.20.0-1.0.pre.91, on Mac OS X 10.15.5 19F101,
    locale en-GB)
    • Flutter version 1.20.0-1.0.pre.91 at /Users/tahatesser/Code/flutter_master
    • Framework revision 9c3f0faa6d (8 hours ago), 2020-06-17 18:47:54 -0400
    • Engine revision 965fbbed17
    • Dart version 2.9.0 (build 2.9.0-14.0.dev 2b917f5b6a)

 
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.0)
    • Android SDK at /Users/tahatesser/Code/sdk
    • Platform android-30, build-tools 30.0.0
    • ANDROID_HOME = /Users/tahatesser/Code/sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.5, Build version 11E608c
    • CocoaPods version 1.9.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.0)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 46.0.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)

[✓] VS Code (version 1.46.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.11.0

[✓] Connected device (5 available)
    • Taha’s iPhone                       • 00008020-001059882212002E
      • ios            • iOS 13.5.1
    • iPad Pro (11-inch) (2nd generation) • 97F25D4E-6452-4348-A042-E945A326BCA4
      • ios            • com.apple.CoreSimulator.SimRuntime.iOS-13-5 (simulator)
    • macOS                               • macOS
      • darwin-x64     • Mac OS X 10.15.5 19F101
    • Web Server                          • web-server
      • web-javascript • Flutter Tools
    • Chrome                              • chrome
      • web-javascript • Google Chrome 83.0.4103.106

• No issues found!

@TahaTesser TahaTesser added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Jun 18, 2020
@nathanael-h
Copy link
Author

nathanael-h commented Jun 23, 2020

Hello, thanks for catching I was using an outdated xcode version, I upgraded both MacOS and XCode. Unfortunatly, I still have the issue.
Tonight I did this :

  • flutter channel master
  • flutter upgrade
  • flutter create myapss2
  • In the lib/main.dart, line 101, I replace Text by SelectableText, like this :
            SelectableText(
              'You have pushed the button this many times:',
            ),
  • flutter run to run on iOS simulator

Screenshots :

Capture d’écran du 2020-06-23 23-23-54
Capture d’écran du 2020-06-23 23-24-27

Full main.dart:

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // This is the theme of your application.
        //
        // Try running your application with "flutter run". You'll see the
        // application has a blue toolbar. Then, without quitting the app, try
        // changing the primarySwatch below to Colors.green and then invoke
        // "hot reload" (press "r" in the console where you ran "flutter run",
        // or simply save your changes to "hot reload" in a Flutter IDE).
        // Notice that the counter didn't reset back to zero; the application
        // is not restarted.
        primarySwatch: Colors.blue,
        // This makes the visual density adapt to the platform that you run
        // the app on. For desktop platforms, the controls will be smaller and
        // closer together (more dense) than on mobile platforms.
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  // This widget is the home page of your application. It is stateful, meaning
  // that it has a State object (defined below) that contains fields that affect
  // how it looks.

  // This class is the configuration for the state. It holds the values (in this
  // case the title) provided by the parent (in this case the App widget) and
  // used by the build method of the State. Fields in a Widget subclass are
  // always marked "final".

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      // This call to setState tells the Flutter framework that something has
      // changed in this State, which causes it to rerun the build method below
      // so that the display can reflect the updated values. If we changed
      // _counter without calling setState(), then the build method would not be
      // called again, and so nothing would appear to happen.
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    // This method is rerun every time setState is called, for instance as done
    // by the _incrementCounter method above.
    //
    // The Flutter framework has been optimized to make rerunning build methods
    // fast, so that you can just rebuild anything that needs updating rather
    // than having to individually change instances of widgets.
    return Scaffold(
      appBar: AppBar(
        // Here we take the value from the MyHomePage object that was created by
        // the App.build method, and use it to set our appbar title.
        title: Text(widget.title),
      ),
      body: Center(
        // Center is a layout widget. It takes a single child and positions it
        // in the middle of the parent.
        child: Column(
          // Column is also a layout widget. It takes a list of children and
          // arranges them vertically. By default, it sizes itself to fit its
          // children horizontally, and tries to be as tall as its parent.
          //
          // Invoke "debug painting" (press "p" in the console, choose the
          // "Toggle Debug Paint" action from the Flutter Inspector in Android
          // Studio, or the "Toggle Debug Paint" command in Visual Studio Code)
          // to see the wireframe for each widget.
          //
          // Column has various properties to control how it sizes itself and
          // how it positions its children. Here we use mainAxisAlignment to
          // center the children vertically; the main axis here is the vertical
          // axis because Columns are vertical (the cross axis would be
          // horizontal).
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            SelectableText(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headline4,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

Here is flutter doctor -v results:

user@mac myapps2 % flutter doctor -v
[✓] Flutter (Channel master, 1.20.0-1.0.pre.167, on Mac OS X 10.15.5 19F101,
    locale fr-FR)
    • Flutter version 1.20.0-1.0.pre.167 at /Users/user921712/Downloads/flutter
    • Framework revision 8fce4ce974 (il y a 32 minutes), 2020-06-23 13:53:01
      -0700
    • Engine revision 57d1333999
    • Dart version 2.9.0 (build 2.9.0-18.0.dev 5a6c1e5158)

 
[!] Android toolchain - develop for Android devices (Android SDK version 26.0.1)
    • Android SDK at /usr/local/Caskroom/android-sdk/3859397,26.0.1
    ✗ Flutter requires Android SDK 28 and the Android BuildTools 28.0.3
      To update using sdkmanager, run:
        "/usr/local/Caskroom/android-sdk/3859397,26.0.1/tools/bin/sdkmanager"
        "platforms;android-28" "build-tools;28.0.3"
      or visit https://flutter.dev/docs/get-started/install/macos#android-setup
      for detailed instructions.
    ✗ Android licenses not accepted.  To resolve this, run: flutter doctor
      --android-licenses

[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.5, Build version 11E608c
    • CocoaPods version 1.9.1

[!] Android Studio (version 3.6)
    • Android Studio at /Applications/Android Studio.app/Contents
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • Java version OpenJDK Runtime Environment (build
      1.8.0_212-release-1586-b4-5784211)

[!] IntelliJ IDEA Community Edition (version 2019.3.3)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    ✗ Flutter plugin not installed; this adds Flutter specific functionality.
    ✗ Dart plugin not installed; this adds Dart specific functionality.
    • For information about installing plugins, see
      https://flutter.dev/intellij-setup/#installing-the-plugins

[✓] VS Code (version 1.45.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.11.0

[✓] Connected device (1 available)
    • iPhone SE (2nd generation) • CA087DA1-30A1-4A5C-8183-E911909CDF24 • ios •
      com.apple.CoreSimulator.SimRuntime.iOS-13-5 (simulator)

! Doctor found issues in 3 categories.

@no-response no-response bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Jun 23, 2020
@nathanael-h
Copy link
Author

For you information I also tried with an iPad Pro 9.7 simulator, iOS 13.5 and I have the same issue with the code you provided or the one I sent in the previous comment.
Thank you for your kind help.

@TahaTesser
Copy link
Member

flutter doctor -v
[✓] Flutter (Channel master, 1.20.0-1.0.pre.208, on Mac OS X 10.15.5 19F101,
    locale en-GB)
    • Flutter version 1.20.0-1.0.pre.208 at
      /Users/tahatesser/Code/flutter_master
    • Framework revision c68758fab1 (85 minutes ago), 2020-06-24 21:23:02 -0700
    • Engine revision 0c14126211
    • Dart version 2.9.0 (build 2.9.0-18.0.dev d8eb844e5d)

 
[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
    • Android SDK at /Users/tahatesser/Code/sdk
    • Platform android-29, build-tools 29.0.3
    • ANDROID_HOME = /Users/tahatesser/Code/sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 11.5)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 11.5, Build version 11E608c
    • CocoaPods version 1.9.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 4.0)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 46.0.2
    • Dart plugin version 193.7361
    • Java version OpenJDK Runtime Environment (build
      1.8.0_242-release-1644-b3-6222593)

[✓] VS Code (version 1.46.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.11.0

[✓] Connected device (4 available)
    • Taha’s iPhone • 00008020-001059882212002E • ios            • iOS 13.5.1
    • macOS desktop • macos                     • darwin-x64     • Mac OS X
      10.15.5 19F101
    • Web Server    • web-server                • web-javascript • Flutter Tools
    • Chrome        • chrome                    • web-javascript • Google Chrome
      83.0.4103.116

• No issues found!

@TahaTesser TahaTesser changed the title SelectableText has no handle on iOS SelectableText has no selection handle on iOS when long press Jun 25, 2020
@TahaTesser TahaTesser added a: typography Text rendering, possibly libtxt f: material design flutter/packages/flutter/material repository. found in release: 1.17 Found to occur in 1.17 found in release: 1.20 Found to occur in 1.20 framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on platform-ios iOS applications specifically a: fidelity Matching the OEM platforms better and removed in triage Presently being triaged by the triage team labels Jun 25, 2020
@nathanael-h
Copy link
Author

Hello @chunhtai as you implemented Selectable Text, could maybe help to triage, to assign, or to solve this issues ? Thank you.

@chunhtai
Copy link
Contributor

cc @justinmc I can reproduce this by long press and click select all

@nathanael-h
Copy link
Author

Hello the PR #62072 fixes this issue partially : the handles now show up after clicking the select all button. Thanks @justinmc for your work.

But when we long press on the text the handles are still not showed. So to select a few words, we actually have to first hit select all then to unselect the unwanted text... I think this issue should be reopen. Tested on latest master right now.

@justinmc
Copy link
Contributor

@nathanael-h Thanks for catching that, I don't think I checked that case as part of the PR. Would you mind opening another issue and tagging me?

@nathanael-h
Copy link
Author

@justinmc Yes, ok, done in #62658 😎 thank you for your kind help.

@github-actions
Copy link

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.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 18, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
a: fidelity Matching the OEM platforms better a: typography Text rendering, possibly libtxt f: material design flutter/packages/flutter/material repository. found in release: 1.17 Found to occur in 1.17 found in release: 1.20 Found to occur in 1.20 framework flutter/packages/flutter repository. See also f: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on platform-ios iOS applications specifically
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants