flutter / flutter

Flutter makes it easy and fast to build beautiful apps for mobile and beyond
https://flutter.dev
BSD 3-Clause "New" or "Revised" License
164.66k stars 27.13k forks source link

[a11y] [android] GestureDetector's onDoubleTap does not work when system magnification shortcut is set to triple tap #146061

Open ThatPham2000 opened 5 months ago

ThatPham2000 commented 5 months ago

Steps to reproduce

Click the text or the number. P/s: after enabling the magnification shortcut with triple tap, I was unable to double tap.

Expected results

Number will increase

Actual results

Nothing happened

Code sample

Code sample ```dart import 'package:flutter/material.dart'; void main() { runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), useMaterial3: true, ), home: const MyHomePage(title: 'Flutter Demo Home Page'), ); } } class MyHomePage extends StatefulWidget { const MyHomePage({super.key, required this.title}); final String title; @override State createState() => _MyHomePageState(); } class _MyHomePageState extends State { int _counter = 0; void _incrementCounter() { setState(() { _counter++; }); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( backgroundColor: Theme.of(context).colorScheme.inversePrimary, title: Text(widget.title), ), body: Center( child: GestureDetector( onDoubleTap: _incrementCounter, child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ const Text( 'You have pushed the button this many times:', ), Text( '$_counter', style: Theme.of(context).textTheme.headlineMedium, ), ], ), ), ), ); } } ```

Screenshots or Video

Screenshots / Video demonstration ![Screenshot](https://github.com/flutter/flutter/assets/57900109/9e66cfa7-5e59-4145-966a-39ce5fca0b0e)

Logs

Logs ```console [Paste your logs here] ```

Flutter Doctor output

Doctor output ```console [✓] Flutter (Channel stable, 3.13.2, on macOS 13.6.1 22G313 darwin-arm64, locale en-VN) • Flutter version 3.13.2 on channel stable at /Users/phat/Developer/flutter_3.13.2 • Upstream repository https://github.com/flutter/flutter.git • Framework revision ff5b5b5fa6 (7 months ago), 2023-08-24 08:12:28 -0500 • Engine revision b20183e040 • Dart version 3.1.0 • DevTools version 2.25.0 [✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0) • Android SDK at /Users/phat/Library/Android/sdk • Platform android-34, build-tools 34.0.0 • ANDROID_HOME = /Users/phat/Library/Android/sdk • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 15.0.1) • Xcode at /Applications/Xcode.app/Contents/Developer • Build 15A507 • CocoaPods version 1.15.2 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2022.3) • 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 17.0.6+0-17.0.6b829.9-10027231) [✓] IntelliJ IDEA Ultimate Edition (version 2023.1.4) • IntelliJ at /Applications/IntelliJ IDEA.app • 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 [✓] VS Code (version 1.87.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension can be installed from: 🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter [✓] Connected device (3 available) • SM F926B (mobile) • RFCT426NC0B • android-arm64 • Android 14 (API 34) • macOS (desktop) • macos • darwin-arm64 • macOS 13.6.1 22G313 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 123.0.6312.87 [✓] Network resources • All expected network resources are available. • No issues found! ```
danagbemava-nc commented 5 months ago

Hi @ThatPham2000, you are using an old version of flutter. Kindly upgrade to the latest version of flutter. Kindly upgrade to the latest version of flutter stable (3.19.5) to see if you still experience this issue.

If you do, please provide the updated output of flutter doctor -v

Thank you

ThatPham2000 commented 5 months ago

Because of https://github.com/flutter/flutter/issues/141007, we have to use the above version. However, I updated the latest version 3.19.5. The result is the same. onDoubleTap has never called. Here is my flutter doctor:

[✓] Flutter (Channel stable, 3.19.5, on macOS 13.6.1 22G313 darwin-arm64, locale
    en-VN)
    • Flutter version 3.19.5 on channel stable at
      /Users/phat/Developer/flutter_3.19.5
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 300451adae (4 days ago), 2024-03-27 21:54:07 -0500
    • Engine revision e76c956498
    • Dart version 3.3.3
    • DevTools version 2.31.1

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/phat/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/phat/Library/Android/sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.0.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15A507
    • CocoaPods version 1.15.2

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

[✓] Android Studio (version 2022.3)
    • 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
      17.0.6+0-17.0.6b829.9-10027231)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.1.4)
    • IntelliJ at /Applications/IntelliJ IDEA.app
    • 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

