Jump to content

[TOPIC: topicViewTemplate]
[GLOBAL: userSmallPhoto]
Photo

Detect keyboard height
Started by krystian6 Sep 07 2014 01:45 PM

67 replies to this topic
[TOPIC CONTROLS]
Page 2 of 3 1 2 3
This topic has been archived. This means that you cannot reply to this topic.
[/TOPIC CONTROLS]
[modOptionsDropdown]
[/modOptionsDropdown]
[reputationFilter]
[TOPIC: post.html]
#26

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

Skatan, we're implementing panning support because that's the only cross-platform solution there is.  On iOS, my understanding is that you can only fetch the keyboard height when it has just been displayed.  On Android, there is zero means of fetching the keyboard height, which doesn't help you from a cross-platform standpoint (the original poster attempted this and failed).  So, this makes panning the winning solution.  Especially since this is the solution that all native apps use on both iOS and Android anyways and is what Apple and Google recommend.



[TOPIC: post.html]
#27

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 25,925 posts
  • Enterprise

It would seem to me that if you're already implementing a "move it above the keyboard" method, then that should still work.  If the text field is above the keyboard it shouldn't move it.  Or am I mis-undertanding the problem?

 

Rob



[TOPIC: post.html]
#28

Skatan

[GLOBAL: userInfoPane.html]
Skatan
  • Contributor

  • 547 posts
  • Corona SDK

Skatan, we're implementing panning support because that's the only cross-platform solution there is.  On iOS, my understanding is that you can only fetch the keyboard height when it has just been displayed.  On Android, there is zero means of fetching the keyboard height, which doesn't help you from a cross-platform standpoint (the original poster attempted this and failed).  So, this makes panning the winning solution.  Especially since this is the solution that all native apps use on both iOS and Android anyways and is what Apple and Google recommend.

 

But Joshua our app is only available on iOS right now... If we ever post it to Android we'd be more than happy to have a somewhat buggy design on there because there is no other possible option. But when this is obviously possible in iOS, why not just return it on iOS and return nil on Android for now (Until Google implements an API for this if they ever do)? Why restrict us to have to have a buggy iOS look and feel because the solution isn't possible on Android?

 

Edit: Just want to make clear that I don't mean drop the cross platform support, just to offer this value in addition to that so there is an awesome solution for all. My point is just when we can access this value on iOS, and it would make a massive difference for anyone using custom backgrounds on textfields, why not just let us be able to access it on iOS and whenever there is a solution for Android support Android as well. Why stifle it on iOS?



[TOPIC: post.html]
#29

Skatan

[GLOBAL: userInfoPane.html]
Skatan
  • Contributor

  • 547 posts
  • Corona SDK

It would seem to me that if you're already implementing a "move it above the keyboard" method, then that should still work. If the text field is above the keyboard it shouldn't move it. Or am I mis-undertanding the problem?

Rob


The problem is our textfields have custom backgrounds and this animation only moves the textfield on top of the keyboard, the background stays covered. If only we could get the keyboard height in the begin-phase of the textfield that is getting animated for example, we could do the animation by ourselves depending on the keyboard height. Having a forced animation do everything for us seems a bit unnecessary, even if it's a good cross-platform solution at least for iOS exclusive apps we can obtain the keyboard height and make much better tailored animations.

[TOPIC: post.html]
#30

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 25,925 posts
  • Enterprise

If you wish to use your own method of scrolling fields into view, you can now include this key-value pair in your build.settings: settings->iphone->plist table:

 

CoronaWindowLockedWhenKeyboardAppears=true

 

and that will disable our attempts to move the window into view.

 

Rob



[TOPIC: post.html]
#31

Skatan

[GLOBAL: userInfoPane.html]
Skatan
  • Contributor

  • 547 posts
  • Corona SDK

If you wish to use your own method of scrolling fields into view, you can now include this key-value pair in your build.settings: settings->iphone->plist table:

 

CoronaWindowLockedWhenKeyboardAppears=true

 

and that will disable our attempts to move the window into view.

 

Rob

 

And then we're back to square one.



[TOPIC: post.html]
#32

dbburgess

[GLOBAL: userInfoPane.html]
dbburgess
  • Observer

  • 11 posts
  • Corona SDK

Thanks for the flag to disable this. We already handle it manually in our own app, so that is helpful.

 

Just a heads up to everyone, there are some bugs with the implementation right now. It doesn't understand or respect the current orientation with regards to how it adjust the window. See the screenshots below of portrait, landscape, and upside down portrait for an example. To reproduce, just simply install the project from SampleApps/Interface/NativeDisplayObjects on an iOS device and activate the keyboard. In my testing, it didn't appear on every device or iOS version (maybe only limited to iOS 7 on iPad?).

 
MmRODw7.jpgPnnFjkX.jpgQRQz5ig.jpg


