Phonegap KeyboardShrinksПримечание и фиксированное положение на iOS не применяются правильно
Я использую версию Phonegap версии 2.9.0, и я хочу, чтобы при появлении клавиатуры мой WebView сжимался, как это было сделано в приложениях Android phonegap. У меня есть элементы нижнего колонтитула и заголовка в фиксированном положении, а когда клавиатура открыта, это вызывает проблемы (нижний колонтитул и заголовок теряют состояние фиксированной позиции).
Я думаю, что настройки KeyboardShrinksView могут исправить это, согласно документации на телефонную рассылку: http://docs.phonegap.com/en/2.9.0rc1/guide_project-settings_ios_index.md.html#Project%20Settings%20for%20iOS
- приложение webview в магазине приложений, будет ли оно принято?
- Веб-поток IOS остановился при использовании webSocket в UiWebView
- Как использовать собственный sqlite в веб-обзоре ios?
- UIWebView изменяет размеры на loadRequest
- iOS UIWebView просочился
- webView: didFailLoadWithError -1004: Не удалось подключиться к серверу при подключении google plus в Phonegap ios
Но с большим количеством попыток я не могу заставить его работать, WebView не сжимается.
Я думал, может быть, это может произойти из-за конфликта между другими настройками, установленными на моем config.xml:
config.xml
<gap:platform name="ios" /> <gap:platform name="android" /> <preference name="fullscreen" value="false" /> <preference name="webviewbounce" value="false" /> <preference name="orientation" value="portrait" /> <preference name="KeyboardShrinksView" value="true" />
Или, может быть, это может произойти из определения метатега, особенно для видового экрана:
index.html
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />
Вы знаете, почему он не работает? Или у вас есть обходное решение для этого?
EDIT: Я видел, что он меняет что-то, когда KeyboardShrinksView = true, но когда клавиатура открыта, она сокращает нижнюю часть моего контента (включая нижний колонтитул и поле) вместо изменения размера всего содержимого. Я ожидаю, что он подставит мой нижний колонтитул только в верхней части клавиатуры, верно?
спасибо за помощь
2 Solutions collect form web for “Phonegap KeyboardShrinksПримечание и фиксированное положение на iOS не применяются правильно”
Да, сейчас это боль. В настоящее время нет реального решения сделать такие вещи, как они были в iOS. Лично я сейчас жонглирую два разных тега в своих приложениях (один для iOS и один для Android), и он приближается к старому поведению на iOS. Вот что я использую:
<!-- IOS --> <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" />` <!-- ANDROID --> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=1" />
Мои настройки config.xml – это то, что вы ожидаете:
<preference name="HideKeyboardFormAccessoryBar" value="true" /> <preference name="KeyboardShrinksView" value="false" />
Вот несколько ссылок, на которые следует следить и продолжать прослушивать (то есть запрашивать), что люди Кордовы, наконец, исправит это.
-
Проблема CB-4862: https://issues.apache.org/jira/browse/CB-4862 (Это ключевой вопрос, который был изначально закрыт, но после комментария, который я сделал некоторое время назад, он был вновь открыт)
-
Проблема CB-5852: https://issues.apache.org/jira/browse/CB-5852 (Здесь CB-4862 сказали, что возможное исправление может существовать, но начальные тесты разработчиков показывают, что это не решение ).
Надеемся, эти ссылки, по крайней мере, помогут вам познакомиться с последней информацией о проблемах, связанных с клавиатурой. Если у кого-нибудь есть ссылки / ссылки на это, пожалуйста, поделитесь!
Я исправил его, вызвав этот код при каждом изменении страницы:
$('input').unbind('focusout'); $(document).on('focusout', 'input', function() { setTimeout(function() { window.scrollTo(document.body.scrollLeft, document.body.scrollTop); }, 500); });