Ionic-framework: Панель заголовка перемещается вверх за панелью состояния или даже полностью выходит из области просмотра, когда поле формы находится в фокусе

Дубликат № 818

Спасибо. Мы работаем над этими ошибками клавиатуры для beta2.

Есть ли у вас какие-либо сведения о том, что может вызвать это?
К тому времени, когда вы планируете выпустить бета-версию 2, мое приложение уже доступно ;-)

Вот рабочая демонстрация этой проблемы:

Я только что проверил это в процессе «Приступая к работе», используя «Ionic, v1.0.0-beta.1».

Мои шаги:

• npm install -g cordova ionic
• статус ионного запуска
• ионная платформа добавить iOS

Затем я отредактировал app.js чтобы начать с простой формы. :

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

Потом:

• ионная сборка iOS
• ионная эмуляция iOS

Вот результат:

Как видите, клавиатура перемещает форму вверх в строку состояния.

Привет, Джастин, я считаю, что проблема в том, что

Попробуйте и дайте мне знать, поможет ли это.

В среду, 2 апреля 2014 г., в 16:34, Джастин Ноэль [email protected] написал :

Вот рабочая демонстрация этой проблемы:

Я только что проверил это в процессе «Приступая к работе», используя «Ionic,
v1.0.0-beta.1 ".

Мои шаги:

• npm install -g cordova ionic
• статус ионного запуска
• ионная платформа добавить iOS

Затем я отредактировал app.js, чтобы начать с простой формы. :

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

Потом:

• ионная сборка iOS
• ионная эмуляция iOS

Вот результат:

[изображение: проблема со строкой состояния] https://cloud.githubusercontent.com/assets/57374/2597008/fb174690-baad-11e3-80aa-c88985210bcb.gif

Как видите, клавиатура перемещает форму вверх в строку состояния.

Ответьте на это письмо напрямую или просмотрите его на Gi tHubhttps: //github.com/driftyco/ionic/issues/932#issuecomment -39386769
.

К сожалению, это не помогло. В примере проекта я добавил это в "style.css":

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

Это не сработало, хотя "style.css" включен после файла Ionic CSS. Я также подтвердил в отладке Safari, что к телу был применен position: static .

Итак, я тогда попробовал просто тело, но безуспешно.

body {
    position: static;
}

Затем я только что обновил файл «ionic.css». Это все еще не сработало.

Я также подумал, что вы, возможно, хотели сделать заголовок статичным; поэтому я попробовал. И с этим не повезло.

Ах, не видел, это только iOS 7.1. У меня сейчас нет доступа к Mac, так что завтра я посмотрю первым делом. Спасибо за помощь в этом.

Спасибо за рабочую демонстрацию Джастин: +1:

В зависимости от ваших настроек установка .body на position:static ничего не исправит, поскольку .pane и .view также имеют абсолютную позицию.

В пользовательских мобильных веб-приложениях, которые я создал, заголовок должен находиться за пределами любого из этих сильно позиционированных элементов, а для самого заголовка установлено значение position:fixed чтобы оставаться там, когда клавиатура поднята. В Android есть опция под названием adjust-resize которая сжимает вид, чтобы он поместился над клавиатурой. iOS, с другой стороны, просто панорамирует вид, чтобы центрировать ввод на экране.

У Кордовы также есть предпочтение под названием «KeyboardShrinksView», для которого по умолчанию установлено значение false. Я еще не смотрел на это, но похоже, что это решение для iOS того, что Android уже делает с помощью Adjust-resize.

Создание гармонии между обоими этими различиями - это АДА работы.

Сейчас мы активно работаем над исправлениями клавиатуры, чтобы решить все эти проблемы.

К сожалению, эта ошибка не исправлена ​​в nightly 1717.

Одна вещь, которую заметила эту тестовую страницу, чтобы помочь отладить эти проблемы на каждом устройстве.

Прямо сейчас я думаю, что причина в том, что мы не предотвращаем нажатие на ярлык по умолчанию. Если мы выполним e.preventDefault () на этикетке, обертывающей ввод, клавиатура не будет автоматически всплывать при первом нажатии. Я рассмотрю это подробнее, спасибо.

@adamdbradley добровольно стал еще одним тестером этого исправления, когда оно попадает в

К сожалению, эта проблема еще не решена в версии 1.0.0 beta2.

