Ionic-framework: A barra de cabeçalho move-se para trás da barra de status ou até mesmo completamente fora da janela de visualização quando o campo do formulário está focado

Duplicado de # 818

Obrigado. Estamos trabalhando nesses bugs de teclado para o beta2.

Você tem alguma pista sobre o que pode causar isso?
Quando você planeja lançar o beta2, meu aplicativo já está disponível ;-)

Aqui está uma demonstração prática desse problema:

Acabei de testar isso por meio do processo de "Introdução" usando "Ionic, v1.0.0-beta.1".

Meus passos:

• npm install -g cordova ionic
• status de início iônicoBarTest menu lateral
• plataforma iônica add ios

Em seguida, editei app.js para começar com um formulário simples. :

<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>

Então:

• IOS de construção iônica
• emular ios ios

Aqui está o resultado:

Como você pode ver, o teclado empurra o formulário para a barra de status.

Ei Justin, acredito que o problema é que

Experimente e me diga se isso ajudar.

Na quarta-feira, 2 de abril de 2014 às 16:34, Justin Noel [email protected] :

Aqui está uma demonstração prática desse problema:

Acabei de testar isso por meio do processo de "Introdução" usando "Ionic,
v1.0.0-beta.1 ".

Meus passos:

• npm install -g cordova ionic
• status de início iônicoBarTest menu lateral
• plataforma iônica add ios

Em seguida, editei app.js para começar com um formulário simples. :

<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>

Então:

• IOS de construção iônica
• emular ios ios

Aqui está o resultado:

[imagem: problema na barra de status] https://cloud.githubusercontent.com/assets/57374/2597008/fb174690-baad-11e3-80aa-c88985210bcb.gif

Como você pode ver, o teclado empurra o formulário para a barra de status.

Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/driftyco/ionic/issues/932#issuecomment -39386769
.

Infelizmente, isso não ajudou. No projeto de amostra, adicionei isso ao "style.css":

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

Isso não funcionou, embora "style.css" seja incluído após o arquivo Ionic CSS. Também confirmei na depuração do Safari que position: static foi aplicado ao corpo.

Então, tentei apenas o corpo, sem sorte.

body {
    position: static;
}

Em seguida, acabei de atualizar o arquivo "ionic.css". Isso ainda não funcionou.

Também achei que você pretendia tornar o cabeçalho estático; então eu tentei. Sem sorte com isso também.

Não vi que é apenas iOS 7.1. Não tenho acesso a um Mac agora, então darei uma olhada amanhã. Obrigado por sua ajuda com isso.

Obrigado pela demonstração de trabalho Justin: +1:

Dependendo de sua configuração, definir .body para position:static não corrigirá nada, já que .pane e .view também têm posição absoluta.

Em aplicativos da web móveis personalizados que construí, o cabeçalho precisa estar fora de qualquer um desses elementos de posição pesada e o próprio cabeçalho definido como position:fixed para permanecer lá quando o teclado estiver ativado. O Android tem uma opção chamada adjust-resize que ajusta a visualização para caber acima do teclado. O iOS, por outro lado, apenas move a visualização para centralizar a entrada na tela.

Cordova também tem uma preferência chamada "KeyboardShrinksView", que é padronizada como falsa. Eu não olhei para isso ainda, mas parece uma solução para iOS para o que o Android já faz com ajustar-redimensionar

Criar uma harmonia entre essas duas diferenças é um INFERNO de um trabalho

Estamos trabalhando ativamente em consertos de teclado agora para parar todos esses problemas.

Infelizmente, esse bug não foi corrigido no período noturno de 1717.

Uma coisa que @tlancina notou é que, com as correções de toque mais recentes, se você clicar na entrada diretamente, o cabeçalho não será movido para cima. Acho que resolvemos parte desse problema. No entanto, se você tocar no rótulo que envolve uma entrada, 300 ms depois ele fará a horrível rolagem nativa. A forma como o css Ionic padrão funciona é difícil dizer a diferença entre o rótulo de embalagem e a entrada real, então isso pode ser parte do motivo pelo qual nem sempre funciona. Tenho usado esta página de teste para ajudar a depurar esses problemas em cada dispositivo.

