Ionic-framework: La barra de encabezado se mueve hacia arriba detrás de la barra de estado o incluso completamente fuera de la ventana gráfica cuando el campo del formulario está enfocado

Creado en 27 mar. 2014  ·  72Comentarios  ·  Fuente: ionic-team/ionic-framework

Bueno ... eso lo resume todo ^

Captura de pantalla (Ionic beta 1, iPhone 4):

photo-1
photo

reply

Comentario más útil

Este problema aparece cuando se abre la carga de archivos desde la pantalla Teléfono / Cámara en iOS.

Todos 72 comentarios

Duplicado de # 818

Gracias. Estamos trabajando en estos errores de teclado para beta2.

¿Tiene alguna pista sobre lo que podría causar esto?
Para cuando planeas lanzar beta2, mi aplicación ya está disponible ;-)

Aquí hay una demostración práctica de este problema:

Acabo de probar esto a través del proceso "Getting Started" usando "Ionic, v1.0.0-beta.1".

Mis Pasos:

  • npm install -g cordova ionic
  • Estado de inicio iónico Bar Menú lateral de prueba
  • plataforma iónica agregar ios

Luego edité app.js para comenzar con un formulario simple. :

<ion-view title="Form Test">
  <ion-nav-buttons side="left">
    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>
  <ion-content class="has-header">

    <div class="list">
      <label class="item item-input">
        <input type="text" placeholder="First Name">
      </label>
      <label class="item item-input">
        <input type="text" placeholder="Middle Name">
      </label>
      <label class="item item-input">
        <input type="text" placeholder="Last Name">
      </label>
      <label class="item item-input">
        <input type="text" placeholder="Address 1">
      </label>
      <label class="item item-input">
        <input type="text" placeholder="Address 2">
      </label>
      <label class="item item-input">
        <input type="text" placeholder="City">
      </label>
      <label class="item item-input">
        <input type="text" placeholder="State">
      </label>
      <label class="item item-input">
        <input type="text" placeholder="Zip Code">
      </label>
    </div>

  </ion-content>
</ion-view>

Luego:

  • ios de construcción iónica
  • iónico emular ios

Aquí está el resultado:

status bar problem

Como puede ver, el teclado empuja el formulario hacia arriba en la barra de estado.

Hey Justin, creo que el problema es que

tiene position: fixed . Tratar
cambiando el cuerpo css a position:static . Lo siento, no he empujado la solución
sin embargo, todavía estamos probando el teclado en todos los dispositivos en este momento.

Dale una oportunidad y avísame si te ayuda.

El miércoles 2 de abril de 2014 a las 4:34 p.m., Justin Noel [email protected] escribió:

Aquí hay una demostración práctica de este problema:

Probé esto a través del proceso "Getting Started" usando "Ionic,
v1.0.0-beta.1 ".

Mis Pasos:

  • npm install -g cordova ionic
  • Estado de inicio iónico Bar Menú lateral de prueba
  • plataforma iónica agregar ios

Luego edité app.js para comenzar con un formulario simple. :



Desafortunadamente, eso no ayudó. En el proyecto de muestra, agregué esto al "style.css":

body, .ionic-body {
    position: static;
}

Eso no funcionó a pesar de que "style.css" se incluye después del archivo CSS de Ionic. También confirmé en la depuración de Safari que el position: static había aplicado al cuerpo.

Entonces, probé solo el cuerpo sin suerte.

body {
    position: static;
}

A continuación, acabo de actualizar el archivo "ionic.css". Esto todavía no funcionó.

También pensé que podría haber tenido la intención de hacer que el encabezado esté estático; así que lo intenté. No tuve suerte con eso tampoco.

Ah, no vi que es solo iOS 7.1. No tengo acceso a una Mac en este momento, así que lo echaré un vistazo mañana a primera hora. Gracias por su ayuda para investigar esto.

Gracias por la demostración funcional Justin: +1:

Dependiendo de su configuración, configurar .body en position:static no arreglará nada, ya que .pane y .view también tienen posición absoluta.

