I have some hardware sending input to my app, either by Bluetooth or wired hardware keyboard. At the moment I have a text field taking the input. I need the field to auto-focus when the screen loads, but without haivng the soft keyboard popup on focus.
I've tried autofocus attribute for HTML, but it messes with the view when I'm using Ionic.
I also tried using an angular directive, to focus after 500ms.
.directive('focus', function($timeout, $parse, $cordovaKeyboard) {
return {
restrict: 'A',
link: function(scope, element, attrs) {
$timeout(function() {
element[0].focus();
}, 500);
}
}
})
Is there a way of focusing without the soft keyboard displaying in both iOS and Android? I need the soft keyboard to popup only when the user clicks on the input field manually.
The other option would be to have a listener for any hardware keyboard inputs - but I can't see any way to do this in Cordova.
The solution for hide/show software keyboard in Ionic framework project is cordova-plugin-ionic-keyboard - see it on GitHub: https://github.com/ionic-team/cordova-plugin-ionic-keyboard
Short info is also in Ionic documentation: https://ionicframework.com/docs/native/keyboard
(Text was updated on 7th Jan 2020, because previously recommended extension ionic-plugin-keyboard is deprecated.)
Related
When I write into a line edit using the Android keyboard, and I press the "Done" button (screenshot below), the keyboard does not disappear. This happens even in a newly created project with just a line edit (I tested it).
How can I make "Done" to hide the keyboard?
Please note that I am looking for a developer solution (i.e. programming, not user oriented) and a native way (i.e. C++/Qt, not Java).
I'm using Qt 5.2.0.
You have to call the QInputMethod::hide() slot.
C++ Solution
connect(ui->lineEdit, SIGNAL(editingFinished()), QGuiApplication::inputMethod(), SLOT(hide()));
QML Solution
TextInput {
Keys.onEnterPressed: {
//...
Qt.inputMethod.hide()
}
Keys.onReturnPressed: {
//...
Qt.inputMethod.hide()
}
}
I am using PhoneGap (Cordovar 2.5) and jQuery Mobile 1.3.0. On iOS, whenever I focus on a text box, the keyboard shows and push up the page, but on Android it doesn't. I have tried to use android:windowSoftInputMode="" but no success. Please help.
In any part of you app (js file, of course) pus this script:
if(/Android 4\.[0-3]/.test(navigator.appVersion)){
window.addEventListener("resize", function(){
if(document.activeElement.tagName=="INPUT"){
window.setTimeout(function(){
document.activeElement.scrollIntoViewIfNeeded();
},0);
}
})
}
The answer was in: Android does not correctly scroll on input focus if not body element
does anybody knows how to force keyboard open on android browser (4.0 - maybe less)?
i tried this solution and it does not worked for me.
in project i am trying to get a text input working, but after submitting (intercept by jQuery) it holds focus but the keyboard disappears.
snippets:
$('#typer').blur(function () {
$(this).focus().click();
});
$('#typer').bind('keyup', function (e) {
var input = $.trim($(this).val());
// some lines of code..
$(this).val('').focus(); // clean up
}
iOS is also interesting.. but not tested yet.
Android pulls up soft keyboard whenever text input field is in focus. "Go" or "Done" button on Android works as form submit, therefore input text looses focus and keyboard disappears. User expects the keyboard to disappear after "Go", "Done" or "Enter" is pressed - so Android follows this rule. Forcing re-focus on field's blur will not do much since technically you moved to a different window.
$('body').click(function() { $('#typer').focus(); }
can provide a partial solution, whereby user has to click once anywhere in the body of the page for the typer to re-gain focus. It causes OS to move back to browser Activity and focus the input field. This fiddle shows it as an example: http://jsfiddle.net/Exceeder/Z6SFH/ (use http://jsfiddle.net/Exceeder/Z6SFH/embedded/result/ on your Android device)
Other than writing a PhoneGap-like wrapper to control imeOptions of the keyboard, I am not aware of any solution that can solve this problem.
I have an address search field in my app. When this field gets focus I want to open the keyboard as in the following image.
It works fine for iOS when the keyboard type is set to Titanium.UI.KEYBOARD_NUMBERS_PUNCTUATION as in the following code
var search = Titanium.UI.createSearchBar({
barColor:'#c8c8c8',
autocorrect:true,
hintText:'enter address',
height:'43dp',
top:'75dp',
autocapitalization: Titanium.UI.TEXT_AUTOCAPITALIZATION_WORDS,
keyboardType:Titanium.UI.KEYBOARD_NUMBERS_PUNCTUATION
});
However on Android it appears as in the following image.
I am using Titanium mobile SDK 1.7.5
You should probably add :
softKeyboardOnFocus : Titanium.UI.Android.SOFT_KEYBOARD_SHOW_ON_FOCUS
Unfortunately, it may be overridden by the system. Try it on another Android system (3.0 for example) if the problem persist.
I'm having some issues with the softkeyboard behaviour in flex 4.6 and air 3.1
I have a list with a search bar on top. When a user selects the TextInput component the softkeyboard pops up like it should.
Now when the user is done typing his text and presses the return (or the done/search/...) key I want the softkeyboard to disappear.
What I've tried so far:
I've set the returnKeyLabel property to "done" and the button shows
up accordingly. However it only dismisses the keyboard on Android, on
IOS the keyboard just stays up.
I then tried by not setting the returnKeyLabel and manually
catching the Return key and setting the focus to another element that
does not require a softkeyboard but that didn't work either.
I also tried by dispatching my own "faked" click events when the Return key was pressed but this also didn't work.
As part of searching about this problem I found this Dismiss SoftKeyboard in Flex Mobile but that didn't work either. Or at least not in flex 4.6
Now does anyone know of a good way to hide the softkeyboard or make the returnKeyLabel "done" work on IOS that will work with flex 4.6/air 3.1?
Have you tried something like this?
<s:TextInput prompt="First Name" returnKeyLabel="done" enter="handlerFunction()"/>
private function handlerFunction():void{
stage.focus = null
}
For flex mobile android apps I have mimicked the intuitive ios way of tapping on the background to remove the softkeyboard as follows:
import spark.components.supportClasses.*
protected function application1_clickHandler(event:MouseEvent):void
{
if(event.target is StyleableTextField || event.target is StyleableStageText){
// ignore because came from a textInput
}else{
stage.focus = null
// to remove the softkeyboard
}
}
<s:TextInput prompt="First Name" returnKeyLabel="done" enter="{stage.focus = null}"/>
This is the same as Francis' answer, but it saves having to make a new function