No momento, acho que o motivo é porque não estamos impedindo o padrão em um clique no rótulo. Se fizermos e.preventDefault () em um rótulo envolvendo uma entrada, o teclado não aparecerá automaticamente no primeiro toque. Vou examinar mais isso, obrigado.

@adamdbradley se oferecendo como outro testador para esse conserto quando começa a noite. valeu.

Infelizmente, esse problema ainda não foi resolvido no 1.0.0 beta2.

@CoenWarmer Estamos cientes dos problemas e ainda estamos trabalhando nisso. Além disso, lembre-se de que, ao relatar qualquer problema de teclado, forneça a plataforma, a versão da plataforma e o problema está no navegador móvel, no emulador ou em cordova e, se for cordova, será em tela inteira ou não. Outras informações úteis incluem o elemento que você tocou, como o rótulo ou a entrada, você teve que rolar manualmente a qualquer momento para chegar a uma entrada, a janela de visualização meta tem altura = altura do dispositivo ou não, e se o elemento é abaixo de onde o teclado virtual iria aparecer, é metade mostrando onde o teclado iria aparecer, ou está acima e não há necessidade de rolar. Obrigado

Encontrado em:

• iOS7.1.1
• Ionic 1.0.0 beta 2
• em cordova
• no simulador e dispositivo
• não em tela inteira
• nenhum rótulo usado, apenas entrada
• a visualização pode ser rolada após o campo de entrada obter o foco, se o campo de entrada não tiver foco, a visualização não poderá ser rolada
• a visualização não rola imediatamente após obter o foco e o teclado aparece. Quando o campo de entrada recebe o foco, você pode colocar o dedo no campo de entrada e arrastar para cima para mover a visualização para fora da webview.

Também acontece no Android 4.4 e 4.3, também usando 1.0.0 beta2. Exatas mesmas circunstâncias que iOS7.1. Então, quando o campo de entrada ganha o foco e o teclado aparece, nada está errado, é quando a entrada ganha o foco e você coloca o dedo no campo de entrada e começa a arrastá-lo para cima ou para baixo, é quando você pode mover todo o conteúdo para fora da visualização . Farei um screencast mais tarde.

Screencast: https://www.dropbox.com/s/2g6b41n3s3vpj0s/2.mov

Depois do beta2, tenho esse problema em telas pequenas (como iphone3 ou iphone4).

iphone 5 (ok)

iphone 4 (problemas)

@zelphir Você pode fornecer um código que replique esse problema? Ambos são iOS 7.0 ou 7.1?

@CoenWarmer é sua área de conteúdo por acaso? A única maneira de replicar seu problema é ter uma entrada que não seja em uma exibição de rolagem.

Apenas para esclarecer - este é o comportamento esperado se você não estiver usando uma visualização de rolagem. Se houver entradas abaixo do teclado e você não conseguir rolar até elas usando JS, o navegador é forçado a mover o conteúdo para cima para que fiquem visíveis, por isso você pode mover tudo para cima.

@tlancina Minha entrada não está dentro de uma área de conteúdo.

Este é o código que estou 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>

Não tenho certeza se entendi inteiramente o que você está dizendo sobre este ser o comportamento esperado. No momento, parece que o aplicativo está quebrando quando tudo rola sob o cabeçalho. Em vez disso, devo colocar o campo de entrada dentro de um conteúdo de íons?

Bem, suponha que você tenha uma lista de várias entradas, chegando ao final da sua página. Se eles não estiverem em uma área que possa ser rolada usando Javascript, como eles poderão ser visualizados quando o teclado for ativado? A única maneira é usar a rolagem nativa do navegador, que funciona mudando o conteúdo - tudo, incluindo o cabeçalho.