En las aplicaciones web móviles personalizadas que he creado, el encabezado debe estar fuera de cualquiera de estos elementos de gran posición y el encabezado en sí está configurado en position:fixed para permanecer allí cuando el teclado está arriba. Android tiene una opción llamada adjust-resize que aplasta la vista para que quepa sobre el teclado. iOS, por otro lado, simplemente desplaza la vista para centrar la entrada en la pantalla.

Cordova también tiene una preferencia llamada "KeyboardShrinksView" que está predeterminada como falsa. No he visto esto todavía, pero parece una solución para iOS a lo que Android ya hace con ajustar-cambiar tamaño

Crear una armonía entre estas dos diferencias es un infierno de trabajo

Estamos trabajando activamente en las correcciones del teclado ahora para detener todos estos problemas.

Desafortunadamente, este error no se corrigió en la noche de 1717.

Una cosa que @tlancina notó es que con las últimas correcciones de tap, si hace clic en la entrada directamente, no mueve el encabezado hacia arriba. Entonces creo que resolvimos parte de este problema. Sin embargo, si toca la etiqueta que envuelve una entrada, 300 ms después hará el horrible desplazamiento nativo. La forma en que funciona el CSS predeterminado de Ionic es difícil distinguir la diferencia entre la etiqueta de envoltura y la entrada real, por lo que esta podría ser parte de la razón por la que no siempre funciona. He estado usando esta página de prueba para ayudar a depurar estos problemas en cada dispositivo.

En este momento, creo que la razón es porque no estamos impidiendo el clic predeterminado en una etiqueta. Si hacemos e.preventDefault () en una etiqueta que envuelve una entrada, el teclado no aparecerá automáticamente en el primer toque. Seguiré investigando esto, gracias.

@adamdbradley se ofrece como voluntario como otro probador de esta solución cuando se mete en las noches. Gracias.

Lamentablemente, este problema aún no se ha resuelto en la versión 1.0.0 beta2.

@CoenWarmer Somos conscientes de los problemas y seguimos trabajando en ellos. Además, tenga en cuenta que cuando informe cualquier problema con el teclado, proporcione la plataforma, la versión de la plataforma y es el problema en el navegador móvil, el emulador o en cordova, y si es cordova, es pantalla completa o no. Otra información útil incluye el elemento que pulsaste, como la etiqueta o la entrada, si tuviste que desplazarte manualmente en cualquier momento para llegar a una entrada, si la meta viewport tiene height = device-height o no, y si el elemento es debajo de donde eventualmente se mostraría el teclado virtual, ¿muestra la mitad dónde se mostraría el teclado, o está arriba y no es necesario desplazarse? Gracias

Encontrado en:

  • iOS7.1.1
  • Ionic 1.0.0 beta 2
  • en Córdoba
  • en simulador y dispositivo
  • no pantalla completa
  • no se usa etiqueta, solo entrada
  • la vista se puede desplazar después de que el campo de entrada se enfoca, si el campo de entrada no tiene enfoque, la vista no se puede desplazar
  • la vista no se desplaza inmediatamente después de que se enfoca y aparece el teclado. Cuando el campo de entrada se enfoca, puede colocar el dedo en el campo de entrada y arrastrar hacia arriba para mover la vista fuera de la vista web.

También ocurre en Android 4.4 y 4.3, también usando 1.0.0 beta2. Exactamente las mismas circunstancias que iOS7.1. Entonces, cuando el campo de entrada se enfoca y aparece el teclado, nada está mal, es cuando la entrada se enfoca y luego coloca el dedo en el campo de entrada y comienza a arrastrarlo hacia arriba o hacia abajo, ahí es cuando puede mover todo el contenido fuera de la vista . Hará un screencast más tarde.

Después de beta2 tengo este problema en pantallas pequeñas (como iphone3 o iphone4).

iphone 5 (ok)

iphone5

iphone 4 (problemas)

iphone4

@zelphir ¿Puede proporcionar un codepen que reproduzca este problema? ¿Son ambos iOS 7.0 o 7.1?

@CoenWarmer, ¿su entrada en un área de contenido es por casualidad? La única forma en que puedo replicar su problema es teniendo una entrada que no esté en una vista de desplazamiento.