[TOPIC: post.html]
#33

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 25,925 posts
  • Enterprise

We still need a bug report for it to help Engineering track it.  Can you file one please?  You can use the sample app as your example code.

 

Thanks

Rob



[TOPIC: post.html]
#34

walter

[GLOBAL: userInfoPane.html]
walter
  • Moderator

  • 726 posts
  • Alumni

Actually, we already have one: 36831 (Native Textfield slides content incorrectly in Landscape mode).



[TOPIC: post.html]
#35

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 25,925 posts
  • Enterprise

This should be fixed in Daily build 2490.

 

Rob



[TOPIC: post.html]
#36

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

Everyone,

 

The next daily build (#2495) will have app panning support on Android.  As in the app window will automatically slide to reveal the TextField/Box that is currently being edited by the virtual keyboard into view.  Like iOS, we've made this a "build.settings" option that you have to opt-in to for support.  You can add support via the "build.settings" file like this...

settings =
{
   android =
   {
      coronaWindowMovesWhenKeyboardAppears = true,
   }
} 

I've personally tested this feature with TextFields and TextBoxes, in portrait and landscape orientations, and verified that the app window pans correctly when switching orientations (portrait to landscape and vice-versa) while the virtual keyboard is shown.  It all worked great during my testing.  And we've also successfully worked-around the Android OS' rendering bugs that I've mentioned earlier in this forum thread.

 

But please note that there is 1 caveat to using this feature on Android.  If your app displays a status bar, then that status bar will no longer be overlaid on top of your app, meaning that your app window will be displayed under the status bar.  Meaning that the pixel height of your app window will actually be shorter when using this feature.  Unfortunately, this is a limitation of the Android operating system when setting up an app to automatically pan itself when the keyboard is shown and is by Google's design.  Another side-effect of this is that sometimes your app window's pixel height might suddenly change when transitioning from another app that has a status bar to your app that doesn't have a status bar (and the reverse is true too).  This is actually normal for an Android app.  But please note that Corona does correctly handle this situation, will trigger a Lua "resize" event, and will rescale your app (if you're using content scaling) in this case.  Just something to watch out for.  Depending on how your app is set up, this side-effect may not affect you at all.

 

In any case, please give this feature a go and let us know how well you think it works.



[TOPIC: post.html]
#37

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

Oh and I have one other alternate solution that'll work on Android and iOS, if you're willing to do it.

 

Instead of setting up your app to automatically slide/pan when the keyboard is shown via our new build.settings feature, you can instead add your native TextField and TextBoxes inside of a widget ScrollView.  I've tested this on Android and the Mac Corona Simulator and confirmed that native UI objects will scroll within a ScrollView.  However the big limitation here is that native UI cannot be masked by the ScrollView, nor can you show display objects on top of them, because native UI is always overlaid on top of Corona's OpenGL scene.  But that said, a solution to the masking problem would be to display the ScrollView fullscreen within your app to avoid that masking problem.  So, the advantage of this solution is that you can code your ScrollView to scroll up to the TextField/Box that has the focus and it's okay to make an assumption about the keyboard height, because the end-user has the ability to scroll the rest of the TextField/Box into view.



[TOPIC: post.html]
#38

TandG

[GLOBAL: userInfoPane.html]
TandG
  • Contributor

  • 422 posts
  • Corona SDK

Awesome, thats for the info Joshua. I'll give the Android version a go soon!



[TOPIC: post.html]
#39

nahmeenstudios

[GLOBAL: userInfoPane.html]
nahmeenstudios
  • Enthusiast

  • 46 posts
  • Corona SDK

I am trying to use coronaWindowMovesWhenKeyboardAppears.  It works in Android but not iOS.  I added it to the plist.  Does anyone have this working on iOS?  Not sure what I could be doing wrong.  



[TOPIC: post.html]
#40

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 25,925 posts
  • Enterprise

coronaWindowMovesWhenKeyboardAppears should be CoronaWindowMovesWhenKeyboardAppears when inside the iphone->plist table.  The lower case version is for the Android table.  Everything in the iphone->plist  is "Pascal cased", that its it starts with a capital letter.  Android uses camelCase where the first letter is lower cased.

 

Rob



[TOPIC: post.html]
#41

coronaent

[GLOBAL: userInfoPane.html]
coronaent
  • Enthusiast

  • 61 posts
  • Corona SDK

I don't understand. When Corona can move the whole window up to exact Y location above keyboard, it means Corona is able to know the keyboard height, and make the adjustment accordingly. But why can't Corona open up that API to let everyone know the keyboard height? 

 

Correct me if I am wrong, because I don't know about the very details.



[TOPIC: post.html]
#42

Joshua Quick

[GLOBAL: userInfoPane.html]
Joshua Quick
  • Moderator

  • 3,397 posts
  • Corona Staff