@CoenWarmer Мы знаем о проблемах и все еще работаем над ними. Кроме того, имейте в виду, что при сообщении о любых проблемах с клавиатурой укажите платформу, версию платформы и проблему в мобильном браузере, эмуляторе или в Cordova, и если это Cordova, то в полноэкранном режиме или нет. Другая полезная информация включает в себя элемент, который вы нажали, например метку или ввод, приходилось ли вам вручную прокручивать в любое время, чтобы добраться до ввода, имеет ли мета-окно просмотра height = device-height или нет, и если элемент внизу, где в конечном итоге будет отображаться виртуальная клавиатура, наполовину показывает, где будет отображаться клавиатура, или это вверху и нет необходимости прокручивать. Спасибо

Встречается:

• iOS7.1.1
• Ионная 1.0.0 бета 2
• в Кордове
• в симуляторе и устройстве
• не полный экран
• метка не используется, только ввод
• представление можно прокручивать после того, как поле ввода получает фокус, если поле ввода не имеет фокуса, представление не может быть прокручено
• представление не прокручивается сразу после того, как оно получает фокус и появляется клавиатура. Когда поле ввода окажется в фокусе, вы можете поместить палец в поле ввода и перетащить его вверх, чтобы переместить представление из веб-просмотра.

Также происходит на Android 4.4 и 4.3, также с использованием 1.0.0 beta2. Точно такие же обстоятельства, как iOS7.1. Поэтому, когда поле ввода получает фокус и появляется клавиатура, все в порядке, это когда ввод получает фокус, а затем вы помещаете палец в поле ввода и начинаете перетаскивать его вверх или вниз, тогда вы можете переместить весь контент из представления. . Позже сделаю скринкаст.

Скринкаст: https://www.dropbox.com/s/2g6b41n3s3vpj0s/2.mov

После beta2 у меня эта проблема возникает на маленьких экранах (например, iphone3 или iphone4).

iphone 5 (хорошо)

iphone 4 (проблемы)

@zelphir Не могли бы вы предоставить код, который воспроизводит эту проблему? Они оба iOS 7.0 или 7.1?

@CoenWarmer случайно ли вы область контента ? Единственный способ воспроизвести вашу проблему - использовать ввод, который не отображается в режиме прокрутки.

Просто чтобы уточнить - это ожидаемое поведение, если вы не используете режим прокрутки. Если под клавиатурой есть входы, и вы не можете прокручивать их с помощью JS, тогда браузер вынужден сдвигать контент вверх, чтобы они были видны, поэтому вы можете перемещать все вверх.

@tlancina Мои данные не находятся в области содержимого.

Это код, который я использую:

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

Я не уверен, что полностью понимаю, что вы говорите об ожидаемом поведении. Сейчас похоже, что приложение ломается, когда все прокручивается под заголовком. Должен ли я вместо этого поместить поле ввода в ионное содержимое?

Предположим, у вас есть список из нескольких входов, доходящий до конца страницы. Если они не находятся в области, которую можно прокрутить с помощью Javascript, как они могут быть отображены при открытии клавиатуры? Единственный способ - использовать встроенную в браузере прокрутку, которая работает путем смещения содержимого - всего его, включая заголовок.

Когда область ввода или фокусируемая область находится в представлении ионной прокрутки, мы предотвращаем прокрутку по умолчанию и используем Javascript, чтобы отобразить ее, оставляя заголовок на месте.

К сожалению, я не эксперт по пользовательскому интерфейсу, но попробуйте разместить ion-content вокруг всего содержимого на странице и посмотрите, поможет ли это.

Теперь я понимаю, но разве это не приводит к нежелательному визуальному эффекту исчезновения всей панели навигации, включая кнопку «Назад»?

Более того, в моем случае использования, если я помещаю поле ввода в ion-content, как я могу убедиться, что они остаются фиксированными вверху под панелью заголовка таким образом, чтобы анимация перехода корректно работала на iOS и Android?

Да, ситуация с манипуляциями с вкладками и поддержанием прокручиваемой области для ввода кажется довольно сложной, и это должно происходить довольно часто. @adamdbradley и я

Не уверен, что понимаю проблему с переходами, если вы сделаете что-то вроде

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

это портит анимацию? Вполне возможно, что наличие нескольких областей содержимого испортит другие вещи, поскольку предполагается, что существует только одна.

@tlancina Отлично , я не подумал об использовании двух элементов с ионным содержанием в одной части. Посмотрим, как это сработает, и доложу.

Проблема с анимацией перехода, о которой я говорил, возникает в некоторых версиях Android. Если вы используете position: static для элемента и переходите от этого представления, на Android 4.1 на 4.3 (я считаю, не на 100% уверен, проверит) эти элементы останутся заблокированными после начала анимации. Таким образом, все элементы (ion-content, вкладки, панели заголовков и т. Д.) Начнут перемещаться влево, но элемент, которому вы задали position: static, останется на том же месте до завершения анимации. На iOS этого не происходит. Вот почему я не решался использовать static position где-либо.

