Let iOS keyboard dismissal synchronize with scroll #57609

xster · 2020-05-19T20:00:45Z

Since #21814, keyboards will dismiss during scroll. For higher fidelity, rather than one single brisk dismissal event, the keyboard dismissal should ideally be done gradually along with the scroll gesture.

Android counterpart: #62876

xster · 2020-08-27T18:25:23Z

The upstream visual symptom to fix is #19279

mleonhard · 2021-09-05T22:40:13Z

I still need this.

furkansarihan · 2021-09-06T11:19:50Z

@mleonhard This may help; https://pub.dev/packages/flutter_interactive_keyboard

mleonhard · 2021-09-20T00:35:58Z

Dear Google Flutter Team,
I am preparing an app for release on Android & iOS. It has a small chat function. I am struggling to get the UX to match expectations for iOS users.

A common use-case for chat functions is to scroll up and consult a previous message while composing a new message. Users expect this on all platforms. Flutter currently makes this very hard to implement with acceptable UX on iOS:

A Flutter app using the onDrag mode will hide the keyboard as soon as the user begins scrolling. This is jarring to iOS users who expect the keyboard to stay put.
- If the app displays messages with a ListView with reverse: true, when the keyboard hides, the list jumps down. This is jarring, too. The user scrolls the desired information into view and taps the text box. The keyboard re-appears and the list jumps upward again, hiding the information they wanted to see. The user must learn to scroll the information to the bottom edge of the screen before tapping the text box. If they don't use the app frequently, they will forgot to do this and feel frustrated every time they use the Flutter app.
- If the app displays messages with a non-reversed ListView, the app must scroll the list up to the proper position when the keyboard appears. Figuring out how to do this is incredibly involved and may be impossible. Also, when the user begins scrolling and the keyboard disappears, they are left with the list scrolled half-way up the screen. They must move their finger down half the screen to continue scrolling. Additionally, when the user is scrolling and a new message arrives, the app tries to scroll to the bottom. This cancels their current scroll gesture. This is jarring. Therefore the non-reversed ListView requires large amounts of code to work around Flutter's poor behavior when scrolling and showing/hiding the keyboard.
A Flutter app could configure the keyboard with a done button by passing TextInputAction. This means the app cannot use the newline or send buttons which are much more useful.
The third-party module flutter_interactive_keyboard provides the function requested in this issue. It is at v0.2.0. It has no tests. Every team desiring to use this in their production apps will need to review the code thoroughly.
The third-party module keyboard_actions provides buttons that appear above the keyboard to dismiss it. Some iOS apps use this mode. The row takes up vertical space on the screen. This makes the app harder to use on small phones and for folks who can't see very well and have their device zoomed or set to display large fonts. The module has no tests. Every team desiring to use this in their production apps will need to review the code thoroughly.

Would you please implement this now?

Best Wishes,
Michael

CC: Flutter PM Tim Sneath @timsneath

CavalcanteLeo · 2021-11-01T15:17:33Z

Seems flutter want to remove all smoothness of the iOS, or they really don't care about iOS.
A lot of shader jank, weird keyboard behavior.

Tom3652 · 2021-12-03T22:44:44Z

i am in the same situation as you @mleonhard, and as an iOS user myself i can tell that this is simply required as UX experience... Hopefully the upvotes should give some weight to the request as it is impacted many people :/

Kiruel · 2022-11-17T15:12:11Z

Can I help for this issue ?
Because the flutter_interactive_keyboard seams no to work anymore, so we don't have any workaround. And this library use a fake view to perform the trick. We should have the native interactive keyboard from iOS.

There is a way in iOS Swift to scroll the keyboard with a custom offset ?

CavalcanteLeo · 2022-11-23T14:39:18Z

I have abandoned Flutter because of this, not quite close to iOS experience

hellohuanlin · 2022-11-23T22:19:13Z

AFAIK there isn't an API to explicitly set the keyboard frames on iOS.

Though the workaround described here (a separate but maybe related issue) may worth investigation.

mleonhard · 2022-11-28T07:49:35Z

I have abandoned Flutter because of this, not quite close to iOS experience

I also abandoned Flutter because of this and many other problems in Flutter. There has been almost no progress on any of these issues in 2 years. I guess Google Flutter Team has moved on to Desktop Flutter and silently abandoned Mobile Flutter, leaving Flutter for iOS at pre-release quality. 😭

CavalcanteLeo · 2022-11-30T12:31:56Z

I have abandoned Flutter because of this, not quite close to iOS experience

I also abandoned Flutter because of this and many other problems in Flutter. There has been almost no progress on any of these issues in 2 years. I guess Google Flutter Team has moved on to Desktop Flutter and silently abandoned Mobile Flutter, leaving Flutter for iOS at pre-release quality. 😭

And the worst of all: shader jank

Flutter on iOS has a quite bad experience, good for early stage startup where they are validating the mvp with less effort