[✓] VS Code (version 1.87.2)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension can be installed from:
      🔨 https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-arm64   • macOS 13.6.1 22G313
      darwin-arm64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 123.0.6312.87

[✓] Network resources
    • All expected network resources are available.

• No issues found!
danagbemava-nc commented 5 months ago

Hi @ThatPham2000, just to confirm, does this work if the magnification shortcut is not set to a triple tap?

ThatPham2000 commented 5 months ago

Hi @danagbemava-nc , You are right.

danagbemava-nc commented 5 months ago

Hi @ThatPham2000, are you able to use the gesture properly in native android apps?

Can you also share some examples?

ThatPham2000 commented 5 months ago

Hi @danagbemava-nc , For this issue, the root cause is that users turn on the magnification shortcut with the triple-tap feature. Magnification is one of the Accessibility features. Because Accessibility's triple-tap has the same behavior as the double-tap of Flutter, Flutter's onDoubleTap function has never been called. Besides, I tested it on iOS. iOS used a double-tap with three fingers to trigger the magnification. After enabling magnification, the feature works fine. I provided the code example causing this issue above.

danagbemava-nc commented 5 months ago

Hi @ThatPham2000, my apologies, I wasn't clear enough.

What I meant was in native android, do you see the gesture being handled properly while the magnification is active? I ask this because of the system is intercepting the triple tap to show the magnifier, there likely isn't a way for flutter to handle the event because it won't be receiving them. I tested a small example in jetpack compose but the system was intercepting the event so the double tap wasn't working. If you could provide an example in native android that works as expected, we would appreciate it, otherwise there wouldn't be much we can do.

PS: Android and iOS have different ways of handling things internally, so things that work on iOS may not always work on android

ThatPham2000 commented 5 months ago

Hi @danagbemava-nc , here is the video example. At the end of the video (1:04), you can see when you enable the magnification, Flutter still recognizes the double-tap action (very lucky ^^ after a long time of trying). Therefore, it is very hard to detect the double-tap action. Can Flutter override this?

https://github.com/flutter/flutter/assets/57900109/15377382-deaa-4161-b91f-463b27ef33dd

danagbemava-nc commented 5 months ago

@ThatPham2000, thanks for the video, I initially assumed that Talkback needed to be on for this to be reproduced.

Reproducible using the code sample provided above.

Talkback should not be on to reproduce this issue. I tested with a compose sample and it works as expected. With the magnification gesture set to triple tap, it seems like the gesture detector captures the input as a single tap instead of a double tap. A triple tap will end up triggering magnification on the device.

