Poor UX: cursor hidden behind soft keyboard on initial tap
Is there an existing issue for this?
- [X] I have searched the existing issues
Flutter Quill version
10.4.0
iOS simulator, (and some low end Android device)
Steps to reproduce
- Open Flutter Quill Demo from the
examplefolder - Go to
Textsample - Tap the text somewhere on the bottom half of the screen, e.g. where
Create a Bujo of Ledgeris
Expected results
Keyboard appears and I can see the cursor where I tapped:
Actual results
Keyboard appears but the cursor is hidden behind the keyboard as the text scroll position did not adjust.
Tapping any key on the keyboard will make cursor visible again.
Code sample
No response
Additional Context
Workaround
Here's something I came up real quick to mitigate this issue
- Listen to keyboard visibility changes
- If keyboard becomes visible
- wait around 300ms for things to settle 😬
- call
ensureCursorVisibleextension method on the controller (this will re-trigger positioning):
extension QuillControllerInvisibleCursorFix on QuillController {
void ensureCursorVisible() {
if (selection.isCollapsed) {
final position = selection.end;
moveCursorToPosition(position);
}
}
}
Ideally this is handled by library, which should know cursor got pushed outside of viewport and react accordingly.
...so commenting out this section in raw_editor_state.dart
makes the simulator behave as expected. That said, we initially encountered this issue on a real device.
I still can't find the definitive information whether callback from flutter_keyboard_visibility happens before or after the keyboard is shown:
- https://github.com/MisterJimson/flutter_keyboard_visibility/issues/108
- https://github.com/MisterJimson/flutter_keyboard_visibility/issues/121
- https://github.com/MisterJimson/flutter_keyboard_visibility/issues/122
most likely before tho
I've examined the plugin a bit on iOS. The keyboard is reported as visible as soon as system knows the keyboard will appear (no difference between didShow, willShow) :
https://github.com/MisterJimson/flutter_keyboard_visibility/blob/master/flutter_keyboard_visibility/ios/Classes/FlutterKeyboardVisibilityPlugin.m#L43
This in turn can cause wrong calculation of the offset in QuillRawEditorState._showCaretOnScreen since _scrollController.position.viewportDimension will not be updated to the shrunk size.
It would be nice to decouple flutter_quill library from the flutter_keyboard_visibility library (since it seems a bit stale) and make e.g. ValueNotifier<bool> keyboardVisible a field you need to provide to the editor. This way you could use any other implementation freely.
Other than that, I still wonder why we treat iOS Simulator differently from iOS. This leads to extra bug reports, doesn't it? 🤔 /cc @singerdmx
Does this issue still persists? If not i will close it.
Does fixing this issue in a clean way require native code? Is it only for mobile?
Does this issue still persists? If not i will close it.
Should still be an issue
This is still an issue and I'm able to reproduce on both Android and iOS, physical and simulated.