Avoid fullscreen text entry UI in landscape mode #1842

mchowning · 2020-01-30T16:54:13Z

Summary

On Android when we are editing a paragraph block in landscape mode and you press the done button, an "Enter" keypress is registered. Therfore, the block is split at the point of the cursor. @iamthomasbishop indicated that the "Done" button should just close the keyboard, but that he would prefer not have the "full screen" editing type view when in landscape mode. Conveniently enough, the preferred solution is actually easier to implement. 😄 I would like to get @iamthomasbishop 's sign-off on this first though to make sure he's ok with how the view is mostly taken up by the keyboard.

But What Does It Look Like?!?!?

I'm glad you asked!

Before	After

To Test

Open post with paragraph block
Select paragraph block so that keyboard displays
Switch the phone to landscape mode
Observe that the phone looks like the "After" picture ^above^ (i.e., there isn't a "Done" button).

PR Submission Checklist

I have considered adding unit tests where possible.
I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

iamthomasbishop · 2020-01-30T16:58:05Z

This feels much more natural, imo. One tiny thing (which may be solved by this proposal if we work on it) is that there seems to be a momentary "stutter" in adjusting the border styling upon rotation in your last gif above, where it attempts to switch from top/bottom-only borders (in portrait) to full borders w/ rounded corner (in landscape).

iamthomasbishop · 2020-01-30T16:59:45Z

One other thing, and we might want to tackle it separately. Do we want to automatically hide the keyboard upon rotation? I'm not 100% sure, just think it'd make the effects more visible.

mchowning · 2020-02-04T16:21:34Z

Thanks for the comments @iamthomasbishop !

One tiny thing (which may be solved by this proposal if we work on it) is that there seems to be a momentary "stutter" in adjusting the border styling upon rotation in your last gif above, where it attempts to switch from top/bottom-only borders (in portrait) to full borders w/ rounded corner (in landscape).

This stutter is pretty noticeable on Android whereas I don't really notice it iOS. I suspect it may be tricky to address, so IMO it would be better to address it separately.

One other thing, and we might want to tackle it separately. Do we want to automatically hide the keyboard upon rotation? I'm not 100% sure, just think it'd make the effects more visible.

We could certainly do that. A few questions... Would you want this on both platforms or just on Android? If both, on iOS currently I believe that dismissing the keyboard generally also removes focus from the block, so would you want to lose focus on rotation as well on iOS, or do you not have a strong preference? Also, do you have a strong preference on whether we also dismissed the keyboard when rotating from landscape to portrait? FWIW, making the keyboard dismiss on Android will be pretty easy. At this point, I'm not sure how difficult that would be on iOS.

One interesting and unexpected (to me at least) side effect of dismissing the keyboard on Android is that dismissing the keyboard on rotation creates enough "movement" on the screen during rotation that the stutter you mentioned is actually much less noticeable (to my eyes at least).

iamthomasbishop · 2020-02-05T17:06:25Z

This stutter is pretty noticeable on Android whereas I don't really notice it iOS. I suspect it may be tricky to address, so IMO it would be better to address it separately.

Sounds good 👍

Would you want this on both platforms or just on Android? If both, on iOS currently I believe that dismissing the keyboard generally also removes focus from the block, so would you want to lose focus on rotation as well on iOS, or do you not have a strong preference?

That's a good point. After thinking about this again, I think we should probably just simplify the whole situation and leave it as it currently is (don't remove focus/hide keyboard). While hiding the keyboard would certainly clear space, removing the focus might feel like a bug in practice (and require the user to re-select the block).

cameronvoell

Looks good! Nice improvement. Tested on Samsung S10, Galaxy Tab S3 on API 29 and Emulator Pixel 2 running API 22.

cameronvoell · 2020-02-05T18:49:50Z

...native-aztec/android/src/main/java/org/wordpress/mobile/ReactNativeAztec/ReactAztecText.java

@@ -138,6 +139,7 @@ public void onSelectionChanged(int selStart, int selEnd) {
                ReactAztecText.this.propagateSelectionChanges(selStart, selEnd);
            }
        });
