I'm writing an app with NativeScript 6.4.1 and Angular version 8.
There are a series of UI events in iOS that you can watch to see what the keyboard is doing: https://developer.apple.com/documentation/uikit/uikeyboarddidhidenotification?language=objc
I wrote a service to watch and subscribe to these changes.
Do you see any issues in the code with having too many Observables and listeners?
Here is my service:
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import * as application from 'tns-core-modules/application';
@Injectable({
providedIn: 'root'
})
export class iOSKeyboardObserverService {
public didShow$(): Observable<any> {
return new Observable((observer) => {
const iosObserver = application.ios.addNotificationObserver(UIKeyboardDidShowNotification, (notification) => {
observer.next(true);
});
return () => {
application.ios.removeNotificationObserver(iosObserver, UIKeyboardDidShowNotification);
}
});
}
public didHide$(): Observable<any> {
return new Observable((observer) => {
const iosObserver = application.ios.addNotificationObserver(UIKeyboardDidHideNotification, (notification) => {
observer.next(false);
});
return () => {
application.ios.removeNotificationObserver(iosObserver, UIKeyboardDidHideNotification);
}
});
}
}
Example usage:
public isKeyboardShowing: boolean;
constructor(private page: Page, private ngZone: NgZone, private keyboardObserver: iOSKeyboardObserverService) {
this.page.on(Page.layoutChangedEvent, (args: EventData) => this.onLayoutChanged(args));
this.isKeyboardShowing = false;
if (utils.ios) {
this.keyboardObserver.didHide$().subscribe((result) => {
this.setIsKeyboardShowing(result);
});
this.keyboardObserver.didShow$().subscribe((result) => {
this.setIsKeyboardShowing(result);
});
}
}
this.keyboardObserver.visibility$().subscribe
which will emit{show: true/false}
\$\endgroup\$