Issue with Phone keyboard behavior

Problem Description

Issue when you write into a TextBox and when the keyboard opens on the phone

Attach a Capx

https://drive.google.com/file/d/0B6C0RF ... sp=sharing

Description of Capx

This is a simple application that contains several TextBoxes. You need install this project on the phone, and test writing in the Text Boxs. When the TextBox is very close to the bottom of the screen, show a big black space or can’t open the keyboard or you can't see the TextBox. The behavior depends on the phone type, but all have problem (Windows Phone, IPhone and Android)

Steps to Reproduce Bug

Open this project on the phone Type in all Text Boxes Look at the behavior of the Text Boxes closer to the bottom when you type

Observed Result

When you type in the TextBox closest to the bottom, it show a big black space above the keyboard and under the Textbox or can’t open the keyboard or you can't see the TextBox.

Affected Browsers

The browsers are not affected because when you type it does't have a keyboard. So the problem only happens when you test in the phone

Operating System and Service Pack

Windows 10

Windows Phone 8.1

IPhone 9.3.4

Android 4.4

Construct 2 Version ID

R233 64bit

I thought i was the only one with this problem... Glad to see you post it here and hope somebody find a clue!

i have no such problem. position it to viewportbottom.

or,if you need textbox in upper part of screen-

layer0 is visible ->textbox.set position->viewportleft(0);viewportbottom(0)-textbox.height

textbox.set Y->viewportbottom(0)-textbox.y

textbox.set size->viewportright(0), viewportright(0)/6

Hi Axiomaltd,

Could you do the test and build the project to install in the Phone? The problem is when you touch a TextBox on the bottom, the phone keypad leaves a very large black space above it or it opens and closes immediately.

I can't reproduce the issue on iOS. In Safari it just shifts all the content up above the keyboard so you can always see the same content regardless of if the keyboard is open or not.

There is a problem in Chrome for Android, but it's not really a C2 bug, it's just an unfortunate consequence of the way Chrome handles the on-screen keyboard: when the keyboard comes up it actually fires resize events and causes the window size to change so it's reduced to just the area above the keyboard. Due to the fact you use "scale inner", this causes the aspect ratio to change, and then some text fields go off-screen so are hidden, and that causes the keyboard to be hidden if you tapped one of those text fields.

If you use letterbox mode it just scales down the entire view which keeps all the text fields on-screen and works OK. So really this is just a consequence of how Android handles bringing up the keyboard combined with the fullscreen mode you've chosen. It's similar to this bug, which Google are aware of and they plan to fix the keyboard to work like Safari to resolve issues like this. I assume it's a similar story on Windows Phone.

So closing as won't fix since it needs browser changes to work around. Alternatively you can just use letterbox scale.

Hi Ashley,

As I said earlier the problem is in applications in the phones, not the web browsers.

Sorry, but the scale type "LetterBox" does not work well on iPhone, Android, or Windows Phone.

I don't know if you built and installed the application on a phone to actually see the behavior, not only on the net or a browser because as we all know the behavior is not the same.

So we did the tests for the three phone companies and we made a video so you can actually see the problem.

In this link you can watch the six videos:

https://drive.google.com/folderview?id= ... sp=sharing

We tried scale "Inner" and "Letterbox" for each: iPhone, Android and Windows Phone.

Notice that the behavior is similar in Windows Phone and iPhone, but Android is different.

You said that with the "LetterBox" scale that it works well, but if you look at the video you will see that is incorrect.

LETTERBOX:

1) iPhone and WP reduce the entire screen but maintain the same size of the letters making the application look very ugly and unprofessional. In WP it is even worse as it leaves a rather large black space.

2) Android keyboard hides the "TextBox" and you can't see what is being written.

INNER:

1) With iPhone when you write in the "TextBox" # 5, it makes a space in black hiding all the application screen and you can't see anything being typed. In the "TextBox" # 4 you can see something but still, it shows a band in black leaving the application rather ugly.

2) With WP when you try writing in the "TextBox" # 5, the keyboard opens and closes suddenly and you can't write anything. Then in the "TextBox" # 4 you can write well, when you open the keyboard but there's also a very large black box that reduces vision to the size of the "TextBox".

3) With Android when you write in the "TextBox" # 5, # 4 and # 3 the keyboard covers the "TextBox" and you can't see what you're writing.

You say it's not a problem with C2, but hen how is it that all the three companies iPhone, Android and Windows Phone have a similar problem?

Is it not possible that the logic of C2 concerning this topic has an issue?

How is it possible for us to build an application that users can write, enter data, and function properly across all platforms as thousands of other applications that already exist do?

Hopefully these videos can serve to find some kind of solution.

We are trying to be constructive with our criticism; we do enjoy and see a lot of value in the Construct 2 software and we hope that it will keep getting better over time.

I have a solution, I think ....

Put a behavior "anchor" on your input or other items, with a "Scale inner".

I encountered this problem at some point.

It takes thought in mobile in Responsive

Hi Guillemantd,

I appreciate your help. I tested with the Anchor behavior, next I did the build and installed in the phone, but I'm still experiencing the same issue.

Regards

Experienced the same thing (black bar is left after hidding the keyboard) on an iphone 5 of a client of mine, but in my iphone 6 this does not happen, and the proyect resizesing scale inner when keyboard is out and then again when keyboard is hidden.

as for android i have problem with chrome, tablet is asus memopad hd7 and when running on browser the browser menu takes up a lot of space, proyect is 16:9 aspect ratio and is meant to work on landscape mode, when i try to type inside an input field, the keyboard pops up and then pops down like if there was not enough space for it to work, if i turn the tablet in portrait mode it works without problem.

as for ios running on 9.3.5

any help apreciated.

Hi Chewienator,

Unfortunately, I don't see much interest from Scirra in providing support to address this issue.

Ashley only tested on Android and still hasn't responded to messages I sent a month ago that included videos for each company showing exactly what the problem is.

Sorry to resurrect an old thread, but did you happen to find a possible solution? Having the same problem right now (space at the bottom).

Its been very long since this issue for me, i think what i remember doing was adding an event when the user tapped on the input field to trigger an external JavaScript function that would change the canvas position (i think it did not work using only C2, that's why i used an external function), so it has more room for the keyboard to pop up and let me type.

In my case it was a space issue that the keyboard could not pop up because the keyboard opened and blocked the input field i was trying to write on, so the default behavior for chrome was to hide the keyboard. when canvas moved upward i could see the input field and the keyboard could open up and remain open.

hope it helps you

Its been very long since this issue for me, i think what i remember doing was adding an event when the user tapped on the input field to trigger an external JavaScript function that would change the canvas position (i think it did not work using only C2, that's why i used an external function), so it has more room for the keyboard to pop up and let me type.

Sorry for bumping an old post. can u share the JS code please? Thanks for your help.