Quando uma área de entrada ou focalizável está dentro de uma visualização de rolagem iônica, evitamos a rolagem padrão e usamos Javascript para exibi-la, deixando o cabeçalho no lugar.

Infelizmente, não sou um especialista em roteadores de interface do usuário, mas tente colocar o conteúdo de íons ao redor de todo o conteúdo da página e veja se isso ajuda.

Eu entendo agora, mas isso não leva ao efeito visual indesejável de toda a barra de navegação desaparecer, incluindo o botão Voltar?

Mais especificamente no meu caso de uso, se eu colocar o campo de entrada dentro de um conteúdo de íons, como posso ter certeza de que eles fiquem fixos na parte superior, abaixo da barra de cabeçalho, de forma que as animações de transição funcionem corretamente no iOS e Android?

Sim, a situação de fazer malabarismos com guias e manter uma área de rolagem para uma entrada parece bem complicada, e isso deve acontecer com bastante frequência. @adamdbradley e eu estamos investigando isso agora.

Não tenho certeza se entendi o problema com as transições, se você fizer 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>

atrapalha as animações? É bem possível que ter várias áreas de conteúdo bagunce outras coisas, já que provavelmente haverá apenas uma.

@tlancina Ah, ótimo, não pensei em usar dois elementos de conteúdo de íons em um parcial. Veremos como isso funciona e apresentarei um relatório.

O problema com as animações de transição a que me referia ocorre em certas versões do Android. Se você usar position: static em um elemento e sair dessa visualização, no Android 4.1 para 4.3 (acredito, não tenho 100% de certeza, vou verificar) esses elementos permanecerão bloqueados assim que a animação começar. Portanto, todos os elementos (conteúdo de íons, guias, barras de cabeçalho, etc.) começarão a se mover para a esquerda, mas o elemento que você deu a posição: estático permanecerá no mesmo lugar até que a animação seja concluída. Isso não acontece no iOS. É por isso que hesitei em usar a posição estática em qualquer lugar.

@tlancina Acabei de tentar colocar o elemento de entrada em um conteúdo de íon e colocar o resto do conteúdo em outro, segundo conteúdo de íon. Infelizmente, qualquer entrada inserida no elemento de entrada não filtrará mais a repetição de ng que está no outro conteúdo de íons. Outras sugestões?

@CoenWarmer é porque o conteúdo de íons cria um escopo filho.

Experimente colocar um controlador sobre ambos os conteúdos. Se o controlador for, não use apenas uma primitiva para a entrada.

Você está sofrendo o problema 'ponto' de herança de escopo - um primitivo em um escopo filho diferente está sendo definido no escopo filho, não no escopo pai. Você sabe o que eu quero dizer? Se não, deixe-me saber e eu encontrarei um link / explicarei.

Não estou familiarizado com isso, infelizmente não. Cuidado em compartilhar? :)

https://www.youtube.com/watch?v=DTx23w4z6Kc

Ah, sim, isso faz sentido! Vou tentar de novo: +1:

hey @adam. Que tal um rodapé com uma entrada? Como está fora da área de rolagem, também causará o problema. Alguma maneira de contornar isso?

Também tenho esse problema no iPad (7.1). Eu vi que o ionic adiciona height = device-height à janela de visualização após as alterações recentes, se não estiver definido.
Por causa dessa propriedade, a janela de visualização atinge cerca de 200 px (altura) de tamanho e é totalmente rolável.
Quando eu removo, ele funciona.
Posso consertar isso se, de alguma forma, definir .view e .pane para a posição: fixed e body para position: static, mas a janela de exibição principal ainda é muito grande e mostra uma barra de rolagem no lado direito se eu mover o dedo para cima e para baixo.

A propósito ... isso é independente do foco de entrada. O foco de entrada apenas move a posição de rolagem para que você possa ver o resultado.

