Selection toolbar/handler should disappear when it is opened and user clicks outside of it #72029
Description
Steps to Reproduce - Issue /1
- Run the code bellow as mobile-web (or go to this deployed website: https://epic-thompson-badb9e.netlify.app/#/).
- Select text in the text_field/selectable_text.
- Tap outside of the text_field/selectable_text
Expected results: The selection toolbar/handler should disappear.
Actual results: Selection toolbar/handler is still visible and the only way to remove it is to select one of the options in the toolbar.
Note: while reproducing you can notice some unwanted behavior: double tap select text but not show selection toolbar. Let's focus on the actual issue.
Side Note - issue /2
About the selection toolbar not disappearing reproduces on stable and on master channel. The toolbar not disappearing on mobile apps does not follow the Material Design rules: https://material.io/design/platform-guidance/android-text-selection-toolbar.html which says:
- Run the code bellow.
- Select text in the text_field/selectable_text.
- Tap outside of the text_field/selectable_text
Expected results: The selection toolbar should disappear.
Actual results: Selection toolbar is still visible and the only way to remove it is to select one of the options in the toolbar.
Flutter Code
import 'package:flutter/material.dart';
void main() => runApp(SampleWidget());
class SampleWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
TextField(
controller: TextEditingController(text: 'Flutter is great\nChange my mind.'),
minLines: 3,
maxLines: 5,
),
Padding(
padding: const EdgeInsets.all(32),
child: SelectableText("Flutter is great. Change my mind."),
),
],
),
),
),
);
}
}flutter doctor -v
[✓] Flutter (Channel master, 1.25.0-5.0.pre.125, on Mac OS X 10.15.7 19H2 darwin-x64, locale en)
• Flutter version 1.25.0-5.0.pre.125 at /Users/pedromassango/dev/SDKs/flutter_master
• Framework revision a12e2a473a (18 hours ago), 2020-12-08 23:13:04 -0500
• Engine revision df39e5c515
• Dart version 2.12.0 (build 2.12.0-133.0.dev)
[✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
• Android SDK at /Users/pedromassango/Library/Android/sdk
• Platform android-30, build-tools 30.0.2
• 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-6915495)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 12.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• Xcode 12.1, Build version 12A7403
• CocoaPods version 1.9.3
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 4.1)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 1.8.0_242-release-1644-b3-6915495)
[✓] IntelliJ IDEA Community Edition (version 2020.2.4)
• IntelliJ at /Applications/IntelliJ IDEA CE.app
• Flutter plugin version 52.0.4
• Dart plugin version 202.8070
[✓] VS Code (version 1.51.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.16.0
[✓] Connected device (3 available)
• sdk gphone x86 arm (mobile) • emulator-5554 • android-x86 • Android 11 (API 30) (emulator)
• macOS (desktop) • macos • darwin-x64 • Mac OS X 10.15.7 19H2 darwin-x64
• Chrome (web) • chrome • web-javascript • Google Chrome 87.0.4280.88
• No issues found!
It is kinda two issues into one but maybe it is fine since they may be solved in the same PR.