@tlancina Просто попытался поместить элемент ввода в одно ионное содержимое, а остальное содержимое - в другое, второе ионное содержимое. К сожалению, любой ввод, введенный в элемент ввода, больше не будет фильтровать ng-repeat, который находится в другом содержимом ion. Другие предложения?

@CoenWarmer , потому что ion-content создает

Попробуйте поставить контроллер на оба содержимого. Если контроллер есть, то не используйте просто примитив для ввода.

Вы страдаете "точечной" проблемой наследования области видимости - примитив в другой дочерней области устанавливается в дочерней области, а не в родительской области. Ты знаешь, что я имею в виду? Если нет, дайте мне знать, и я найду ссылку / объясню.

Не знаком с ним, к сожалению, нет. Заботиться, чтобы поделиться? :)

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

Ага, в этом есть смысл! Попробую еще раз: +1:

привет @adam. Как насчет нижнего колонтитула с полем ввода? Поскольку это находится за пределами области прокрутки, это тоже вызовет проблему. Каким-либо образом обойти это?

У меня тоже такая проблема на iPad (7.1). Я видел, что ionic добавляет height = device-height в область просмотра после недавних изменений, если он не установлен.
Из-за этого свойства окно просмотра становится большим размером около 200 пикселей (высота) и полностью прокручивается.
Когда я его снимаю, он работает.
Я могу исправить это, если как-то установить .view и .pane в position: fixed и body в position: static, но основное окно просмотра по-прежнему велико и показывает полосу прокрутки с правой стороны, если я перемещаю палец вверх и вниз.

Кстати ... это не зависит от фокуса ввода. Фокус ввода перемещает только позицию прокрутки, чтобы вы могли видеть результат.

Привет, ребята, каков текущий прогресс?
Я создал собственный файл ionic и удалил из него добавление «height = device-height».
После этого изменения все работает нормально. Исправления CSS больше не требуются, и фокус на поле ввода работает правильно.
Я также использую плагин Keyboard на iOS и делаю следующее:

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

Размещение ввода в отдельном ion-content также не останавливает поведение всего представления, включая полосу заголовка, прокручиваемой под веб-представлением, когда ввод получает фокус. То же самое, что и в моем предыдущем скринкасте: https://www.dropbox.com/s/2g6b41n3s3vpj0s/2.mov

@ D3CK3R, мы работаем над

@CoenWarmer, не

Вы можете установить его, запустив cordova plugin add https://github.com/driftyco/ionic-plugins-keyboard.git из вашего проекта Cordova.

@tlancina Это работает! После того, как я добавил плагин, контент больше нельзя перетащить под область просмотра, когда вход находится в фокусе. Потрясающие!!

Готов ли плагин к производству? Я хотел бы развернуть это как можно скорее, так как этот проект только что был опубликован в магазине.

@CoenWarmer, ты даже не представляешь, как я был счастлив увидеть твой последний комментарий! Отличная работа @tlancina!

@adamdbradley @tlancina

Ага!!!

@CoenWarmer: да, для iOS он готов к производству. У нас есть его более ранняя версия в приложении, которое только что было добавлено в магазин приложений, и я не думаю, что добавленная нами прокрутка является причиной для отказа. Очень рад, что это работает для вас!

Хорошо закрыть? @tlancina

Это все еще оставалось проблемой в версии beta14. После некоторой обширной отладки я наконец нашел исправление.

В моем случае это было связано с моим meta viewport .

Исходное значение (в результате чего заголовок отображается за строкой состояния)

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

Новое значение (устранение этой проблемы)

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

Я начал свой проект waaaay еще до beta1 так что, вероятно, это был какой-то устаревший html, который я никогда не замечал.

Надеюсь, это кому-то поможет.

@rvanbaalen У меня есть точное мета-окно просмотра в моем индексном файле, но в моем случае, когда я фокусирую текстовый элемент ввода, тело находится поверх строки состояния, что приводит к скрытию строки состояния. После этого строка состояния остается скрытой даже после сдвига клавиатуры вниз.

Для меня это все еще проблема. Я добавил плагин клавиатуры. Я пытаюсь использовать простое текстовое поле в качестве «блокнота», чтобы оно занимало весь экран, как вы можете видеть с моими стилями height: 100%. Чтобы эти стили заработали, мне пришлось отключить прокрутку с помощью scroll = "false", потому что стиль высоты будет расширяться только до высоты родительского элемента. Вероятно, есть лучший способ сделать этот «блокнот», чтобы избежать этой проблемы, и я буду признателен за любые предложения.