flutter compose
compose sample ```kotlin package com.example.accessibility import android.os.Bundle import android.util.Log import android.view.GestureDetector import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.combinedClickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.padding import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Scaffold import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.mutableIntStateOf import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview import com.example.accessibility.ui.theme.AccessibilityTheme class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { AccessibilityTheme { // A surface container using the 'background' color from the theme Surface( modifier = Modifier.fillMaxSize(), color = MaterialTheme.colorScheme.background ) { Greeting("Android") } } } } } @OptIn(ExperimentalFoundationApi::class) @Composable fun Greeting(name: String, modifier: Modifier = Modifier) { val counter = remember { mutableIntStateOf(0) } Scaffold( modifier = modifier.fillMaxSize(), ) { it -> Column(modifier = Modifier .padding(it) .fillMaxSize() .combinedClickable( onClick = { }, onDoubleClick = { Log.d("GREETING", "double clicked") counter.intValue++ } ), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally ) { Text(text = "Some text ${counter.intValue}", textAlign = TextAlign.Center) } } } @Preview(showBackground = true) @Composable fun GreetingPreview() { AccessibilityTheme { Greeting("Android") } } ```
flutter doctor -v ``` [!] Flutter (Channel stable, 3.19.5, on macOS 14.3.1 23D60 darwin-arm64, locale en-GB) • Flutter version 3.19.5 on channel stable at /Users/nexus/dev/sdks/flutter ! Warning: `flutter` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path. ! Warning: `dart` on your path resolves to /Users/nexus/dev/sdks/flutters/bin/dart, which is not inside your current Flutter SDK checkout at /Users/nexus/dev/sdks/flutter. Consider adding /Users/nexus/dev/sdks/flutter/bin to the front of your path. • Upstream repository https://github.com/flutter/flutter.git • Framework revision 300451adae (8 days ago), 2024-03-27 21:54:07 -0500 • Engine revision e76c956498 • Dart version 3.3.3 • DevTools version 2.31.1 • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades. [✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0) • Android SDK at /Users/nexus/Library/Android/sdk • Platform android-34, build-tools 34.0.0 • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 15.3) • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer • Build 15E204a • CocoaPods version 1.14.3 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2023.1) • Android Studio at /Users/nexus/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 17.0.7+0-17.0.7b1000.6-10550314) [✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5) • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app • Flutter plugin version 77.2.2 • Dart plugin version 232.10286 [✓] VS Code (version 1.87.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.86.0 [✓] Connected device (5 available) • Pixel 7 (mobile) • 28291FDH2001SA • android-arm64 • Android 14 (API 34) • Nexus (mobile) • 00008020-001875E83A38002E • ios • iOS 17.4.1 21E236 • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios • iOS 17.4.1 21E236 • macOS (desktop) • macos • darwin-arm64 • macOS 14.3.1 23D60 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 123.0.6312.107 [✓] Network resources • All expected network resources are available. ! Doctor found issues in 1 category. ``` ``` [✓] Flutter (Channel master, 3.22.0-5.0.pre.29, on macOS 14.3.1 23D60 darwin-arm64, locale en-GB) • Flutter version 3.22.0-5.0.pre.29 on channel master at /Users/nexus/dev/sdks/flutters • Upstream repository https://github.com/flutter/flutter.git • Framework revision e1964cf4f0 (4 hours ago), 2024-04-05 00:05:20 -0400 • Engine revision f17d586de6 • Dart version 3.5.0 (build 3.5.0-18.0.dev) • DevTools version 2.34.1 [✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0) • Android SDK at /Users/nexus/Library/Android/sdk • Platform android-34, build-tools 34.0.0 • Java binary at: /Users/nexus/Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314) • All Android licenses accepted. [✓] Xcode - develop for iOS and macOS (Xcode 15.3) • Xcode at /Applications/Xcode-15.3.0.app/Contents/Developer • Build 15E204a • CocoaPods version 1.14.3 [✓] Chrome - develop for the web • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome [✓] Android Studio (version 2023.1) • Android Studio at /Users/nexus/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 17.0.7+0-17.0.7b1000.6-10550314) [✓] IntelliJ IDEA Ultimate Edition (version 2023.2.5) • IntelliJ at /Users/nexus/Applications/IntelliJ IDEA Ultimate.app • Flutter plugin version 77.2.2 • Dart plugin version 232.10286 [✓] VS Code (version 1.87.2) • VS Code at /Applications/Visual Studio Code.app/Contents • Flutter extension version 3.86.0 [✓] Connected device (6 available) • Pixel 7 (mobile) • 28291FDH2001SA • android-arm64 • Android 14 (API 34) • Nexus (mobile) • 00008020-001875E83A38002E • ios • iOS 17.4.1 21E236 • Dean’s iPad (mobile) • 00008103-000825C811E3401E • ios • iOS 17.4.1 21E236 • macOS (desktop) • macos • darwin-arm64 • macOS 14.3.1 23D60 darwin-arm64 • Mac Designed for iPad (desktop) • mac-designed-for-ipad • darwin • macOS 14.3.1 23D60 darwin-arm64 • Chrome (web) • chrome • web-javascript • Google Chrome 123.0.6312.107 [✓] Network resources • All expected network resources are available. • No issues found! ```