-
Notifications
You must be signed in to change notification settings - Fork 26.7k
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
Support Full Keyboard Access on iOS for keyboard navigation events #76497
Comments
Hi @hkwinslow code sampleimport '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 StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
bool checkboxValue = false;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Material App Bar'),
),
body: Center(
child: Container(
child: Column(
children: [
TextField(),
Checkbox(
value: checkboxValue,
onChanged: (bool value) {
setState(() {
this.checkboxValue = !checkboxValue;
});
},
),
ElevatedButton(onPressed: () {}, child: Text("Button"))
],
),
),
),
// body: Center(
// child: Container(child: TextField()),
// ),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {},
),
);
}
}
flutter doctor -v[✓] Flutter (Channel stable, 1.22.6, on macOS 11.2.1 20D74 darwin-x64, locale en-GB)
• Flutter version 1.22.6 at /Users/tahatesser/Code/flutter_stable
• Framework revision 9b2d32b605 (4 weeks ago), 2021-01-22 14:36:39 -0800
• Engine revision 2f0af37152
• Dart version 2.10.5
[✗] Android toolchain - develop for Android devices
✗ Unable to locate Android SDK.
Install Android Studio from: https://developer.android.com/studio/index.html
On first launch it will assist you in installing the Android SDK components.
(or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).
If the Android SDK has been installed to a custom location, set ANDROID_SDK_ROOT to that location.
You may also want to add it to your PATH environment variable.
[!] Xcode - develop for iOS and macOS (Xcode 12.4)
• Xcode at /Volumes/Extreme/Xcode.app/Contents/Developer
• Xcode 12.4, Build version 12D4e
✗ CocoaPods not installed.
CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on the Dart side.
Without CocoaPods, plugins will not work on iOS or macOS.
For more info, see https://flutter.dev/platform-plugins
To install:
sudo gem install cocoapods
[!] Android Studio (version 4.1)
• 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_242-release-1644-b3-6915495)
[✓] VS Code (version 1.53.2)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.19.0
[✓] Connected device (1 available)
• Taha’s iPad (mobile) • 00008020-000255113EE8402E • ios • iOS 14.4
! Doctor found issues in 3 categories. [✓] Flutter (Channel master, 1.27.0-5.0.pre.94, on macOS 11.2.1 20D74 darwin-x64, locale en-GB)
• Flutter version 1.27.0-5.0.pre.94 at /Users/tahatesser/Code/flutter_master
• Framework revision 5642bed237 (10 hours ago), 2021-02-21 21:41:03 -0500
• Engine revision b793775d2a
• Dart version 2.13.0 (build 2.13.0-52.0.dev)
[✗] Android toolchain - develop for Android devices
✗ Unable to locate Android SDK.
Install Android Studio from: https://developer.android.com/studio/index.html
On first launch it will assist you in installing the Android SDK components.
(or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).
If the Android SDK has been installed to a custom location, please use
`flutter config --android-sdk` to update to that location.
[!] Xcode - develop for iOS and macOS
• Xcode at /Volumes/Extreme/Xcode.app/Contents/Developer
• Xcode 12.4, Build version 12D4e
✗ CocoaPods not installed.
CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on the Dart side.
Without CocoaPods, plugins will not work on iOS or macOS.
For more info, see https://flutter.dev/platform-plugins
To install see https://guides.cocoapods.org/using/getting-started.html#installation for instructions.
[✓] 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)
[✓] VS Code (version 1.53.2)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.19.0
[✓] Connected device (3 available)
• Taha’s iPad (mobile) • 00008020-000255113EE8402E • ios • iOS 14.4
• macOS (desktop) • macos • darwin-x64 • macOS 11.2.1 20D74 darwin-x64
• Chrome (web) • chrome • web-javascript • Google Chrome 88.0.4324.182
! Doctor found issues in 2 categories. Thank you |
@TahaTesser Can you elaborate on what you mean be "only works first time on Android when the app is launched"? Do you mean that if you exit the app (push the "stop" button in an IDE or hit 'q' on the command-line) and run it again, it doesn't work? Or do you mean hot-restart, or some other kind of restart? Asking because I wasn't able to reproduce this on Android: it all worked for me through multiple restarts. (checking iOS next) |
So, indeed, we are missing some functionality on iOS. iOS keyboard support was recently added (Apple didn't make the APIs available until recently), and it's still being brought up to the same level as the other platforms. I'll put this on my list to fix. |
To be clear, tab navigation does work for controls other than text fields, but if a text field receives focus, then it interprets the tab character as an input character instead of a shortcut, so non-textfield traversal does work, but textfields trap the focus until this is fixed. |
@gspencergoog non textfield focus works for you on iOS? |
Yes, it works. (Details: I tested on an iPhone 6s with iOS 14.4 and an iClever Bluetooth keyboard attached, using the Flutter |
@gspencergoog Hmmm. I am using an iPhone 8 Plus, iOS 14.4, tried two different bluetooth keyboards (details above), and I'm using the Flutter master channel. @TahaTesser When you said you were never able to focus on checkboxes or buttons, was that only for Android or also for iOS? |
@TahaTesser Note that if you have the text field first in the display, then hitting tab means you focus the text field, and then it will swallow all of the other tabs (which is the bug here), so try this instead of the sample you posted (the only difference is that it has the text field at the bottom): 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 StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
bool checkboxValue = false;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Material App Bar'),
),
body: Center(
child: Container(
child: Column(
children: [
Checkbox(
value: checkboxValue,
onChanged: (bool value) {
setState(() {
this.checkboxValue = !checkboxValue;
});
},
),
ElevatedButton(onPressed: () {}, child: Text("Button")),
TextField(),
],
),
),
),
// body: Center(
// child: Container(child: TextField()),
// ),
floatingActionButton: FloatingActionButton(
child: Icon(Icons.add),
onPressed: () {},
),
);
}
} |
@gspencergoog I've tried with text fields at the bottom. I copy/pasted your code and I'm still not getting the results you're getting. My husband has an iPhone 6s so I'm going to update it to iOS 14.4 and try with that. Although it's unlikely that the problem is device specific, right? |
Well, if the OS was too old (pre iOS 13.4), then iOS doesn't have the APIs necessary, but other than that, it shouldn't be device specific. |
@gspencergoog I tried using a 6s on iOS 14.4 and somehow I'm still not getting the results you are. |
This is with a US keyboard, correct? And I assume that the keyboard works OK on other iOS apps, right? |
Also, do you have any settings that might affect how the keyboard is interpreted? For example, accessibility apps or settings? |
@gspencergoog Yes both keyboards I'm trying are US. Other apps work fine (Amazon, Walmart, etc). I tried release mode and that didn't change anything. I tried using another iPhone 8 Plus we had laying around that had been wiped and returned to its initial state where you have to set up the iPhone in order to use it. So the keyboard settings on that one had never been touched. Yielded same results. It's on iOS 14.2. |
@gspencergoog |
@TahaTesser When you said you were never able to focus on checkboxes or buttons, was that only for Android or also for iOS? |
@gspencergoog I found something that might help us figure out what is going on. I turned off "Full Keyboard Access" in Settings > Accessibility > Keyboards, and that allowed me to navigate (using an external keyboard) inside my Flutter app using the tab button. But with that turned off, I was unable to navigate around the iPhone in general. With "Full Keyboard Access" turned on, I am able to navigate around the iPhone screen and many different accessible apps, but not my Flutter app. This doesn't seem like it is expected behavior. I feel like I should be able to navigate around the Flutter app with "Full Keyboard Access" turned on. But maybe this was why yours was working and mine wasn't. Any ideas? |
@hkwinslow |
This issue is marked P1 but has had no recent status updates. The P1 label indicates high-priority issues that are at the top of the work list. This is the highest priority level a bug can have if it isn't affecting a top-tier customer or breaking the build. Bugs marked P1 are generally actively being worked on unless the assignee is dealing with a P0 bug (or another P1 bug). Issues at this level should be resolved in a matter of months and should have monthly updates on GitHub. Please consider where this bug really falls in our current priorities, and label it or assign it accordingly. This allows people to have a clearer picture of what work is actually planned. Thanks! |
This comment was marked as duplicate.
This comment was marked as duplicate.
This is a critical item for accessibility standards for mobile applications as seen here. Should be a P1 - This is an incredibly common method of interaction with mobile applications from an accessible standpoint. |
Hello everybody, is there an update on this issue ? Using FKA on the ios apps (developed by flutter) is a core functionality that is needed to implement the accessibility standards for our apps and it will be required by law in the near future. Do we have an estimated date of when this issue will be resolved ? |
This comment was marked as outdated.
This comment was marked as outdated.
@huycozy when you did your tests did you have FKA on ? |
The situation has not improved on Flutter 3.19.6 with Full Keyboard Access on. Still no interaction is possible at all. 😢 |
@Dionisis-NikasD2 oops, my bad. flutter doctor -v (stable and master)[✓] Flutter (Channel stable, 3.19.6, on macOS 14.1 23B74 darwin-x64, locale en-VN)
• Flutter version 3.19.6 on channel stable at /Users/huynq/Documents/GitHub/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 54e66469a9 (31 hours ago), 2024-04-17 13:08:03 -0700
• Engine revision c4cd48e186
• Dart version 3.3.4
• DevTools version 2.31.1
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
• Android SDK at /Users/huynq/Library/Android/sdk
• Platform android-34, build-tools 34.0.0
• ANDROID_HOME = /Users/huynq/Library/Android/sdk
• Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
• Xcode at /Applications/Xcode15.3.app/Contents/Developer
• Build 15E204a
• CocoaPods version 1.15.2
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2023.2)
• 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
• android-studio-dir = /Applications/Android Studio.app/
• Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
[✓] VS Code (version 1.88.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.86.0
[✓] Connected device (3 available)
• RMX2001 (mobile) • EUYTFEUSQSRGDA6D • android-arm64 • Android 11 (API 30)
• macOS (desktop) • macos • darwin-x64 • macOS 14.1 23B74 darwin-x64
• Chrome (web) • chrome • web-javascript • Google Chrome 123.0.6312.124
[✓] Network resources
• All expected network resources are available.
• No issues found! [!] Flutter (Channel master, 3.22.0-16.0.pre.39, on macOS 14.1 23B74 darwin-x64, locale en-VN)
• Flutter version 3.22.0-16.0.pre.39 on channel master at /Users/huynq/Documents/GitHub/flutter_master
! Warning: `flutter` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
! Warning: `dart` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/dart, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 49770cd929 (24 minutes ago), 2024-04-23 22:55:10 -0400
• Engine revision d4f63383d3
• Dart version 3.5.0 (build 3.5.0-92.0.dev)
• DevTools version 2.35.0-dev.8
• 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/huynq/Library/Android/sdk
• Platform android-34, build-tools 34.0.0
• ANDROID_HOME = /Users/huynq/Library/Android/sdk
• Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
• Xcode at /Applications/Xcode15.3.app/Contents/Developer
• Build 15E204a
• CocoaPods version 1.15.2
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2023.2)
• 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
• android-studio-dir = /Applications/Android Studio.app/
• Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
[✓] VS Code (version 1.88.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.86.0
[✓] Connected device (2 available)
• macOS (desktop) • macos • darwin-x64 • macOS 14.1 23B74 darwin-x64
• Chrome (web) • chrome • web-javascript • Google Chrome 124.0.6367.79
[✓] Network resources
• All expected network resources are available.
! Doctor found issues in 1 category. |
Any update so far? European Accessibility Act mandates that by 2025, most apps should be accessible to all kind of people (especially people with disabilities). One of the criteria includes the requirement for users to navigate using their keyboard. It appears that the Flutter framework currently falls short in this aspect atm. |
This comment was marked as outdated.
This comment was marked as outdated.
This comment was marked as off-topic.
This comment was marked as off-topic.
Can confirm that this issue is still relevant. Also this is a pressing matter as others already stated. This will be a mandatory feature for nearly every app that is being released in Europe. Flutter not supporting this may have an impact in the wider adoption and resolving this issue should be focussed. |
I'm with @mattsolle on this: This should probably be P1. We recently built an app which failed the BITV/WCAG accessibility test because of this issue. Therefore I'd love to see this issue get some traction. |
We know this is important, and this is still the most up-to-date comment #76497 (comment):
For example, Flutter uses I'm trying to escalate the Feedback Assistant ticket requesting this feature with Apple. Before adding new comments, please review "Do not add "me too" or "same" or "is there an update" comments to bugs" in our wiki. Thanks! |
Steps to Reproduce
Expected results:
Actual results:
Details
textInputAction: TextInputAction.next, onEditingComplete: () => FocusScope.of(context).nextFocus(),
But, I would expect it to work out of the box and for any type of input element. Also this requires autofocus to be set to true which is not ideal in many cases.Flutter Doctor Results
@gspencergoog Hixie said you have done work on keyboard for mobile. Any ideas? Thanks for looking at this!
The text was updated successfully, but these errors were encountered: