mozilla/webmaker-core

Android keyboard blends into app UI when editing the Text Element

Open

#113 opened on Jul 14, 2015

View on GitHub
 (0 comments) (0 reactions) (0 assignees)JavaScript (31 forks)auto 404
designhelp wanted

Repository metrics

Stars
 (63 stars)
PR merge metrics
 (PR metrics pending)

Description

This issue has been migrated from mozilla/webmaker-android#1840.

It was originally written by flukeout on Tue May 12 2015 and had the following description:

Hey **@**vazquez - what do you think about this? I feel like the keyboard grey clashes here with the underlying UI, which makes things confusing.

What do you think of hiding the other UI while the keyboard is open and leaving more room for the text editing? Let me know your thoughts - the screenshot is from a WIP build by **@**Pomax

image

Another question - what do you think is a good UX for dismissing they keyboard? I suggest we have an explicit action for it, maybe we can replace the "Edit Text" button with "Done"?

image

If we do that, we should probably change the color to green or blue or something, so that it stands apart from the keyboard and also changes from the "Edit Text" button.

On Wed May 13 2015, thisandagain commented:

I believe **@**vazquez spec-d the "Material Dark" keyboard, correct?

On Wed May 13 2015, flukeout commented:

**@**Pomax is investigating wether we have control over the color scheme, the dark theme would help.

On Wed May 13 2015, thisandagain commented:

Just ran a test by switching the entire application theme from android:Theme.Material.Light.DarkActionBar to android:Theme.Material to see if the webview would inherit the dark keyboard ... it doesn't. :frowning:

On Thu May 14 2015, vazquez commented:

:crying_cat_face:

That is a bummer. However, I don't think this is critical. Re-skinning the keyboard is one of the first things an Android user does to their device. Therefore I would be hesitant to modify the UI so much based on an easily customizable user setting.

Fleksy: 1,000,000 - 5,000,000 Installs Swift: 10,000,000 - 50,000,000 Installs GO Keyboard Lite + Emoji: 50,000,000 - 100,000,000 Installs

What about, instead of hiding UI, making the preview the size of the remaining viewport when the user has the keyboard open?

screenshot 2015-05-14 10 07 05

On Thu May 14 2015, vazquez commented:

Regarding dismissing the keyboard: When the keyboard is open, the bottom bar changes a bit. The System back button now becomes a hide keyboard button.

screenshot 2015-05-14 10 09 39

Also, the keyboard would have a "Done" button

screenshot 2015-05-14 10 11 55

I think we should leverage off the user's learned behaviour of the above actions. Do you think we need more ways of showing a 'submit' action?

On Thu May 14 2015, flukeout commented:

**@**vazquez Have a look below and let me know your thoughts. My bottom bar doesn't change when the keyboard is open - is that something we can change webview, **@**thisandagain ?

  • Are we able to add an Enter key for line breaks **@**Pomax

image

Complete Diagram

On Fri May 15 2015, vazquez commented:

Yes, I think that would work for the grey issue + the interface would also allow for more focus when typing. :+1:

Contributor guide