-
Notifications
You must be signed in to change notification settings - Fork 2.4k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
The keyboard module doesn't seem to work with cordova-plugin-ionic-keyboard #2306
The keyboard module doesn't seem to work with cordova-plugin-ionic-keyboard #2306
Comments
Hope it helps import { Injectable } from '@angular/core';
import { Cordova, CordovaProperty, IonicNativePlugin, Plugin } from '@ionic-native/core';
import { Observable } from 'rxjs/Observable';
/**
* @name IonicKeyboard
* @description
* @usage
* ```typescript
* import { IonicKeyboard } from '@ionic-native/ionic-keyboard';
*
* constructor(private keyboard: IonicKeyboard) { }
*
* ...
*
* this.keyboard.show();
*
* this.keyboard.close();
*
* ```
*/
@Plugin({
pluginName: 'IonicKeyboard',
plugin: 'cordova-plugin-ionic-keyboard',
pluginRef: 'window.keyboard',
repo: 'https://github.com/ionic-team/cordova-plugin-ionic-keyboard',
platforms: ['Android', 'iOS']
})
@Injectable()
export class IonicKeyboard extends IonicNativePlugin {
/**
* Hide the keyboard accessory bar with the next, previous and done buttons.
* @param hide {boolean}
*/
@Cordova({ sync: true })
hideFormAccessoryBar(hide: boolean, successCallback: () => any): void { }
/**
* Force keyboard to be shown.
*/
@Cordova({
sync: true,
platforms: ['iOS', 'Android']
})
show(): void { }
/**
* Hide the keyboard if open.
*/
@Cordova({
sync: true,
platforms: ['iOS', 'Android']
})
hide(): void { }
/** Keyboard is visible or not. */
@CordovaProperty
isVisible: boolean;
/**
* Creates an observable that notifies you when the keyboard is hidden. Unsubscribe to observable to cancel event watch.
* @returns {Observable<any>}
*/
@Cordova({
eventObservable: true,
event: 'keyboardDidHide',
platforms: ['iOS', 'Android']
})
keyboardDidHide(): Observable<any> { return; }
/**
* Creates an observable that notifies you when the keyboard is shown. Unsubscribe to observable to cancel event watch.
* @returns {Observable<any>}
*/
@Cordova({
eventObservable: true,
event: 'keyboardDidShow',
platforms: ['iOS', 'Android']
})
keyboardDidShow(): Observable<any> { return; }
/**
* Creates an observable that notifies you when the keyboard will show. Unsubscribe to observable to cancel event watch.
* @returns {Observable<any>}
*/
@Cordova({
eventObservable: true,
event: 'keyboardWillShow',
platforms: ['iOS', 'Android']
})
keyboardWillShow(): Observable<any> { return; }
/**
* Creates an observable that notifies you when the keyboard will hide. Unsubscribe to observable to cancel event watch.
* @returns {Observable<any>}
*/
@Cordova({
eventObservable: true,
event: 'keyboardWillHide',
platforms: ['iOS', 'Android']
})
keyboardWillHide(): Observable<any> { return; }
} Edited: Observable doesn't seems to work |
Same problem.
|
Wow, that's really driving me crazy. Not only this "new" plugin cannot be accessed via I solved this temporarily by uninstalling @sfaizanh already did a PR on this? Ionic-Team, you cannot state a plugin as deprecated and not update your native packages! 😠 |
Me too wasted alot of time on this. |
@spacepope Right, just got into the same point. @mhartington sorry to mention you, but this may be noted or mentioned somewhere while the keyboard native module is updated or a new one is created. |
Hi @edmundo096 @sjdrew @spacepope Observable doesn't seems to work, But i can tell you what is the way around. declare var window;
import { Observable, Subscription } from 'rxjs';
import { get } from 'lodash';
export class ExamplePage {
private keybaordShowSub: Subscription;
private keyboardHideSub: Subscription;
constructor() {}
ionViewWillEnter() {
this.addKeyboardListeners();
}
ionViewWillLeave() {
this.removeKeyboardListeners();
}
private addKeyboardListeners() {
this.keybaordShowSub = Observable.fromEvent(window, 'keyboardWillShow').subscribe(e => {
// Code here
});
this.keyboardHideSub = Observable.fromEvent(window, 'keyboardWillHide').subscribe(e => {
// Code here
});
}
private removeKeyboardListeners() {
if (this.keybaordShowSub) this.keybaordShowSub.unsubscribe();
if (this.keyboardHideSub) this.keyboardHideSub.unsubscribe();
}
// When Keyboard is open, if user clicks/taps on button it will open the second page. To cancel that i have to check if keyboard is open then close keyboard only.
openSecondPage(ev) {
ev.stopPropagation();
if (!get(window, 'Keyboard.isVisible', false)) {
const newRootNav = <NavController>this.app.getRootNavById('n4');
newRootNav.push('SecondPage');
}
}
} |
The problem is this:
changed to this:
in the plugin config.xml. While the plugin wrapper config remains the same. For the time being @sfaizanh proposal is a good workaround for me. |
Thanks |
same problem here.. thanks for the workaround |
This is not good at all... |
Could someone from the ionic team reply to this? |
Woooah, sorry about this! Some how it must have slipped through. ionic-team/cordova-plugin-ionic-keyboard#9 This is being update. For now you can use the raw, JS API without needing ionic native. https://github.com/ionic-team/cordova-plugin-ionic-keyboard#methods |
thanks @mhartington If we use the raw JS API for now, how do we reference 'Keyboard' in our code? Do we need to add |
and calling it after that:
|
For enabling the accessory bar: declare const Keyboard: any;
Keyboard.hideFormAccessoryBar(false); |
Is there any way to successfully listen to the keyboardWillShow/Hide events? |
@gparasyris yup, check out the readme: https://github.com/ionic-team/cordova-plugin-ionic-keyboard#keyboardwillshow |
@fishgrind Yes, thanks but I'd already tried those. Amazingly enough, 'native.keyboardhide', 'native.keyboardshow' worked for me. |
I tried everything I can but I want to hide the accessory bar that is set to true but it's not working. Anyone? |
I would stay away from everything except: and use all the native functionalities provided from the ionic official doc's. |
Thank you @noxiousmobile for sharing these versions. I installed and used the plugin to close the keyboard and it works. These older versions seem to be the way to go for now. I removed the latest versions first and then added: ionic cordova plugin add ionic-plugin-keyboard@2.2.1 And followed the official Ionic documents to import and use the plugins. @noxiousmobile, this was a great help! |
Previous was using the deprecated keyboard plugin. Fixes #2306
Previous was using the deprecated keyboard plugin. Fixes #2306
@mhartington I am still using the raw js api to show the form accessory bar in my ionic 4.0.2 app, as you suggested. Is there now a better official way to do it? I get an error with this method: "TypeError: Keyboard.hideFormAccessoryBar is not a function" |
So, this bug is now 2 years old, has anyone from the core team looked into this? It's really simple to solve by dropping the @cordova decorator I'm just guessing this isn't what you're looking for |
With
this combination works for me: import {Keyboard} from '@ionic-native/keyboard'
import {Plugins} from '@capacitor/core'
// Use Keyboard.onKeyboard[Will|Did][Show|Hide]() events from Keyboard:
Keyboard.onKeyboardWillShow().subscribe(...) // All show/hide events are fired properly
// Use Plugins.Keyboard instead to configure the keyboard:
Plugins.Keyboard.setResizeMode('native') // Keyboard.setResizeMode(...) doesn't work, it raises an error |
I'm submitting a ...
[X] bug report
[ ] feature request
[ ] support request
Current behavior:
The module seems to be targeting ionic-plugin-keyboard which is deprecated, and doesn't seem to be working properly with the cordova-plugin-ionic-keyboard plugin.
For example, the onKeyboardHide() observable is never updated.
The text was updated successfully, but these errors were encountered: