開発中のCordovaアプリのステータスバーを表示したくない。私はほとんどそこにいます、スプラッシュスクリーンにステータスバーが表示されません。ただし、ロードする最初のページでは、ステータスバーが非表示になる前にフラッシュが表示されます。
Xcodeの「ステータスバーを隠す」チェックボックスをチェックしました。
_cordova-plugin-statusbar
_プラグインを追加し、deviceready
コールバックでStatusBar.hide()
を呼び出しています。
ただし、スプラッシュ画像が消えて最初のページがレンダリングされると、ページが表示される前にステータスバーが点滅します。それは一瞬だけですが、ひどく見えます。
ステータスバーが非表示になる前にフラッシュせずに完全に非表示にする方法を知っている人はいますか?
私はこの質問に非常に遅れて答えていますが、検索の1日後には、これがうまくいったので、他の人と共有したいと思います。
docs (および jcesarmobile 回答済み)によると:
起動時に非表示にする
実行時に以下のStatusBar.hide関数を使用できますが、アプリの起動時にStatusBarを非表示にするには、アプリのInfo.plistファイルを変更する必要があります。
これらの2つの属性が存在しない場合は、追加/編集します。 「ステータスバーは最初は非表示」を「YES」に設定し、「コントローラーベースのステータスバーの外観を表示」を「NO」に設定します。 Xcodeなしで手動で編集する場合、キーと値は次のとおりです。
そのためには、アプリのinfo.plist
ファイルをplatforms/ios/<app-name>/<app-name>-Info.plist
ファイル内で変更して、次の行を追加する必要があります。
<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
ただし、ビルドプロセス後に上書きされる可能性のある変更を保存する必要があるため、お勧めしません。
(最新のCordova CLIを使用している場合は、ここからアップデート2を参照してください)
したがって、クリーンな代替手段として cordova-custom-config を使用する必要があります。ドキュメントによると:
なぜ使用する必要があるのですか?
一部のプラットフォーム設定は、
config.xml
のCordova/Phonegapを介して設定できますが、多く(特に新しいプラットフォームリリースに関連するもの)は設定できません。 1つの解決策は、platforms /ディレクトリの構成ファイルを手動で編集することですが、これは複数の開発マシンまたは後続のビルド操作が変更を上書きする可能性のあるCI環境で維持できません。このプラグインは、準備操作の完了後に追加のプラットフォーム固有の設定を許可し、Cordovaによって設定された設定をオーバーライドするか、他の未指定の設定を設定できるようにすることで、このギャップに対処しようとします。カスタム設定は
config.xml
に入力されるため、バージョン管理にコミットして複数の開発マシン、CI環境に適用し、ビルド間またはプラットフォームが削除および再追加された場合でも維持できます。
今、あなたがしなければならないことは、あなたのCordovaアプリに対して次のコマンドを実行することです:
cordova plugin add cordova-custom-config --save
そして、これをconfig.xml
ブロックの下の<platform name="ios">
ファイルに追加します。
詳細については、 cordova-custom-config (バージョン> 5)プラグインを参照してください
<custom-config-file parent="UIStatusBarHidden" platform="ios" target="*-Info.plist">
<true/>
</custom-config-file>
<custom-config-file parent="UIViewControllerBasedStatusBarAppearance" platform="ios" target="*-Info.plist">
<false/>
</custom-config-file>
Cordova-custom-configプラグインバージョン<5を使用している場合は、custom-config-file
タグをconfig-file
に置き換えます。
https://github.com/dpa99c/cordova-custom-config#changes-in-cordova-custom-config5
Cordova CLI 6以降、cordova-custom-config
ファイルを変更するためにplatforms/ios/*-info.plist
プラグインをインストールする必要がなくなりました。 Cordova CLIには、edit-config
タグを使用した組み込みのサポートがあります。したがって、config.xml
の下の<platform name="ios">
に以下を追加するだけです。
<edit-config file="*-Info.plist" mode="merge" target="UIStatusBarHidden">
<true />
</edit-config>
<edit-config file="*-Info.plist" mode="merge" target="UIViewControllerBasedStatusBarAppearance">
<false />
</edit-config>
この変更は、platform/ios/ios.json
ファイルと競合するため、Cordovaアプリケーションのビルド時に失敗する場合があります。これを修正するには、2つのオプションがあります( reference ):
IOSプラットフォームを再度追加します。
ionic cordova platform remove ios
ionic cordova platform add ios
https://issues.Apache.org/jira/browse/CB-13564
platform/ios/ios.json
ファイルで*-Info.plist
の代わりにedit-config
を使用します。したがって、追加する必要のある最終構成:
<edit-config file="platforms/ios/ios.json" mode="merge" target="UIStatusBarHidden">
<true />
</edit-config>
<edit-config file="platforms/ios/ios.json" mode="merge" target="UIViewControllerBasedStatusBarAppearance">
<false />
</edit-config>
それから:
cordova prepare ios
編集:
Cordova CLI 6.5.0以降では、edit-config
プラグインなしでinfo.plistに書き込むタグ。これにより、起動時にステータスバーが非表示になります
<edit-config file="*-Info.plist" target="UIStatusBarHidden" mode="merge">
<true/>
</edit-config>
<edit-config file="*-Info.plist" target="UIViewControllerBasedStatusBarAppearance" mode="merge">
<false/>
</edit-config>
起動時に非表示にする
実行時に以下のStatusBar.hide関数を使用できますが、アプリの起動時にStatusBarを非表示にするには、アプリのInfo.plistファイルを変更する必要があります。
これらの2つの属性が存在しない場合は、追加/編集します。 「ステータスバーは最初は非表示」を「YES」に設定し、「コントローラーベースのステータスバーの外観を表示」を「NO」に設定します。 Xcodeなしで手動で編集する場合、キーと値は次のとおりです。
<key>UIStatusBarHidden</key>
<true/>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>
この方法は私に役立ちました:
MacまたはVM xcodeで、TARGETS-> Your appを選択します
次に、INFOメニューのCUSTOM iOS TARGET PROPERTIESで、この新しいプロパティを追加します。
ステータスバーは最初は非表示です->次に、値をYESに設定します。
コントローラーベースのステータスバーの外観を表示->次に、値をNOに設定します
ビルドすると、ステータスバーは表示されません。
printscreen: http://prntscr.com/fg0jtf
Androidでも同じ問題が発生していました。 'appCtrl' init()関数から以下のstatusBar()関数を呼び出すだけで解決しました。
IOSで機能することを願っています。
$rootScope.statusBar = function(){
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
//console.log(StatusBar);
StatusBar.hide();
}
このプラグインを確認してください Cordovaでのステータスバーのカスタマイズ