Я добавил цвет фона в текстовое поле, чтобы сделать скриншоты ниже более наглядными.

Я использую это представление:

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

Первоначальный вид

После щелчка по текстовой области

Демонстрация того, что я могу прокручивать, пока текстовая область находится в фокусе.

Все еще проблема, ребята, помогите, пожалуйста, @ajoslin @adamdbradley

Симулятор iOS - iPhone 6 / iOS 8.3
ионная версия 1.0.0-rc.0
установлены плагины:

• 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 из модального окна:

<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
Ты должен попытаться

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.

с клавиатуры ios note

это будет работать как шарм.

Могу ли я установить cordova.plugins.Keyboard.disableScroll (true) и по-прежнему ожидать, что представление будет прокручиваться до моего ввода?
Если я отключу прокрутку, строка состояния больше не будет выдвигаться, но клавиатура перекрывает мое поле ввода.

@michaelknoch, пока ваш ввод находится в режиме прокрутки (например, ion-content), он должен автоматически прокручиваться в представление, если вы не вызвали ionic.keyboard.disable() .

@michaelknoch, я думаю, вы просите прикрепить клавиатуру

@LightZam, но он поддерживает только панель с ионным колонтитулом, и мой ввод находится внутри моего контента в режиме ионного просмотра

@tlancina следует ли мне оборачивать свой контент с помощью ionScroll? http://ionicframework.com/docs/api/directive/ionScroll/

@michaelknoch вам не нужно, так как ion-content имеет режим прокрутки. Если вы можете создать простой код, который воспроизводит проблему вместе с тем, какой телефон и операционную систему вы используете, а также вывод команды ionic info (если вы используете CLI), я возьму взгляд.

@tlancina Я столкнулся с этой проблемой на
Кордова CLI: 5.2.0
Ионная версия: 1.1.0
Версия Ionic CLI: 1.6.4
Версия Ionic App Lib: 0.3.8
Версия ios-deploy: 1.7.0
версия ios-sim: 4.1.1
ОС: Mac OS X Yosemite
Версия узла: v0.12.7
Версия Xcode: Xcode 7.0 Версия сборки 7A176x
телефон - iphone 4S, ios 7.0.6

если я сохраню заголовок «cordova.plugins.Keyboard.disableScroll (true)», не выталкивайте, но клавиатура появляется поверх моего текстового поля. и я сохранил текстовое поле (используя с msd-elastic) внутри, чтобы получить такой же стиль, как WhatsApp, поэтому его внешнее ионное содержимое