Ei pessoal, qual é o progresso atual aqui?
Eu criei um arquivo iônico personalizado e removi a adição 'height = device-height' dele.
Após essa mudança, tudo funcionará bem. Não são mais necessárias correções de CSS e o foco no toque do campo de entrada está funcionando corretamente.
Também estou usando o plug-in do teclado no iOS e faço o seguinte:

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

Colocar a entrada em um conteúdo de íon separado também não interrompe o comportamento de tornar a visualização inteira, incluindo a barra de cabeçalho rolável sob a visualização da web, quando a entrada obtém o foco. O mesmo comportamento ocorre em meu screencast anterior: https://www.dropbox.com/s/2g6b41n3s3vpj0s/2.mov

@ D3CK3R , estamos trabalhando para

@CoenWarmer , você se importaria de dar uma

Você pode instalá-lo executando cordova plugin add https://github.com/driftyco/ionic-plugins-keyboard.git de dentro do seu projeto Cordova.

@tlancina Isso funciona! Depois de adicionar o plug-in, o conteúdo não pode mais ser arrastado para baixo da janela de visualização quando a entrada está em foco. Incrível!!

O plugin está pronto para produção? Eu adoraria implantar isso o mais rápido possível, pois este projeto acaba de ser publicado na loja.

@CoenWarmer você não tem ideia de como fiquei feliz ao ver seu último comentário! Ótimo trabalho @tlancina!

@adamdbradley @tlancina

Sim!!!

@CoenWarmer sim para iOS está pronto para produção. Temos uma versão anterior dele em um aplicativo que acabou de ser aceito na app store, e não acho que o material de rolagem que adicionamos seja causa de rejeição. Estou muito feliz por estar funcionando para você!

Bom para fechar? @tlancina

Isso ainda era um problema na versão beta14. Depois de uma extensa depuração, finalmente encontrei a correção.

No meu caso, estava relacionado ao meu meta viewport .

Valor original (fazendo com que o cabeçalho apareça atrás da barra de status)

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

Novo valor (corrigindo este problema)

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

Eu comecei meu projeto muuuuito antes de beta1 então provavelmente este era algum html legado que eu nunca percebi.

Espero que isso ajude alguém.

@rvanbaalen Eu tenho a meta viewport exata no meu arquivo de índice, mas no meu caso, quando foco o elemento de texto de entrada, o corpo fica no topo da barra de status, resultando em ocultar a barra de status. A barra de status permanece oculta depois disso, mesmo depois que o teclado desliza para baixo.

Isso ainda é um problema para mim. Eu tenho o plugin de teclado adicionado. Estou tentando usar uma área de texto simples como um "bloco de notas" para que ela preencha toda a tela, como você pode ver com minha altura: estilos 100%. Para fazer esses estilos funcionarem, tive que desabilitar a rolagem com scroll = "false" porque o estilo de altura só se expandirá até a altura do pai. Provavelmente há uma maneira melhor de fazer este "bloco de notas" para evitar esse problema e agradeceria todas as sugestões.

Eu adicionei uma cor de fundo à textarea para tornar as capturas de tela abaixo mais óbvias.

Estou usando esta visão:

<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

Depois de clicar na área de texto

Demonstrando que posso rolar enquanto a área de texto está em foco.

Ainda é um problema pessoal, por favor ajudem @ajoslin @adamdbradley

Simulador de iOS - iPhone 6 / iOS 8.3
versão iônica 1.0.0-rc.0
plug-ins 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 do 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
Você deveria tentar

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.

da nota do ios do

vai funcionar como um encanto.

posso definir cordova.plugins.Keyboard.disableScroll (true) e ainda esperar que a exibição role para minha entrada?
Se eu desabilitar a rolagem, a barra de status não é mais empurrada, mas o teclado se sobrepõe ao meu campo de entrada.

@michaelknoch contanto que sua entrada esteja dentro de uma visualização de rolagem (como o conteúdo de íons), ela deve rolar automaticamente para a visualização, a menos que você tenha chamado ionic.keyboard.disable() .

@michaelknoch, acho que você está pedindo conexão de teclado