CavalcanteLeo · 2023-07-16T00:07:36Z

The year 2023 and Flutter still have a UX gap from native iOS apps. I know a few companies that don't use Flutter because of this “small” problem. 6 years of flutter and still not having it. This should be P1

hellohuanlin · 2023-07-17T16:46:44Z

@CavalcanteLeo Hello, @Matt2D is now working on this

…Movement (#43972) This PR address the movement aspect of the flutter interactive keyboard. It handles pointer movement while a scroll view widget is visible, and the interactive behavior is chosen for keyboardDismissBehavior. This is a desired behavior of the keyboard that has not yet been implemented. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

This PR address the movement aspect of the flutter interactive keyboard. It handles pointer up while a scroll view widget is visible, and the interactive behavior is chosen for keyboardDismissBehavior. This is a desired behavior of the keyboard that has not yet been implemented. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

This PR addresses an issue with the animation of the keyboard. In iOS 16.0 a delay was included in UIView becomeFirstResponder where the areAnimationsEnabled boolean is no longer immediately read. In response to this issue a delay is added that allows for the animation to be properly disabled. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

This PR addresses an issue with the behavior of the keyboard. Originally the behavior of the keyboard was to see if the pointer was above or below the middle of the keyboards full size and then animate appropriately. However we found that the behavior is instead based on velocity. This PR adjust the code to match this behavior. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

…Movement (flutter#43972) This PR address the movement aspect of the flutter interactive keyboard. It handles pointer movement while a scroll view widget is visible, and the interactive behavior is chosen for keyboardDismissBehavior. This is a desired behavior of the keyboard that has not yet been implemented. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

This PR address the movement aspect of the flutter interactive keyboard. It handles pointer up while a scroll view widget is visible, and the interactive behavior is chosen for keyboardDismissBehavior. This is a desired behavior of the keyboard that has not yet been implemented. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

This PR addresses an issue with the animation of the keyboard. In iOS 16.0 a delay was included in UIView becomeFirstResponder where the areAnimationsEnabled boolean is no longer immediately read. In response to this issue a delay is added that allows for the animation to be properly disabled. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

This PR addresses an issue with the behavior of the keyboard. Originally the behavior of the keyboard was to see if the pointer was above or below the middle of the keyboards full size and then animate appropriately. However we found that the behavior is instead based on velocity. This PR adjust the code to match this behavior. Design Document: https://docs.google.com/document/d/1-T7_0mSkXzPaWxveeypIzzzAdyo-EEuP5V84161foL4/edit?pli=1 Issues Address: flutter/flutter#57609 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

ky1vstar · 2023-10-09T14:47:21Z

While we are waiting for this to be resolved, you can check my plugin which tends to close this gap.
Also, it has input accessory handling like in native apps.

abdalmonem · 2023-10-09T14:56:44Z

@ky1vstar
Amazing 🥳 , am going to implement it tomorrow and gave you my feedback

abdalmonem · 2023-10-10T11:55:22Z

Thanks @ky1vstar, Works like a charm 💯
For all, you can use ky1vstar plugin until flutter official implements IOS keyboard scroll behavior.
@Matt2D I know you working on this, and i have read your solution Hypotheses docs tow months ago, i found this plugin really impressive and maybe gave some inspiration push toward the final solid solution.

flutter-triage-bot · 2023-12-04T17:18:15Z

This issue is assigned to @Matt2D but has had no recent status updates. Please consider unassigning this issue if it is not going to be addressed in the near future. This allows people to have a clearer picture of what work is actually planned. Thanks!

cbracken · 2023-12-07T11:32:52Z

@subins829 this issue is specific to iOS behaviour. It looks like your comment refers to Android specific behaviour, which is tracked in #62876. Would you mind replying on that issue?

cbracken · 2023-12-07T11:39:49Z

The bulk of this work for iOS landed in flutter/engine#43972, flutter/engine#44457, flutter/engine#44586, and dismiss on scroll should now be working on iOS, along with flick up/down gestures that either completely dismiss/restore the keyboard partway through a scroll.

@hellohuanlin the main feature here was landed by @Matt2D, if there are any remaining items to close this, we should precisely lay them out here.

hellohuanlin · 2023-12-07T18:32:46Z

@cbracken The screenshot approach doesn't work on iOS 17 anymore since the keyboard is running out of process. We have to find another approach for iOS 17. Let's keep this open for now.

This was referenced May 19, 2020

Support Android 11 display cutouts, waterfall #56599

Closed

Let iOS keyboard be dismissed #21814

Closed

xster mentioned this issue Aug 4, 2020

Support synchronized IME on Android #62876

Closed

TahaTesser added passed first triage c: proposal A detailed proposal for a change to Flutter labels Sep 1, 2020

xster added this to Engineer Reviewed in Mobile - iOS fidelity review Nov 12, 2020

kf6gpe added the P3 Issues that are less important to the Flutter project label Dec 10, 2020

jmagman added this to Awaiting triage in iOS Platforms - text review Jun 8, 2021

mleonhard mentioned this issue Sep 19, 2021

RFC: Add interactive scroll to dismiss keyboard #76170

Closed

darshankawar added customer: crowd Affects or could affect many people, though not necessarily a specific customer. c: new feature Nothing broken; request for a new capability labels Jan 4, 2022

darshankawar mentioned this issue Jan 4, 2022

ScrollViewKeyboardDismissBehavior.onDrag has not the smooth iOS behavior #96033

Closed

darshankawar mentioned this issue May 13, 2022

ScrollView.keyboardDismissBehavior doesn't unfocus the keyboard properly #103544

Closed

Hixie removed the passed first triage label Jul 8, 2023

Matt2D mentioned this issue Jul 26, 2023

Flutter iOS Interactive Keyboard: Take Screenshot and Handle Pointer Movement flutter/engine#43972

Merged

8 tasks

This was referenced Aug 7, 2023

Flutter iOS Interactive Keyboard: Handle Pointer Up flutter/engine#44457

Merged

Flutter iOS Interactive Keyboard: Update Scroll View Widget #131895

Closed

Matt2D mentioned this issue Aug 8, 2023

Flutter iOS Interactive Keyboard: Fixing Animation Issue flutter/engine#44514

Merged

8 tasks

Matt2D mentioned this issue Aug 10, 2023

Flutter iOS Interactive Keyboard: Fixing Behavior Issue flutter/engine#44586

Merged

8 tasks

sherlockvn mentioned this issue Aug 15, 2023

Reduce Frame rate for Chat Screen when displaying/hiding keyboard linagora/twake-on-matrix#433

Open

This was referenced Oct 11, 2023

TW-725: Fix auto hide keyboard when scrolling and send msg linagora/twake-on-matrix#801

Merged

Keyboard is close in chat with scroll linagora/twake-on-matrix#725

Closed

This comment was marked as off-topic.

Sign in to view

flutter-triage-bot bot added the ⏳ Bot is counting down the days until it unassigns the issue label Dec 4, 2023

flutter-triage-bot bot removed the ⏳ Bot is counting down the days until it unassigns the issue label Dec 9, 2023

Hixie removed the multiteam-retriage-candidate label Mar 6, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Let iOS keyboard dismissal synchronize with scroll #57609

Let iOS keyboard dismissal synchronize with scroll #57609

xster commented May 19, 2020 •

edited

xster commented Aug 27, 2020

mleonhard commented Sep 5, 2021

furkansarihan commented Sep 6, 2021

mleonhard commented Sep 20, 2021

CavalcanteLeo commented Nov 1, 2021 •

edited

Tom3652 commented Dec 3, 2021

Kiruel commented Nov 17, 2022

CavalcanteLeo commented Nov 23, 2022

hellohuanlin commented Nov 23, 2022

mleonhard commented Nov 28, 2022

CavalcanteLeo commented Nov 30, 2022 •

edited

CavalcanteLeo commented Jul 16, 2023

hellohuanlin commented Jul 17, 2023

ky1vstar commented Oct 9, 2023 •

edited

abdalmonem commented Oct 9, 2023

abdalmonem commented Oct 10, 2023

This comment was marked as off-topic.

flutter-triage-bot bot commented Dec 4, 2023

cbracken commented Dec 7, 2023

cbracken commented Dec 7, 2023

hellohuanlin commented Dec 7, 2023

Let iOS keyboard dismissal synchronize with scroll #57609

Let iOS keyboard dismissal synchronize with scroll #57609

Comments

xster commented May 19, 2020 • edited

xster commented Aug 27, 2020

mleonhard commented Sep 5, 2021

furkansarihan commented Sep 6, 2021

mleonhard commented Sep 20, 2021

CavalcanteLeo commented Nov 1, 2021 • edited

Tom3652 commented Dec 3, 2021

Kiruel commented Nov 17, 2022

CavalcanteLeo commented Nov 23, 2022

hellohuanlin commented Nov 23, 2022

mleonhard commented Nov 28, 2022

CavalcanteLeo commented Nov 30, 2022 • edited

CavalcanteLeo commented Jul 16, 2023

hellohuanlin commented Jul 17, 2023

ky1vstar commented Oct 9, 2023 • edited

abdalmonem commented Oct 9, 2023

abdalmonem commented Oct 10, 2023

This comment was marked as off-topic.

flutter-triage-bot bot commented Dec 4, 2023

cbracken commented Dec 7, 2023

cbracken commented Dec 7, 2023

hellohuanlin commented Dec 7, 2023

xster commented May 19, 2020 •

edited

CavalcanteLeo commented Nov 1, 2021 •

edited

CavalcanteLeo commented Nov 30, 2022 •

edited

ky1vstar commented Oct 9, 2023 •

edited