2017-04-25 26 views
0

Ionic 2を使用してプログレッシブWebアプリケーションを構築しています。ブラウザでは、AndroidとiOSの両方のデバイス上で、レイアウトが必要です。iOSレイアウトのIonic PWAが「ホーム画面に追加」の

Android用ChromeとSafariで、「Add to homescreen」ボタンを使用してウェブアプリへのショートカットを追加できます。アプリを開くと、アプリに類似のエクスペリエンスをユーザーに与えるためのアドレスバーなしでアプリが表示されます。

Androidでは、この機能は問題なく動作します。しかし、iOSでは、この機能はアプリのレイアウトに奇妙な問題を引き起こします。

例:私は<ion-slides>をポケットベルのアイコンとして使用しています。 Androidでは、弾丸はページの一番下にあります。 iOSでは、ホームスクリーンに追加した後、弾丸は画面のほぼ中央にあり、弾丸の上の残りの部分はわずかに上に移動しています。

スワイプは、iOSで奇妙な動作をする別のものです。 Safariからホームスクリーンに追加すると、移動したページの部分だけをスワイプできます。 以下のすべてのスワイプは部分をスワイプできません。

私は誰も私をとても演技からレイアウトを防止する方法についていくつかのアドバイスを与えることはできますか?10.3.1

までのiOS 9から、これらの問題に実行してきましたか

答えて

0

まあまあ私の運。さまざまなソリューションを検索して何も見つけなかった後、スタックオーバーフローに関する問題を投稿することに決めました。運が良ければ、1時間以内に解決策を見つけました!

私に魔法の力を与えるためにスタックオーバーフローありがとう! statusBarsplashScreen

this.platform.ready().then(() => { 
    statusBar.styleDefault(); 
    splashScreen.hide(); 
}); 

:同様の問題への解決策を探して、誰のために

、以下を試してみてください。

あなたはapp.components.tsに次のコードを使用していることを確認しますそれぞれ@ionic-native/status-bar@ionic-native/splash-screenから来ます。また、プロバイダとして両方とものapp.module.tsにロードするようにしてください。 package.jsonでは、

"@ionic-native/splash-screen": "3.4.2", 
"@ionic-native/status-bar": "3.4.2" 

としてそれらを含めると、その後npm installを実行したい場合があります。

関連する問題