1、ionic 正確打包完app, 並且按照正常的步驟配置config.xml文件之后 ,啟動頁面還是不能正常的顯示出來,而是黑了一下之后,就進入首頁了
原因很有可能就是你沒有裝cordova-plugin-splashscreen這個插件,嘗試安裝:
cordova plugin add cordova-plugin-splashscreen
重新打包,即可顯示出來啟動頁圖片
2、啟動頁打開后會在圖片消失會出現一小段黑屏的時間
解決方法:
首先,啟動頁的圖片消失時間默認是在config.xml配置的
<preference name="SplashScreenDelay" value="3000"/>
也就是3s后自動消失,但是往往這個時候,app的資源還沒有加載完整,所以,會在消失后顯示一小段時間黑屏;
因此,我們不要讓他在config.xml配置自動消失,或者讓他持續很長時間才消失,例如10s,然后我們在app.js 讓他在設置資源加載完成准備就緒的時候才讓他消失顯示我們的app主頁;
config.xml配置改為:
<preference name="SplashScreen" value="screen"/> <preference name="AutoHideSplashScreen" value="false"/> <preference name="ShowSplashScreenSpinner" value="false"/> <preference name="SplashMaintainAspectRatio" value="true"/> <preference name="SplashShowOnlyFirstTime" value="false"/> <preference name="SplashScreenDelay" value="10000"/> <preference name="FadeSplashScreenDuration" value="300"/>
然后,app.js添加代碼 navigator.splashscreen.hide(),如下:
app.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
// for form inputs)
if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
cordova.plugins.Keyboard.disableScroll(true);
}
if (window.StatusBar) {
// org.apache.cordova.statusbar required
StatusBar.styleDefault();
}
//啟動頁面消失
navigator.splashscreen.hide();
});
這樣,這個bug就可以解決了。ionic app 的細節問題很多,如果不嘗試去解決的話,那app的體驗將會很差,所以,盡量記錄起來!