On Android, you cannot fetch the keyboard height.  We've discussed this at the beginning of this thread (page 1).  Instead, you tell the Android operating system to move your app for you via its "adjustPan" feature.



[TOPIC: post.html]
#43

Maciej C

[GLOBAL: userInfoPane.html]
Maciej C
  • Observer

  • 25 posts
  • Corona SDK

Hi All,

 

I want to make a list of most popular devices and their keyboard height. It would be great if everyone who has an Android Device  would check their keyboard height and place the result  here: https://docs.google.com/a/insys.pl/spreadsheets/d/1s9Pjrs7QoK-wJvqvzhGEI17wvrD3PS3jbRVEdrFWIu0/edit#gid=0

 

It is not perfect but it might help a little bit. Just take a screenshot of any app screen with keyboard open and mesure in px how tall it is. I will update all my devices till the end of the week. 

 

With this, we will have a good start for preparing lib to rerutn keyboard height for each device.



[TOPIC: post.html]
#44

krystian6

[GLOBAL: userInfoPane.html]
krystian6
  • Contributor

  • 560 posts
  • Corona SDK

Maciej C: how would you like to handle different keyboards?

There are tons of them in the marketplace + you can set different height + you can have split keyboards etc..

I think you are wasting your time.



[TOPIC: post.html]
#45

jennsand

[GLOBAL: userInfoPane.html]
jennsand
  • Observer

  • 2 posts
  • Corona SDK

I'm trying to use the CoronaWindowMovesWhenKeyboardAppears options for both iOS & Android.

 

Initially I was using native.newTextField, but then I needed to change to native.newTextBox so I could have longer text entry.

 

The textBox appears to work fine on Android (it scrolls up and behaves pretty similarly to the textField). However, on iOS the scroll up is not working if I use a textBox. If I switch back to a textField it works.

 

I've personally tested this feature with TextFields and TextBoxes, in portrait and landscape orientations, and verified that the app window pans correctly when switching orientations (portrait to landscape and vice-versa) while the virtual keyboard is shown.  It all worked great during my testing.  And we've also successfully worked-around the Android OS' rendering bugs that I've mentioned earlier in this forum thread.

 

It looks like the textBox implementation is supposed to work on both iOS and Android.

 

Is anyone else having problems for TextBoxes on iOS? Has something changed that might have made it fail?

 

Looks like I'm going to have to switch back to using a TextField on iOS unless this is fixed.

 

Note: currently using Version 2015.2675 (2015.7.7)



[TOPIC: post.html]
#46

Skatan

[GLOBAL: userInfoPane.html]
Skatan
  • Contributor

  • 547 posts
  • Corona SDK

I'm trying to use the CoronaWindowMovesWhenKeyboardAppears options for both iOS & Android.

 

Initially I was using native.newTextField, but then I needed to change to native.newTextBox so I could have longer text entry.

 

The textBox appears to work fine on Android (it scrolls up and behaves pretty similarly to the textField). However, on iOS the scroll up is not working if I use a textBox. If I switch back to a textField it works.

 

 

It looks like the textBox implementation is supposed to work on both iOS and Android.

 

Is anyone else having problems for TextBoxes on iOS? Has something changed that might have made it fail?

 

Looks like I'm going to have to switch back to using a TextField on iOS unless this is fixed.

 

Note: currently using Version 2015.2675 (2015.7.7)

 

Same issue here. Also using a textbox. Tried giving the iOS panning a go but it isn't working for me neither on device



[TOPIC: post.html]
#47

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 25,925 posts
  • Enterprise

This is an experimental feature and we know there are issues on iOS. I don't know if textBoxes are supposed to be included or not.

 

Rob



[TOPIC: post.html]
#48

Skatan

[GLOBAL: userInfoPane.html]
Skatan
  • Contributor

  • 547 posts
  • Corona SDK

I still can not understand why were not allowed to just get the keyboard height on iOS, when the alternative clearly isn't even working. The panning feature sacrifices so much in the name of *one* solution that kind of works on all platforms.

 

How about one solution that works perfectly on iOS forever, and then whatever solution for Android on Android? Why isn't it being implemented this way?



[TOPIC: post.html]
#49

Rob Miracle

[GLOBAL: userInfoPane.html]
Rob Miracle
  • Moderator

  • 25,925 posts
  • Enterprise

We try to keep Android and iOS platforms as close to possible and this is simply not something we can get on Android.

 

Rob



[TOPIC: post.html]
#50

Skatan

[GLOBAL: userInfoPane.html]
Skatan
  • Contributor

  • 547 posts
  • Corona SDK

We try to keep Android and iOS platforms as close to possible and this is simply not something we can get on Android.

 

Rob

 

 

Is there a fix for this scheduled any time soon?




[topic_controls]
Page 2 of 3 1 2 3
 
[/topic_controls]