@LightZam, mas suporta apenas a barra de rodapé de íons e minha entrada está dentro do meu conteúdo na visualização de íons

@tlancina devo embrulhar meu conteúdo com ionScroll? http://ionicframework.com/docs/api/directive/ionScroll/

@michaelknoch você não deve precisar, pois ion-content já tem uma visualização de rolagem. Se você puder criar um codepen simples que reproduza o problema, junto com o telefone e sistema operacional que você está usando, bem como a saída do comando ionic info (se você estiver usando a CLI), pegarei um olhar.

@tlancina Estou enfrentando esse problema em
Cordova CLI: 5.2.0
Versão Ionic: 1.1.0
Versão Ionic CLI: 1.6.4
Versão Ionic App Lib: 0.3.8
versão ios-deploy: 1.7.0
versão ios-sim: 4.1.1
SO: Mac OS X Yosemite
Versão do nó: v0.12.7
Versão do Xcode: Xcode 7.0 Build versão 7A176x
telefone - iphone 4S, ios 7.0.6

se eu mantiver o cabeçalho "cordova.plugins.Keyboard.disableScroll (true)", não empurro, mas o teclado vem em cima da minha área de texto. e eu mantive a textarea (usando com elástico msd) dentro, para obter um estilo semelhante ao WhatsApp, portanto, seu conteúdo de íon externo