и если я использую клавиатуру, то она облажается с msd-elastic :(
какие-либо предложения ?

пробовал с ionic.Platform.fullScreen ()
но не повезло ... также этот fullScreen () создает еще одну проблему в ios ...
он уменьшает высоту заголовка ... поскольку этот css не применяется, когда вы вызываете fullscreen ()
.platform-ios.platform- cordova: not (.fullscreen) .bar- header: not (.bar-subheader) {высота: 64px; }

все было хорошо в андориде.

У меня почти такая же проблема после обновления Cordova до 6.0.0, а именно, появляется строка состояния и перекрывает панель заголовка, когда поле формы находится в фокусе. Эта проблема существует на моем устройстве Android. Я еще не пробовал устройство iOS. Может ли кто-нибудь помочь?

Кордова CLI: 6.0.0
Версия Gulp: версия CLI 3.8.11
Gulp local: Локальная версия 3.8.11
Ионная версия: 1.0.0-rc.5
Версия Ionic CLI: 1.7.14
Версия Ionic App Lib: 0.7.0
Версия ios-deploy: 1.8.3
версия ios-sim: 5.0.4
ОС: Mac OS X El Capitan
Версия узла: v0.12.2
Версия Xcode: Xcode 7.2 Версия сборки 7C68

У меня возникла эта проблема на Android после обновления до Cordova 6.0.0, и я решил ее, вызвав метод AndroidFullScreen.immersiveMode плагина https://github.com/mesmotronic/cordova-plugin-fullscreen

// Скрыть системный интерфейс и оставить его скрытым (только для Android 4.4+)
AndroidFullScreen.immersiveMode (successFunction, errorFunction);

Эта проблема все еще возникает, решение ее путем перехода в полноэкранный режим не является подходящим решением, поскольку приложение не должно работать в полноэкранном режиме, а только для теста, который я пробовал, и хотя приложение действительно переходит в полноэкранный режим, оно все еще «больше», чем экран, поэтому вы можете немного прокрутить его, чтобы заголовок находился под строкой состояния ...
Пожалуйста помоги!

Возникла эта проблема? Есть обходной путь?

Также есть такая же проблема с iOS в Ionic 2

Среда
Кордова CLI: 6.0.0
Ионная версия: 2.0.0-beta.3
Версия Ionic CLI: 2.0.0-beta.19
Версия Ionic App Lib: 2.0.0-beta.9
Версия ios-deploy: не установлена
версия ios-sim: 5.0.6
ОС: Mac OS X El Capitan
Версия узла: v5.7.1
Версия Xcode: Xcode 7.2.1 Версия сборки 7C1002

Как видите, между строкой состояния и заголовком в приложении Ionic нет места / отступов.

Новая / старая проблема с клавиатурой снова здесь. Хотя я могу отключить прокрутку, когда ввод сфокусирован с помощью ленты, старая проблема с прокруткой заголовка за пределами поля зрения снова присутствует при фокусировке полей формы с помощью специальной кнопки виртуальной клавиатуры. На клавиатуре Android в правом нижнем углу есть зеленая кнопка, которая позволяет перейти к следующему вводу в форме. Даже если у меня отключена прокрутка, кнопка прокручивает представление, чтобы сделать видимыми вводимые данные, и в результате заголовок оказывается за пределами экрана.

Чтобы проверить это, первый ввод должен быть в представлении и сфокусирован с видимой клавиатурой, а второй ввод должен быть ниже сгиба (где-то под клавиатурой). Теперь нажатие зеленой кнопки (как на картинке) приводит к прокрутке представления, и заголовок исчезает с экрана.

Кордова 6.3.0
ионная-плагин-клавиатура 2.2.1
Проверено на устройстве с Android 5
Сборка для Android 24.0.1

Есть ли у вас идеи отключить эту кнопку или решить проблему? Я не уверен на 100%, но подозреваю, что это началось после обновления кордовы до какой-то версии 6+.

@rafaellop Вы решили эту проблему?

эта проблема появляется, когда загрузка файла с экрана телефона / камеры открывается в iOS.

У меня проблема с композитором электронной почты

Редактировать Для тех, у кого эта проблема все еще возникает даже после того, как вы попробовали все, попробуйте вернуться к

Эта проблема все еще возникает у меня, это не решено.

В IOS, если мы нажмем на строку состояния, весь ионный контент будет мигать в IONIC2. Как решить эту проблему. Пожалуйста, предложите ..
Спасибо.

К сожалению, возврат к

Только что понял из другого сообщения, я смог понизить версию плагина cordova-statusbar с 2.2.1 до 2.2.0, и это устранило проблему. Похоже, что в моем случае проблема была вызвана плагином строки состояния.

У меня была проблема с

• ионный 3.9.2
• Кордова-iOS 4.4.0
• iOS 10.3
• Ассортимент устройств и эмуляторов iPhone

У меня было текстовое поле с height: 100%; (которое было полностью ионным содержимым), и ионный заголовок уменьшался в масштабе всякий раз, когда текстовое поле было сфокусировано. Мое исправление заключалось в том, чтобы изменить его на height: auto; min-height: 25%; и поместить текстовое поле внутри div с height: 100%; margin: 0; padding: 0; и (click)=focusTextArea() . Kinda janky, и мне бы хотелось получить лучшее решение, но пока это работает нормально: +1:

Пожалуйста, используйте этот плагин ionic cordova plugin add cordova-plugin-ionic-webview --save. Это решило мою проблему, спасибо

У меня возникла та же проблема в сочетании с плагином email-composer.

Я решил проблему, обновив cordova-plugin-statusbar с версии 2.2.1 до 2.3.0.

@ jvhe123 Я только что пробовал это сделать, но похоже, что версии 2.3.0 не существует, вы имеете в виду версию 2.2.3?

@ glenr4

• Кордова-плагин-клавиатура 1.2.0
• ионная-плагин-клавиатура 2.2.1

У меня была эта проблема с iPhone X. Открытие клавиатуры сдвинуло заголовок вверх и почти со страницы.

Я исправил это, поместив eventListener в свой файл javaScript для затронутой страницы:

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

Это сработало для меня, надеюсь, сработает и для одного из вас.

Спасибо за вопрос! Эта проблема заблокирована, чтобы предотвратить комментарии, не относящиеся к исходной проблеме. Если это все еще проблема с последней версией Ionic, создайте новую проблему и убедитесь, что шаблон полностью заполнен.