Solo para aclarar: este es el comportamiento esperado si no está utilizando una vista de desplazamiento. Si hay entradas debajo del teclado y no puede desplazarse hasta ellas usando JS, entonces el navegador se ve obligado a mover el contenido hacia arriba para que sean visibles, por lo que puede mover todo hacia arriba.

@tlancina Mi entrada no está dentro de un área de contenido.

Este es el código que estoy usando:

<ion-view title="Delegates">
  <div class="search-container">
    <div class="search-inner">
      <input ng-model="searchText" placeholder="Search" ng-enter="ScrollTop()">
    </div>
  </div>

  <ion-tabs class="tabs-icon-only tabs-double">
    <ion-tab title="A-Z">
      <ion-content class="slide-under-header has-header has-tabs has-double-tabs" padding="false" delegate-handle="DelegateScroll">
        <!-- stuff -->
      </ion-content>
    </ion-tab>
    <!-- another ion-tab -->
  <ion-tabs>
</ion-view>

No estoy seguro de seguir completamente lo que dice acerca de que este es el comportamiento esperado. En este momento, parece que la aplicación se está rompiendo cuando todo se desplaza debajo del encabezado. ¿Debería, en cambio, colocar el campo de entrada dentro de un contenido de iones?

Bueno, suponga que tiene una lista de varias entradas, llegando al final de su página. Si no están dentro de un área que se pueda desplazar para usar Javascript, ¿cómo se pueden mostrar cuando aparece el teclado? La única forma es utilizar el desplazamiento del navegador nativo, que funciona cambiando el contenido, todo, incluido el encabezado.

Cuando una entrada o un área enfocable está dentro de una vista de desplazamiento iónico, evitamos el desplazamiento predeterminado y usamos Javascript para mostrarlo, dejando el encabezado en su lugar.

Desafortunadamente, no soy un experto en enrutadores de interfaz de usuario, pero intente colocar el contenido de iones alrededor de todo el contenido de la página y vea si eso ayuda.

Lo entiendo ahora, pero ¿no lleva eso al efecto visual indeseable de que toda la barra de navegación desaparezca, incluido el botón Atrás?

Más concretamente en mi caso de uso, si coloco el campo de entrada dentro de un contenido de iones, ¿cómo puedo asegurarme de que permanezcan fijos en la parte superior debajo de la barra de encabezado de manera que las animaciones de transición funcionen correctamente en iOS y Android?

Sí, la situación de hacer malabares con las pestañas y mantener un área desplazable para una entrada parece bastante complicada, y es probable que suceda con bastante frecuencia. @adamdbradley y yo lo estamos investigando ahora mismo.

No estoy seguro de entender el problema con las transiciones, si haces algo como

<ion-content>
  <div class="search-container">
    <div class="search-inner">
      <input ng-model="searchText" placeholder="Search" ng-enter="ScrollTop()">
    </div>
  </div>
</ion-content>

¿estropea las animaciones? Es muy posible que tener varias áreas de contenido estropee otras cosas, ya que se supone que probablemente solo haya una.

@tlancina Ah, genial, no consideré usar dos elementos con contenido de iones en uno parcial. Verá cómo funciona y le informará.

El problema con las animaciones de transición al que me refería ocurre en ciertas versiones de Android. Si usa position: static en un elemento y se aleja de esa vista, en Android 4.1 a 4.3 (creo que no estoy 100% seguro, lo comprobaré) esos elementos permanecerán bloqueados una vez que comience la animación. Por lo tanto, todos los elementos (contenido de iones, pestañas, barras de encabezado, etc.) comenzarán a moverse hacia la izquierda, pero el elemento al que le asignaste una posición: static permanecerá en el mismo lugar hasta que se complete la animación. Esto no sucede en iOS. Es por eso que dudaba en usar la posición estática en cualquier lugar.

@tlancina Acabo de intentar poner el elemento de entrada en un contenido de iones y tener el resto del contenido en otro, segundo contenido de iones. Desafortunadamente, cualquier entrada ingresada en el elemento de entrada ya no filtrará la repetición ng que está en el otro contenido de iones. ¿Otras sugerencias?