e se eu usar a conexão de teclado, então ele estraga com elástico msd :(
alguma sugestão ?

tentei com ionic.Platform.fullScreen ()
mas sem sorte ... também esta fullScreen () cria outro problema no ios ...
reduz a altura do cabeçalho ... já que este css não é aplicado quando você chama fullscreen ()
.platform-ios.platform- cordova: not (.fullscreen) .bar- header: not (.bar-subheader) {height: 64px; }

tudo estava bem em andorid.

Estou tendo quase o mesmo problema depois de atualizar o Cordova para 6.0.0, ou seja, a barra de status aparece e se sobrepõe à barra de cabeçalho quando o campo do formulário está focado. Este problema existe no meu dispositivo Android. Ainda não experimentei o dispositivo iOS. Alguém pode ajudar?

Cordova CLI: 6.0.0
Versão do Gulp: CLI versão 3.8.11
Gulp local: versão local 3.8.11
Versão Ionic: 1.0.0-rc.5
Versão Ionic CLI: 1.7.14
Versão Ionic App Lib: 0.7.0
versão ios-deploy: 1.8.3
versão ios-sim: 5.0.4
SO: Mac OS X El Capitan
Versão do nó: v0.12.2
Versão do Xcode: Xcode 7.2 Build versão 7C68

Eu estava tendo esse problema no Android depois de atualizar para Cordova 6.0.0 e resolvi chamando o método AndroidFullScreen.immersiveMode do plugin https://github.com/mesmotronic/cordova-plugin-fullscreen

// Oculte a IU do sistema e mantenha-a oculta (somente Android 4.4+)
AndroidFullScreen.immersiveMode (successFunction, errorFunction);

Este problema ainda está acontecendo, resolvê-lo em tela inteira não é uma solução apropriada, já que o aplicativo não deve realmente ser executado em tela inteira, mas apenas para o teste que tentei, e embora o aplicativo vá para o modo de tela inteira, é ainda "maior" que a tela, portanto, você pode rolar um pouco com o cabeçalho indo sob a barra de status ...
Por favor ajude!

Tendo esse problema para? Existe uma solução alternativa?

Também tendo o mesmo problema com iOS no Ionic 2

Ambiente
Cordova CLI: 6.0.0
Versão Ionic: 2.0.0-beta.3
Versão Ionic CLI: 2.0.0-beta.19
Versão Ionic App Lib: 2.0.0-beta.9
versão ios-deploy: não instalado
versão ios-sim: 5.0.6
SO: Mac OS X El Capitan
Versão do nó: v5.7.1
Versão do Xcode: Xcode 7.2.1 Build version 7C1002

Como você pode ver, não há espaço / preenchimento entre a barra de status e o cabeçalho no aplicativo Ionic.

O novo / antigo problema com o teclado está aqui novamente. Embora eu possa desabilitar a rolagem quando a entrada é focada por fita adesiva, o antigo problema com a rolagem do cabeçalho para fora da visualização está novamente presente ao focar campos de formulário com o botão especial do teclado virtual. No teclado Android, há um botão verde no canto inferior direito que permite alternar para a próxima entrada no formulário. Mesmo se a rolagem estiver desativada, o botão rola a visualização para tornar as entradas focadas visíveis e, como resultado, o cabeçalho está fora da tela.

Para testar isso, a primeira entrada deve estar na visualização e focada com o teclado visível e a segunda entrada deve estar abaixo da dobra (em algum lugar sob o teclado). Agora, tocar no botão verde (como na imagem) resulta na rolagem da visualização e o cabeçalho sai da tela.

Cordova 6.3.0
teclado-plugin-iônico 2.2.1
Testado em dispositivo com Android 5
Construído para Android 24.0.1

Você tem alguma ideia para desativar este botão ou corrigir o problema? Não tenho 100% de certeza, mas suspeito que isso começou após a atualização do Cordova para uma versão 6+.

@rafaellop Você resolveu esse problema?

ter esse problema aparece quando o upload de arquivo da tela do telefone / câmera abre no iOS.

Estou tendo esse problema com o redator de e-mail

Editar Para aqueles que ainda estão tendo esse problema mesmo depois de tentar de tudo, tente voltar para [email protected]. Parece que 4.3 pode ter introduzido algum comportamento estranho. Mesmo os mais recentes noturnos de Cordova-ios não pareceram resolver meu problema, mas a reversão resolveu-o na hora.

Esse problema ainda está acontecendo comigo, isso não foi resolvido.

No IOS, se tocarmos na barra de status, todo o conteúdo de íons piscará em IONIC2.Como resolver esse problema. Sugira ...
Obrigada.

Reverter para

Acabei de perceber em outra postagem que consegui fazer o downgrade do plug-in cordova-statusbar de 2.2.1 para 2.2.0 e isso corrigiu o problema. Parece que foi o plug-in da barra de status que está causando o problema no meu caso.

Eu tive esse problema com

• iônico 3.9.2
• cordova-ios 4.4.0
• iOS 10.3
• Uma variedade de dispositivos e emuladores iPhone

Eu tinha uma textarea com height: 100%; (que era todo de conteúdo de íons) e o cabeçalho de íons desaparecia de vista sempre que a textarea estava focada. Minha correção foi alterá-lo para height: auto; min-height: 25%; e colocar a textarea dentro de um div com height: 100%; margin: 0; padding: 0; e (click)=focusTextArea() . Um tanto desagradável e adoraria uma solução melhor, mas por enquanto funciona bem: +1:

Use este plugin plugin cordova ionic add cordova-plugin-ionic-webview --save. Resolveu o meu problema, obrigado

Eu tive o mesmo problema em combinação com o plugin email-composer.

Resolvi o problema atualizando o cordova-plugin-statusbar da versão 2.2.1 para 2.3.0.

@ jvhe123 Acabei de tentar fazer isso, mas parece que a v2.3.0 não existe. Você quer dizer a v2.2.3?

@ glenr4

• cordova-plugin-keyboard 1.2.0
• teclado-plugin-iônico 2.2.1

Eu estava tendo esse problema com o iPhone X. Abrir o teclado empurrou o cabeçalho para cima e quase saiu da página.

Corrigi-lo colocando um eventListener em meu arquivo javaScript para a página afetada:

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

Isso funcionou para mim, espero que possa funcionar para um de vocês também.

Obrigado pelo problema! Este problema está sendo bloqueado para evitar comentários que não são relevantes ao problema original. Se isso ainda for um problema com a versão mais recente do Ionic, crie um novo problema e certifique-se de que o modelo esteja totalmente preenchido.