Alter keyboard appearance in native, phonegap/Cordova built iOS App

Question

I want to change the background color of all the keyboards appearing in my Phonegap/Cordova built native iOS App as shown below:

I have googled this thoroughly of course and found mainly 2 relevant answers. The answerer here says that Objective-C code can be added to the PhoneGap project's AppDelegate.m file as shown on this page. I've located the AppDelegate.m file but can't seem to figure out how to set the keyboard appearance to that of UIKeyboardAppearanceAlert on all textfields. Code example provided by the answerer:

 mytextfield.keyboardAppearance = UIKeyboardAppearanceAlert;

Writing an app based on cordova, I can't distinguish any textfield IDs to connect to the above example. Is there a file in Xcode / Cordova in which all the textfield IDs are listed, or even better:

Is there a way in which I can set the keyboard appearance to dark through UIKeyboardAppearanceAlert or similar approaches, that applies to all textfields and is compatible with Cordova?

Thanks

Towbin

Answer 1

After sharing this question widely on various social media, more extensive and thorough research, asking friends and aquaintances, etc I can only come to the conclusion that this cannot be done using phonegap and cordova. I would love for anyone to prove me long. For the time being however, this is what I shall conclude.

Towbin

Answer 2

As far as I know you can't do that with Cordova without major hacks, which probably won't be appreciated by Apple. But not sure.

Agueda

Answer 3

There is no way to apply it to ALL text fields in your app without going through your code and manually setting the style of each uitextfields keyboard to the dark one.

EDIT 2: Unfortunately, it doesn't look like there's any possible way to do this without tapping into the Phonegap framework. And It doesn't look like this is possible without "hacking" into it as mentioned above.

EDIT: There doesn't seem to be any HTML element for the input tag (from Apple's Mobile Safari or Phonegap) that you can set to make the appearance into a alert. So (if possible) do a search for UITextField *.

And right under the line that should look somewhat like this:

UITextField *field = [[UITextField alloc] init...];

Add this line

field.keyboardAppearance = UIKeyboardAppearanceAlert; // just like in your example...

If you do this for all the UITextField results then all your keyboards will look like the picture in your description.

Ability

Okay so how do you target textfields set by cordova/phonegap? Fill me in on that one and I'll gladly sign the bounty in your name.. – Towbin

@Towbin see my edit. If you need any more help just let me know :) – Ability

Thank you, unfortunately the search for UITextField * and simply UITextField dit not yield any results :( I guess one like myself needs better understanding of the fundamental architecture of Cordova in order to do such a thing. But I'll keep trying. Any further suggestions? Hack as suggesting above perhaps? Thanks – Towbin

In the version I'm running, it seems as if i can change lines so at least this version may be open source, but I have no idea where to start, what do add or change and where. Anyhow, I guess that's it then, it's simply not possible. – Towbin

@Towbin yep, sorry about that. You may be able to do it through a plugin, but to be perfectly honest, I haven't played around with PhoneGap for a while and they didn't even have plugins when I was using it so I can't be of much help there. – Ability