@CoenWarmer eso se debe a que el contenido de iones crea un alcance secundario.

Intente poner un controlador sobre ambos contenidos. Si el controlador lo es, no use simplemente una primitiva para la entrada.

Está sufriendo el problema del "punto" de la herencia del alcance: se está estableciendo una primitiva en un alcance secundario diferente en el alcance secundario, no en el alcance principal. ¿Sabes lo que quiero decir? Si no, déjame saber y buscaré un enlace / lo explicaré.

No estoy familiarizado con él, lamentablemente no. ¿Te importaría compartir? :)

¡Ah, sí, eso tiene sentido! Voy a intentarlo de nuevo: +1:

hola @adam. ¿Qué tal un pie de página con una entrada? Dado que está fuera del área de desplazamiento, también causará el problema. ¿Alguna forma de evitar eso?

También tengo este problema en iPad (7.1). Vi que ionic agrega height = device-height a la ventana gráfica después de cambios recientes si no está configurado.
Debido a esta propiedad, la ventana gráfica se vuelve de 200px (altura) a grande y es completamente desplazable.
Cuando lo elimino, funciona.
Puedo arreglar esto si de alguna manera configuro .view y .pane en position: fixed y body to position: static, pero la ventana principal sigue siendo demasiado grande y muestra una barra de desplazamiento en el lado derecho si muevo el dedo hacia arriba y hacia abajo.

Por cierto ... esto es independiente del enfoque de entrada. El foco de entrada solo mueve la posición de desplazamiento para que pueda ver el resultado.

Hola chicos, ¿cuál es el progreso actual aquí?
Creé un archivo iónico personalizado y eliminé la adición 'altura = altura del dispositivo'.
Después de este cambio, todo funciona bien. Ya no se necesitan correcciones de CSS y el enfoque en el campo de entrada está funcionando correctamente.
También estoy usando el complemento de teclado en iOS y hago lo siguiente:

Keyboard.shrinkView(true);
Keyboard.hideFormAccessoryBar(true);

Colocar la entrada en un contenido de iones separado tampoco detiene el comportamiento de hacer que toda la vista, incluida la barra de encabezado, se pueda desplazar debajo de la vista web cuando la entrada se enfoca. Se produce el mismo comportamiento que en mi screencast anterior: https://www.dropbox.com/s/2g6b41n3s3vpj0s/2.mov

@ D3CK3R estamos trabajando para

@CoenWarmer, ¿le importaría ejecutar el complemento de teclado iónico? Lo acabamos de hacer público y tengo curiosidad por ver cómo funcionará en las entradas fuera de una vista de desplazamiento.

Puede instalarlo ejecutando cordova plugin add https://github.com/driftyco/ionic-plugins-keyboard.git desde dentro de su proyecto Cordova.

@tlancina ¡ Eso funciona! Después de agregar el complemento, el contenido ya no se puede arrastrar debajo de la ventana gráfica cuando la entrada tiene el foco. ¡¡Impresionante!!

¿Está listo el complemento para la producción? Me encantaría implementar esto lo antes posible ya que este proyecto se acaba de publicar en la tienda.

@CoenWarmer, ¡ no tienes idea de lo feliz que me sentí al ver tu último comentario! ¡Buen trabajo @tlancina!

@adamdbradley @tlancina
highfive

¡¡¡Sí!!!

@CoenWarmer sí para iOS, está listo para producción. Tenemos una versión anterior en una aplicación que acaba de ser aceptada en la tienda de aplicaciones, y no creo que el material de desplazamiento que agregamos sea motivo de rechazo. ¡Realmente me alegro de que esté funcionando para ti!

¿Bueno para cerrar? @tlancina

Esto seguía siendo un problema en la versión beta14. Después de una depuración extensa, finalmente encontré la solución.

En mi caso, estaba relacionado con mi meta viewport .

Valor original (haciendo que el encabezado se muestre detrás de la barra de estado)

<meta name="viewport" content="width=device-width">

Nuevo valor (solucionando este problema)

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

