Ich habe eine einfache Chat-Oberfläche, aber wenn ich den Eingabetextbereich fokussiere, schiebt die Tastatur alles nach oben, einschließlich der Kopfzeile. Auch der oberste Inhalt des Inhaltsbereichs ist ausgeblendet und ich kann nicht zu ihnen hoch scrollen.
Dies ist nur für iOS.
%Vor%Nach langer Recherche und dem Lesen, dass dieses Thema in cordova / ionic noch offen ist, habe ich beschlossen, das Problem selbst zu lösen. Die Idee ist, die Höhe des Headers abhängig von der Höhe der Tastatur programmgesteuert anzupassen.
1.- Fügen Sie in der Kopfzeile der Ansichtsvorlage (HTML) eine Stilanweisung hinzu:
%Vor%2.- Auf der Komponente (TS) trigger ich die Ereignisse der Tastatur (show, hide) und den Wert der Höhe:
%Vor%Wo this.keyboardHeight ein globaler variabler Zahlentyp ist. Und this.keybaord und this.nativeKeyboard sind die Cordova Plugins.
3.- Schließlich ist dies die Methode, die die an die ngStyle-Direktive des Headers angehängte Höhe zurückgibt:
%Vor%Ich hoffe, dass dies helfen kann.
Sehen Sie sich dieses Video an. Ссылка Sie können sich die CSS-Regeln ansehen, die auf Chrome mit ionic serve --lab angewendet wurden. Vielleicht könnten Sie das untersuchen / post CSS, um Ihre Frage zu ergänzen. Involved mit iPhone über USB-Kabel mit Macbook Pro usw. verbunden. @ Ca. 3 bis 4 min .. mit Safari entwickeln Menü
Außerdem gibt es hier einige Hinweise hier , die möglicherweise zutreffen:
%Vor%Verhindert, dass sich das systemeigene UIScrollView bewegt, wenn eine Eingabe fokussiert wird. Das verräterische Zeichen dafür ist der obere Teil Ihrer App scrollt aus der Sicht (wenn Sie Ionic verwenden, wird Ihre Kopfzeile verschwinden).
Dies verhindert nicht, dass DOM-Elemente scrollen können. Das muss von CSS und JavaScript kommen, nicht von diesem Plugin.