Win a copy of The Little Book of Impediments (e-book only) this week in the Agile and Other Processes forum!
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

HTML/JS How to check if the touchscreen keyboard is open?

 
Chris Baron
Ranch Hand
Posts: 1061
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi,
is there a way to check if the touchscreen keyboard is open with JavaScript?
I have layout issues here if the orientation is changed while the keyboard open or the back button was hit to remove it.

Thanks
cb
 
Robin Nixon
Author
Ranch Hand
Posts: 48
Android Eclipse IDE PHP
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'm not sure if this question is directed at me. But in my book I show how to get around this issue by creating your own soft keyboard (it's quite easy in HTML5 and CSS3). You can get just the layout you want, call it up exactly when and how you want, and never worry about what the operating system wants to do. That was my solution to the problem, anyway.
 
Chris Baron
Ranch Hand
Posts: 1061
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thanks Robin,
the question wasn't only directed at you

But i don't want to build keyboards for all sorts of languages.
There must be a better way.

cb
 
Robin Nixon
Author
Ranch Hand
Posts: 48
Android Eclipse IDE PHP
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
As far as I was able to determine the only way to detect the presence or not of the software keyboard is to maintain an interrupt that monitors your contents dimensions and then calls relevant functions you write according to whether it has been enlarged or reduced (in other words the keyboard has popped up or down). In my view this is a glaring omission by Google who ought to have created an event for this from the very start.

If you do choose to create your own keyboard (rather than playing with monitoring content dimensions) another benefit is that you can get the keyboard just how you want with only the keys needed for your app, and it will also look identical on iOS (if you want it to) if your app is created in HTML5/CSS3. It's an easy matter to save data for different key layouts for other languages too, at minimal memory overhead. I have attached an example of a custom keyboard I created for a chat app.

keyb.jpg
[Thumbnail for keyb.jpg]
The keyboard for the chat app in my book
 
Chris Baron
Ranch Hand
Posts: 1061
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hi Robin,
i see the advantages of a self implemented keyboard but also the disavantages.
You'd have to collect all the local key layouts and special characters for all languages.
My Z is where your Y is for example and i have ß,Ä,Ö and Ü here.

Is there a good open source keyboard JS lib/framework somewhere for this task?
Othrewise it's less effort to listen to the resize event you mentioned and find out by calculation whether the keyboard is open or not.

Thanks again Chris
 
Robin Nixon
Author
Ranch Hand
Posts: 48
Android Eclipse IDE PHP
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
If it helps, I did find the following pages, which might be good for digging up more info:

http://developer.android.com/reference/android/R.attr.html#windowSoftInputMode
http://developer.android.com/reference/android/inputmethodservice/Keyboard.html
 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic