質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Cordova

Cordovaは様々なデバイスで使うことができるオープンソースなモバイル用開発プラットフォームです。開発者に各デバイスの元のプラットフォームで開発する必要をなくし、HTML・JavaScript・CSSなどの一般的なウェブのテクノロジーを使ってすべてのデバイスで展開することができるモバイルのアプリケーションを生成することを可能にします。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

Q&A

解決済

1回答

715閲覧

monca Xcode 11.3 cordova-ios 5.1.1 でビルドすると、初回起動時のみ画面が上にズレます

knkenkn

総合スコア9

Cordova

Cordovaは様々なデバイスで使うことができるオープンソースなモバイル用開発プラットフォームです。開発者に各デバイスの元のプラットフォームで開発する必要をなくし、HTML・JavaScript・CSSなどの一般的なウェブのテクノロジーを使ってすべてのデバイスで展開することができるモバイルのアプリケーションを生成することを可能にします。

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

Monaca

「Monaca」はiOS、Android、Windows向けのアプリ開発に対応した、Cordovaベースのモバイルアプリ開発プラットフォームです。HTML5、JavaScriptといったWeb標準技術を用いてモバイルアプリ開発を行うことができます。

0グッド

0クリップ

投稿2020/03/05 08:31

発生している現象

monacaで、2020年3月3に公開されたWkWebView対応機能を適用してiOSのデバッグビルドを行うと、
ビルドされたアプリの初回起動時のみ、画面が全体的に2、3cmほど上にズレて表示されます。
iOS12系、13系、iPhone 6, 6s, 7, Xで同様の現象が出ているので、どのOS、端末でも発生すると思われます。

なお、2回目のアプリ起動時には発生せず、
アンインストールして再インストールしてから再度アプリを起動すると100%発生します。

同じソースでAndroidをビルドしても、表示は正常です。

回避策をご存じの方、いらっしゃらいないでしょうか?

使用しているバージョン

monaca
・Cordova: 9.0.0
・iOS: 5.1.1 Xcode 11.3
・Android: 8.1.0 Gradle 4.10.3

試したこと

・SafariのWebインスペクタを使って、初回起動時、および2回目以降の起動時の要素(CSS適用状態)を確認しましたが、特に差は見つけられませんでした。
・cordova-plugin-statusbar(ver 2.4.3)を利用していたので、試しに外してみましたが、特に変化はありませんでした。

何かアドバイスがあれば、ぜひお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

私も同じ問題に引っ掛かっています。
以下の記述がありました。挙動には別問題がありそうですが、対症療法的にはうまく作用しています。
https://stoock.xyz/%E6%9C%AA%E5%88%86%E9%A1%9E/onsenuixwkwebview%E3%81%A7%E7%94%BB%E9%9D%A2%E4%B8%8B%E9%83%A8%E3%81%AB%E3%81%A7%E3%81%8D%E3%82%8B%E8%AC%8E%E3%81%AE%E4%BD%99%E7%99%BD%E3%82%92%E8%A7%A3%E6%B6%88%EF%BC%88cordovamonaca%EF%BC%89/

スプラッシュ表示後修正されます。
html, body {
width: 100vw;
height: 100vh;
}
ただ、<input>があってkeybordが表示されると症状は再発します。
抜本的な解決にはなりません。継続して情報をお持ちの方待ってます。

追記です。
PlugIn Verを1.2.1とし諸々設定を見直したところ小生の確認した症状は無くなりました。

投稿2020/03/26 22:27

編集2020/03/30 10:59
yhasegawa55

総合スコア189

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

knkenkn

2020/03/30 11:09

ご回答ありがとうございます。 > ただ、<input>があってkeybordが表示されると症状は再発します。 > 抜本的な解決にはなりません。 そうなんです。 こちらでも、記述していただいたようなCSSで一見回避できたかのように見えるのですが、keybordが表示されるとダメになるのです。 何かのバージョンアップで勝手に直らないかなと、、、結局は半ば諦めて放置していたところです。 > PlugIn Verを1.2.1とし諸々設定を見直したところ小生の確認した症状は無くなりました。 情報ありがとうございます。 すぐには実験できない状況なのですが、あとで頂いた情報をもとにいじってみます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問