I'm developing a iPhone app using PhoneGap. In the app there is a page contains only one textarea for user's input. As there is no other input field on this page, I want to hide the toolbar above the keyboard to give user more free space. Is there any way to do so? using javascript
you can Hide it by adding this to config.xml:
<preference name="HideKeyboardFormAccessoryBar" value="true"/>
http://docs.phonegap.com/en/3.4.0/config_ref_index.md.html#The%20config.xml%20File
I don't know whether this is directly possible with phonegap API but you can change this behavior with native code by writing a PhoneGap plugin to do that.
Refer below links for more detail (they are not exact but will give you the required detail):
Programmatically align a toolbar on top of the iPhone keyboard
http://gabriel-tips.blogspot.in/2011/05/input-accessory-view-how-to-add-extra.html
Try this cordova plugin
https://github.com/don/KeyboardToolbarRemover
Answered on this duplicate thread too Phonegap iOS6: Proper solution to Remove form assistant bar (prev, next, done)
There is a way. This guy has done it by making modifications in the AppDelegate.m. You can find description at this link under bonus code section.
You can also refer the code for same developed by Kerri Shotts Code Here
Now that the done button is gone i am trying to figure out how to make the keyboard disappear. This will be everybody's next step.
Related
Minor bug I'm trying to fix on Android devices accessing a site.
Flow goes like this:
User inputs text, list returns answers.
User clicks li element, is scrolled to the next page (ng Anchorscroll).
User is then at the top of next page, and can enter next input.
This is fine on iOS and web, but the keyboard is blocking on Android.
I hope this doesn't violate SO terms, but here is a video of the problem with my web app (I won't upload the code).
https://youtu.be/YwXRV_APMOQ
I have tried using conditions such as ‚ "if Androiddocument.activeElement.scrollIntoViewIfNeeded();
On resize $(input).focus();, and even onclick="window.location.href="#destination"
But none are working.
Looking for some sort of work around or help, thanks! :)
Found a work around. On click, focus on the next input. This pulls the input into the screen on Android, which is the behaviour needed.
(I've used Angular method, but can you any language)
How to set focus on input field?
This seems like it could be a bug, but as with all things i'm sure there is also a work-around. The problem description is this; using cordova to develop an android app with a simple page with some textfields, when typing into those fields on the app the softkeyboard appears so that you can enter text, but then when you either "enter" or focus on another element, the keyboard fades away but leaves the "ActionBar" at the bottom of the view.
The ActionBar remains, and if one's app is designed to run full screen - the action bar may overlap app content. The ActionBar itself cannot be swiped down or removed by the end user except for swiping down from the very top (the title bar) then swiping back up again.
This seems to be an issue as of Android 6.0.0 or perhaps I just wasn't noticing it before.
I've noticed that with the plugin cordova-plugin-dialogs that when i use the alert dialog after i close it, the actionbar hides, but I think that ultimately the scenario that would work best is that after X-timeout from typing in a textfield and/or the softkeyboard fades out, the ActionBar should fade out too.
Any suggestions on how to manage the Android ActionBar in PhoneGap - I've seen some other similar questions but generally asking how to show it, seems like getting it to hide is less popular?
After much searching I was able to determine that the phonegap fullscreen setting doesn't necessarily give way to full "immersive" mode by default. After adding the plugin cordova-plugin-fullscreen and setting the immersive mode from the plugin, I was able to resolve this issue.
https://www.npmjs.com/package/cordova-plugin-fullscreen
I am using Cordova 3.5 and jQuery mobile to build an iOS app. I have disabled scrolling in most of the app; however, when I select an input field, the iOS keyboard opens and scrolls the page up. I do not want this functionality. Since the input is high enough that the keyboard would not cover it up, I want the page to remain still while the keyboard covers up the bottom part of the page.
This question is similar to a number of others like this one, and is the opposite of the problem posted here.
However, none of the posted answers worked for me, so I will post my solution here.
Add this plugin with
cordova plugin add https://github.com/driftyco/ionic-plugins-keyboard.git
in the command line.
Add the following line anywhere it the javascript to disable scrolling from the keyboard.
cordova.plugins.Keyboard.disableScroll(true);
In my use case, I added a deviceready event listener to evaluate this line, disabling the automatic keyboard scrolling everywhere in the app.
That's it!
From my experience, and saying this as a developer who avoids 3rd party plugins as much as possible, I've found that virtual keyboard issues in Cordova are best solved with a plugin.
The Cordova plugin directory has several keyboard plugins
(http://cordova.apache.org/plugins/?q=keyboard)
I recommend the following plugin:
https://github.com/cjpearson/cordova-plugin-keyboard
Which provides the following command to disable scrolling when the virtual keyboard is open.
cordova.plugins.Keyboard.disableScrollingInShrinkView(true);
After a lot of research I found a really simple answer and none of the others worked.
In your css do:
html {
touch-action: none;
}
body {
touch-action: all;
}
Hi i'm writing a "Quit" (exit button) i want it take me to the main menu of android existing applications i'm using javascript ,css and HTML it's a mobile application written with HTML5
Any idea please
There is nothing you can do to achieve this. Android does not permit it.
My application generates a link from the song that is currently playing. My idea is to set a button with a click event that copy the link to the clipboard.
I've seen solutions like zeroclipboard but flash isn't allowed, so it should be just javascript.
From what I can remember, this only works in Flash. I think the best workaround is to put the text in an input box and instruct the user to copy it manually.
Yeah... Don't do that.
Train your users to use drag-and-drop (which works fine for HTML links without any "clever" hacks). They will thank you for it.
If you can't achieve what you want with drag-and-drop, submit a bug against the application you're trying to drag-and-drop into.
It's not going to work:
>> document.queryCommandEnabled('Copy')
false