+        this.setImeOptions(getImeOptions() | EditorInfo.IME_FLAG_NO_EXTRACT_UI);


This is a great improvement! Read through IME options here and agree IME_FLAG_NO_EXTRACT_UI looks like the right choice.

mchowning · 2020-03-09T16:17:37Z

Hey @iamthomasbishop ! I was looking at this in the WPAndroid app, and I think we may want to revert this change. With the app toolbar virtually no space is left above the keyboard for the post, which results is a pretty poor experience. 😞 WDYT?

iamthomasbishop · 2020-03-09T16:24:45Z

Agreed that's not great, although tbh landscape w/ any sort of text editing is quite restrictive considering the height of the keyboard. In the long run, I think we might want to consider a more flexible/collapsing app bar — which would help a lot — but for the time being, we can probably revert.

…t-keyboard-landscape" This reverts commit 5041096, reversing changes made to ddb8b3f.

#1989) * Revert "Merge pull request #1842 from wordpress-mobile/issue/1829_soft-keyboard-landscape" This reverts commit 5041096, reversing changes made to ddb8b3f. * Remove release note for reverted landscape mode change

mchowning added [OS] Android [Status] Needs Design Review Needs design review or sign-off before shipping bugfix labels Jan 30, 2020

mchowning added this to the 1.22 milestone Jan 30, 2020

mchowning requested review from cameronvoell, iamthomasbishop and marecar3 January 30, 2020 16:54

cameronvoell approved these changes Feb 5, 2020

View reviewed changes

etoledom modified the milestones: 1.22, 1.23 Feb 10, 2020

mchowning modified the milestones: 1.23, 1.24 Feb 20, 2020

Avoid fullscreen text entry UI in landscape mode

3723be0

mchowning force-pushed the issue/1829_soft-keyboard-landscape branch from c8b7866 to 3723be0 Compare February 20, 2020 23:04

mchowning merged commit 5041096 into develop Feb 20, 2020

mchowning deleted the issue/1829_soft-keyboard-landscape branch February 20, 2020 23:52

mchowning mentioned this pull request Mar 9, 2020

Rotating the device toggles off formatting options #1982

Open

mchowning added a commit that referenced this pull request Mar 9, 2020

Revert "Merge pull request #1842 from wordpress-mobile/issue/1829_sof…

cef60f9

…t-keyboard-landscape" This reverts commit 5041096, reversing changes made to ddb8b3f.

mchowning mentioned this pull request Mar 9, 2020

Revert back to using extracted editing UI in landscape mode on Android #1989

Merged

2 tasks

maxme mentioned this pull request Apr 1, 2020

Cannot dismiss keyboard while editing in landscape mode on Android #2089

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Avoid fullscreen text entry UI in landscape mode #1842

Avoid fullscreen text entry UI in landscape mode #1842

mchowning commented Jan 30, 2020 •

edited

Loading

iamthomasbishop commented Jan 30, 2020

iamthomasbishop commented Jan 30, 2020

mchowning commented Feb 4, 2020

iamthomasbishop commented Feb 5, 2020

cameronvoell left a comment

cameronvoell Feb 5, 2020

mchowning commented Mar 9, 2020 •

edited

Loading

iamthomasbishop commented Mar 9, 2020

Avoid fullscreen text entry UI in landscape mode #1842

Avoid fullscreen text entry UI in landscape mode #1842

Conversation

mchowning commented Jan 30, 2020 • edited Loading

Summary

But What Does It Look Like?!?!?

To Test

PR Submission Checklist

iamthomasbishop commented Jan 30, 2020

iamthomasbishop commented Jan 30, 2020

mchowning commented Feb 4, 2020

iamthomasbishop commented Feb 5, 2020

cameronvoell left a comment

Choose a reason for hiding this comment

cameronvoell Feb 5, 2020

Choose a reason for hiding this comment

mchowning commented Mar 9, 2020 • edited Loading

iamthomasbishop commented Mar 9, 2020

mchowning commented Jan 30, 2020 •

edited

Loading

mchowning commented Mar 9, 2020 •

edited

Loading