macos_ui
macos_ui copied to clipboard
Tabstop recognizes only 2 MacosTextFields
Description
When having more than 2 MacosTextFields in a ListView, then the automatic tab jumps only between the first two elements and doesn't proceed to the 3rd or 4th one. Even, when you select the 3rd or 4th one per mouseclick and then enter tab, it jumps to the first MacosTextField, instead of jumping to the next MacosTextField in the list.
Steps To Reproduce
Create a ListView in a ExpandablePanel. Inside the ListView add a <Widget>[] list with 6 or more MacosTextField() as children. Then when you try to change the focus between the textfields by pressing the tab-button, you'll experience the bug, which I described up above.
Expected behavior
Usually it should jump from one textfield to the next one automatically. Especially when you have set autofocus to true for all MacosTextFields. And I have even given each one a different value for the "key" variable, so that they can be identified. But still that bug remains. It recognizes only the first two Textfields and jumps between them and not to the 3rd or 4th one.
Screenshots
<If applicable, add screenshots to help explain your problem.> A video would show the bug much better. A screenshot makes no sense in this case.
<Run flutter analyze
and attach any output of that command below.
If there are any analysis errors, try resolving them before filing this issue.>
This bug doesn't make the application to crash, but it's just a wrong behavior, which I don't know any workaround by now. In the previous installed version 0.12 it worked properly.
<Finally, paste the output of running flutter doctor -v
here.>
flutter doctor -v
[✓] Flutter (Channel stable, 2.10.5, on macOS 12.3.1 21E258 darwin-x64, locale de-DE)
• Flutter version 2.10.5 at /Users/hamid/flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 5464c5bac7 (3 weeks ago), 2022-04-18 09:55:37 -0700
• Engine revision 57d3bac3dd
• Dart version 2.16.2
• DevTools version 2.9.2
[✓] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
• Android SDK at /Users/hamid/Library/Android/sdk
• Platform android-32, build-tools 32.1.0-rc1
• Java binary at: /Users/hamid/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/211.7628.21.2111.8139111/Android Studio.app/Contents/jre/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 11.0.11+0-b60-7590822)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• CocoaPods version 1.11.2
[✓] Android Studio (version 2021.1)
• Android Studio at /Users/hamid/Library/Application Support/JetBrains/Toolbox/apps/AndroidStudio/ch-0/211.7628.21.2111.8139111/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 11.0.11+0-b60-7590822)
[✓] Connected device (1 available)
• macOS (desktop) • macos • darwin-x64 • macOS 12.3.1 21E258 darwin-x64
[✓] HTTP Host Availability
• All required HTTP hosts are available
• No issues found!
Hi @BerlinLion! Thanks for reporting this. Would you mind sharing some minimum reproducible sample code? This will help me diagnose the issue. Thanks!
Here you can download 2 screen records showing the issue. https://we.tl/t-4ufwUlHd9a
And here is a sample code of the created textfields
@override
Widget build(BuildContext context) {
return ExpandableTheme(
data: const ExpandableThemeData(
iconColor: Colors.blue,
useInkWell: false,
collapseIcon: CupertinoIcons.chevron_down,
expandIcon: CupertinoIcons.right_chevron,
hasIcon: true,
),
child: ExpandablePanel(
header: Row(
children: [
const MacosIcon(CupertinoIcons.doc_text),
Text(' Document'.toUpperCase(), style: menuHeaderStyle,)],
),
collapsed: Text(''),
expanded: Container(
height: 350,
width: 300,
child: ListView(
padding: const EdgeInsets.all(20.0),
physics: const BouncingScrollPhysics(),
children: <Widget>[
const SizedBox(height: 20,),
Text('Offernumber'.toUpperCase(), style: menuStyle,),
MacosTextField(
keyboardType: const TextInputType.numberWithOptions(
signed: false,
decimal: false,
),
controller: controller_document_offer_number,
onEditingComplete: updateOfferNumber,
placeholder: "#",
maxLines: 1,
prefix: const Padding(
padding: EdgeInsets.symmetric(
horizontal: 4.0,
vertical: 2.0,
),
child: MacosIcon(CupertinoIcons.checkmark_seal_fill),
),
style: entryFieldStyle,
),
const SizedBox(height: 20,),
Text('City'.toUpperCase(), style: menuStyle,),
MacosTextField(
controller: controller_document_city,
onEditingComplete: updateDocumentCity,
placeholder: "Berlin",
maxLines: 1,
prefix: const Padding(
padding: EdgeInsets.symmetric(
horizontal: 4.0,
vertical: 2.0,
),
child: MacosIcon(CupertinoIcons.building_2_fill),
),
style: entryFieldStyle,
),
const SizedBox(height: 20,),
Text('Date'.toUpperCase(), style: menuStyle,),
MacosTextField(
controller: controller_document_date,
onEditingComplete: updateDocumentDate,
placeholder: "01.01.2022",
maxLines: 1,
keyboardType: TextInputType.datetime,
prefix: const Padding(
padding: EdgeInsets.symmetric(
horizontal: 4.0,
vertical: 2.0,
),
child: MacosIcon(CupertinoIcons.calendar),
),
clearButtonMode: OverlayVisibilityMode.always,
style: entryFieldStyle,
),
const SizedBox(height: 20,),
Text('Zahlungsbedingungen'.toUpperCase(), style: menuStyle,),
const SizedBox(height: 7,),
MacosTextField(
keyboardType: TextInputType.text,
placeholder: "Zahlungsbedingungen",
minLines: 3,
maxLines: 20,
autocorrect: true,
enableSuggestions: true,
enableInteractiveSelection: true,
controller: controller_document_zahlungsbedingungen,
onEditingComplete: updateDocumentZahlungsbedingungen,
autofocus: true,
style: entryFieldStyle,
),
SizedBox(height: 5,),
CupertinoButton(
padding: const EdgeInsets.all(5),
child: Text('Reset Zahlungsbedingungen', style: entryFieldStyle,),
onPressed: resetToDefaultZahlungsbedingungen,
borderRadius: const BorderRadius.all(Radius.circular(5)),
color: resetDocumentButtonColor,
),
const SizedBox(height: 20,),
],
),
),
),
);
}
I hope it'll help to fix the bug.