Comencé mi proyecto mucho antes de beta1 por lo que probablemente este fue un html heredado que nunca noté.

Espero que esto ayude a alguien.

@rvanbaalen Tengo una ventana

Esto sigue siendo un problema para mí. Tengo el complemento de teclado agregado. Estoy tratando de usar un área de texto simple como un "bloc de notas" para que ocupe toda la pantalla, como puede ver con mi altura: 100% estilos. Para que esos estilos funcionen, tuve que deshabilitar el desplazamiento con scroll = "false" porque el estilo de altura solo se expandirá a la altura del padre. Probablemente haya una mejor manera de hacer este "bloc de notas" para evitar este problema y agradecería cualquier sugerencia.

Agregué un color de fondo al área de texto para que las capturas de pantalla a continuación sean más obvias.

Estoy usando esta vista:

<ion-modal-view>
    <ion-header-bar class="bar-royal">
        <div class="buttons">
            <button class="button button-clear" ng-click="vm.closeAddNote()">Cancel</button>
        </div>
        <h1 class="title">Add Note</h1>
        <div class="buttons">
            <button class="button button-clear" ng-click="vm.saveNote(vm.noteContent)">Done</button>
        </div>
    </ion-header-bar>
    <ion-header-bar align-title="left" class="bar-subheader bar-stable">
        <h3 class="title">adding note for `client name`</h3>
    </ion-header-bar>
    <ion-content class="has-subheader" scroll="false">
        <div class="list padding" style="height: 100%;">
            <textarea placeholder="Comments" style="height: 100%; width: 100%;" ng-model="vm.noteContent"></textarea>
        </div>
    </ion-content>
</ion-modal-view>

Vista inicial

Después de hacer clic en el área de texto

Demostrar que puedo desplazarme mientras el área de texto está enfocada.

Sigue siendo un problema chicos, por favor ayuden a @ajoslin @adamdbradley

ios simulator screen shot 25 may 2015 17 53 32

ios simulator screen shot 25 may 2015 17 53 36

Simulador de iOS - iPhone 6 / iOS 8.3
versión iónica 1.0.0-rc.0
complementos instalados:

  • com.ionic.keyboard
  • com.phonegap.plugins.PushPlugins
  • org.apache.cordova.console
  • org.apache.cordova.device
  • org.apache.cordova.file
  • org.apache.cordova.geolocation
  • org.apache.cordova.media

HTML de modal:

<ion-modal-view>
  <ion-header-bar>
    <div class="buttons">
      <ion-button class="button button-clear" ng-click="closeModal()">Cancel</ion-button>
    </div>
    <h1 class="title">Modal View</h1>
    <div class="buttons">
      <ion-button class="button button-clear" ng-click="create()">Create</ion-button>
    </div>
  </ion-header-bar>
  <ion-content>    
    <form>
...
</form>
</ion-content>
</ion-modal-view>

@ ravivit9 @ mikehaas763 @AshleyRudland
Deberías intentarlo

iOS Notes
If the content of your app (including the header) is being pushed up and out of view on input focus, 
try setting cordova.plugins.Keyboard.disableScroll(true). 
This does not disable scrolling in the Ionic scroll view, 
rather it disables the native overflow scrolling that happens automatically as a result of focusing on inputs below the keyboard.

desde el teclado ios note

Funcionará a las mil maravillas.

¿Puedo configurar cordova.plugins.Keyboard.disableScroll (verdadero) y aún esperar que la vista se desplace a mi entrada?
Si desactivo el desplazamiento, la barra de estado ya no se empuja hacia afuera, pero el teclado se superpone a mi campo de entrada.

@michaelknoch siempre que su entrada esté dentro de una vista de desplazamiento (como contenido de iones), debería desplazarse automáticamente a la vista, a menos que haya llamado ionic.keyboard.disable() .

@michaelknoch creo que estás pidiendo adjuntar el teclado

@LightZam pero solo admite la barra de pie de página de iones y mi entrada está dentro de mi contenido en la vista de iones

@tlancina ¿ debo envolver mi contenido con ionScroll? http://ionicframework.com/docs/api/directive/ionScroll/

