Repository navigation
The behavior of Dismissible with TextFormFields is different for Android and iOS #142447
Copy link
Copy link
Closed
Closed
Copy link
Labels
P2Important issues not at the top of the work listImportant issues not at the top of the work lista: text inputEntering text in a text field or keyboard related problemsEntering text in a text field or keyboard related problemsc: parityWorks on one platform but not anotherWorks on one platform but not anotherf: gesturesflutter/packages/flutter/gestures repository.flutter/packages/flutter/gestures repository.found in release: 3.16Found to occur in 3.16Found to occur in 3.16found in release: 3.19Found to occur in 3.19Found to occur in 3.19frameworkflutter/packages/flutter repository. See also f: labels.flutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onThe issue has been confirmed reproducible and is ready to work onp: material_uimaterial_ui package in flutter/packagesmaterial_ui package in flutter/packagesplatform-androidAndroid applications specificallyAndroid applications specificallyplatform-iosiOS applications specificallyiOS applications specificallyr: fixedIssue is closed as already fixed in a newer versionIssue is closed as already fixed in a newer versionteam-designOwned by Design Languages teamOwned by Design Languages teamtriaged-designTriaged by Design Languages teamTriaged by Design Languages team
Description
Steps to reproduce
- Run the code sample on Android and iOS.
- Dismiss an item with the red SizedBox and the TextFormField part.
Expected results
The behavior should be the same on iOS and Android. In my opinion, it should on both platforms be possible to dismiss by sliding the TextFormField.
If the TextField takes up the entire Dismissible, then it will handle the gesture.
This is also not true for iOS.
Actual results
On Android you can dismiss an item by touching the red SizedBox part but also the TextFormField part.
On iOS you can dismiss an item only by touching the red SizedBox part but not the TextFormField part.
Code sample
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key});
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
List<int> items = List<int>.generate(10, (index) => index);
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView.builder(
itemCount: items.length,
itemBuilder: (_, index) => Dismissible(
key: ValueKey<int>(items[index]),
onDismissed: (DismissDirection direction) {
setState(() {
items.removeAt(index);
});
},
child: Row(
children: [
Container(
width: 50,
height: 30,
color: Colors.red,
),
SizedBox(
width: 200,
child: TextFormField(
initialValue: items[index].toString(),
)),
Container(
width: 50,
height: 30,
color: Colors.red,
),
],
))),
);
}
}Screenshots or Video
Screenshots / Video demonstration
Bildschirmaufnahme.2024-01-29.um.17.33.24.mov
Bildschirmaufnahme.2024-01-29.um.17.30.26.mov
Flutter Doctor output
Doctor output
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.16.5, on macOS 14.0 23A344 darwin-arm64, locale de-DE)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
[✓] Xcode - develop for iOS and macOS (Xcode 15.0)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2022.3)
[✓] VS Code (version 1.85.1)
[✓] Connected device (5 available)
[✓] Network resources
• No issues found!```
</details>Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
P2Important issues not at the top of the work listImportant issues not at the top of the work lista: text inputEntering text in a text field or keyboard related problemsEntering text in a text field or keyboard related problemsc: parityWorks on one platform but not anotherWorks on one platform but not anotherf: gesturesflutter/packages/flutter/gestures repository.flutter/packages/flutter/gestures repository.found in release: 3.16Found to occur in 3.16Found to occur in 3.16found in release: 3.19Found to occur in 3.19Found to occur in 3.19frameworkflutter/packages/flutter repository. See also f: labels.flutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onThe issue has been confirmed reproducible and is ready to work onp: material_uimaterial_ui package in flutter/packagesmaterial_ui package in flutter/packagesplatform-androidAndroid applications specificallyAndroid applications specificallyplatform-iosiOS applications specificallyiOS applications specificallyr: fixedIssue is closed as already fixed in a newer versionIssue is closed as already fixed in a newer versionteam-designOwned by Design Languages teamOwned by Design Languages teamtriaged-designTriaged by Design Languages teamTriaged by Design Languages team
Activity
Hyla96 commentedon Jan 30, 2024
The issue has something to do with the field implementing gestures for the text selection.
If you replace the field with a Gesture detector and pass
onHorizontalDragUpdateyou get the same behavior you get on iOS (but you get it on both platforms). (It doesn't happen if you define only onTap)I believe that the field widget implements some platform-specific logic that defines (only for iOS) the dragging behavior for the RawGestureDetector underneath.
My results by running gesture arena:
Android
iOS
darshankawar commentedon Jan 30, 2024
Thanks for the report. I was able to see the same behavior as observed on both platforms. The same is noticed using the official code sample (by replacing
TextwithTextField).I looked at native iOS app (Reminders) and observed that the swiping from center area which is clickable, is possible.
RPReplay-Final1706597997.MOV
Updated the code from above link and running on both platform still gives the same behavior as reported.
stable, master flutter doctor -v
Fix `TextField` horizontal drag conflicts (#147341)
github-actions commentedon May 16, 2024
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 -vand a minimal reproduction of the issue.