@michaelknoch no debería necesitarlo, ya que ion-content tiene una vista de desplazamiento. Si puede crear un codepen simple que reproduzca el problema, junto con el teléfono y el sistema operativo que está usando, así como el resultado del comando ionic info (si está usando la CLI), tomaré una mirada.

@tlancina Estoy enfrentando este problema en
CLI de Córdoba: 5.2.0
Versión iónica: 1.1.0
Versión Ionic CLI: 1.6.4
Versión Ionic App Lib: 0.3.8
ios-deploy versión: 1.7.0
versión ios-sim: 4.1.1
Sistema operativo: Mac OS X Yosemite
Versión de nodo: v0.12.7
Versión de Xcode: Xcode 7.0 Build versión 7A176x
teléfono - iphone 4S, ios 7.0.6

si mantengo el encabezado "cordova.plugins.Keyboard.disableScroll (true)", no lo empujo, pero el teclado viene encima de mi área de texto. y mantuve el área de texto (usando con msd-elastic) dentro, para obtener un estilo similar al de whatsapp, por lo que su contenido de iones externo

y si uso el teclado adjunto, se arruina con msd-elastic :(
alguna sugerencia ?

probado con ionic.Platform.fullScreen ()
pero no suerte ... también este fullScreen () crea otro problema en ios ...
reduce la altura del encabezado ... ya que este CSS no se aplica cuando llama a pantalla completa ()
.platform-ios.platform- cordova: not (.fullscreen) .bar- header: not (.bar-subheader) {altura: 64px; }

todo estaba bien en andorid.

Tengo casi el mismo problema después de actualizar Cordova a 6.0.0, es decir, aparece la barra de estado y se superpone a la barra de encabezado cuando se enfoca el campo del formulario. Este problema existe en mi dispositivo Android. Todavía no he probado el dispositivo iOS. ¿Alguien puede ayudar por favor?

CLI de Córdoba: 6.0.0
Versión de Gulp: CLI versión 3.8.11
Gulp local: versión local 3.8.11
Versión iónica: 1.0.0-rc.5
Versión Ionic CLI: 1.7.14
Versión Ionic App Lib: 0.7.0
ios-deploy versión: 1.8.3
versión ios-sim: 5.0.4
Sistema operativo: Mac OS X El Capitan
Versión de nodo: v0.12.2
Versión de Xcode: Xcode 7.2 Build versión 7C68

Tenía este problema en Android después de actualizar a Cordova 6.0.0 y lo resolví llamando al método AndroidFullScreen.immersiveMode del complemento https://github.com/mesmotronic/cordova-plugin-fullscreen

// Ocultar la interfaz de usuario del sistema y mantenerla oculta (solo Android 4.4+)
AndroidFullScreen.immersiveMode (SuccessFunction, errorFunction);

Este problema todavía está sucediendo, resolverlo yendo a pantalla completa no es una solución adecuada ya que la aplicación realmente no debería ejecutarse en pantalla completa, pero solo para la prueba la probé, y aunque la aplicación entra en modo de pantalla completa, es aún "más grande" que la pantalla, por lo tanto, puede desplazarse un poco con el encabezado debajo de la barra de estado ...
¡Por favor ayuda!

¿Tiene este problema? ¿Hay alguna solución?

También tengo el mismo problema con iOS en Ionic 2

Medio ambiente
CLI de Córdoba: 6.0.0
Versión iónica: 2.0.0-beta.3
Versión Ionic CLI: 2.0.0-beta.19
Versión de Ionic App Lib: 2.0.0-beta.9
ios-deploy versión: No instalado
versión ios-sim: 5.0.6
Sistema operativo: Mac OS X El Capitan
Versión de nodo: v5.7.1
Versión de Xcode: Xcode 7.2.1 Versión de compilación 7C1002

Como puede ver, no hay espacio / relleno entre la barra de estado y el encabezado en la aplicación Ionic.

screen shot 2016-03-21 at 11 17 49 am

El problema nuevo / antiguo con el teclado está aquí nuevamente. Si bien puedo deshabilitar el desplazamiento cuando la entrada se enfoca grabando, el problema anterior con el encabezado que se desplaza fuera de la vista vuelve a estar presente si se enfocan los campos del formulario con el botón especial del teclado virtual. En el teclado de Android hay un botón verde en la parte inferior derecha que permite cambiar a la siguiente entrada en el formulario. Incluso si tengo el desplazamiento desactivado, el botón desplaza la vista para hacer visibles las entradas enfocadas y, como resultado, el encabezado está fuera de la pantalla.

Para probar esto, la primera entrada debe estar en la vista y enfocada con el teclado visible y la segunda entrada debe estar debajo del pliegue (en algún lugar debajo del teclado). Ahora, al tocar el botón verde (como en la imagen), se desplaza la vista y el encabezado sale de la pantalla.

view

Córdoba 6.3.0
iónico-plugin-keyboard 2.2.1
Probado en dispositivo con Android 5
Compilación para Android 24.0.1

¿Tiene alguna idea para desactivar este botón o solucionar el problema? No estoy 100% seguro, pero sospecho que esto comenzó después de la actualización de Córdoba a una versión 6+.

@rafaellop ¿

Este problema aparece cuando se abre la carga de archivos desde la pantalla Teléfono / Cámara en iOS.

Tengo este problema con el redactor de correo electrónico

Editar Para aquellos que todavía tienen este problema incluso después de intentar todo, intente volver a [email protected]. Parece que 4.3 puede haber introducido algún comportamiento extraño. Incluso los nightlies de cordova-ios más recientes no parecieron solucionar mi problema, pero la reversión lo solucionó de inmediato.

Este problema también me sigue ocurriendo, esto no está resuelto.

En IOS, si tocamos en la barra de estado, todo el contenido de iones parpadeará en IONIC2. Cómo resolver este problema. Sugiera ...
Gracias.

Volver a [email protected] no me ayudó, es triste decirlo. El mismo problema después de usar la biblioteca de archivos de cámara nativa.

Me acabo de dar cuenta de otra publicación que pude degradar el complemento cordova-statusbar de 2.2.1 a 2.2.0 y solucionó el problema. Parece que fue el complemento de la barra de estado el que causó el problema en mi caso.

Tuve este problema con

  • iónico 3.9.2
  • cordova-ios 4.4.0
  • iOS 10.3
  • Una variedad de dispositivos y emuladores de iPhone

Tenía un área de texto con height: 100%; (que era todo contenido de iones) y el encabezado de iones se alejaba de la vista cada vez que se enfocaba el área de texto. Mi solución fue cambiarlo a height: auto; min-height: 25%; y poner el área de texto dentro de un div con height: 100%; margin: 0; padding: 0; y (click)=focusTextArea() . Un poco loco y me encantaría una mejor solución, pero esto funciona bien por ahora: +1:

Utilice este complemento ionic cordova plugin add cordova-plugin-ionic-webview --save. Su resuelto mi problema gracias

Experimenté el mismo problema en combinación con el complemento de redacción de correo electrónico.

Resolví el problema actualizando cordova-plugin-statusbar de la versión 2.2.1 a 2.3.0.

@ jvhe123 Acabo de intentar hacer eso, pero parece que la v2.3.0 no existe, ¿te refieres a la v2.2.3?

@ glenr4
image

  • cordova-plugin-keyboard 1.2.0
  • iónico-plugin-keyboard 2.2.1

Estaba teniendo este problema con el iPhone X. Al abrir el teclado, el encabezado subió y casi salió de la página.

Lo arreglé poniendo un eventListener en mi archivo javaScript para la página afectada:

document.addEventListener('deviceready', function(e){ window.addEventListener('native.keyboardshow', function () { cordova.plugins.Keyboard.disableScroll(true); }); });

Esto funcionó para mí, espero que pueda funcionar para uno de ustedes también.

¡Gracias por el problema! Este problema se está bloqueando para evitar comentarios que no sean relevantes para el problema original. Si esto sigue siendo un problema con la última versión de Ionic, cree un nuevo problema y asegúrese de que la plantilla esté completa.

¿Fue útil esta página
0 / 5 - 0 calificaciones