Biały ekran po ekranie startowym, Ionic2, urządzeniu z Androidem

Question

Aktualnie tworzę aplikację Ionic2. Mam problem, że po ekranie Splash istnieje biały ekran przez 6-7 sekund, przed ekranem głównym aplikacji.

Próbowałem googlować, ale nic nie działa. Moja ostatnia próba rozwiązania jest

hideSplashScreen() { 
    if(Splashscreen){ 
     setTimeout(() => { 
     Splashscreen.hide(); 
     },100) 
    } 
    };// 

<preference name="SplashMaintainAspectRatio" value="true"/> 
<preference name="FadeSplashScreenDuration" value="300"/> 

Proszę mi pomóc w tej kwestii;

EDIT :: Moja ionic info jest

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0-rc.4 
Ionic CLI Version: 2.1.17 
Ionic App Lib Version: 2.1.7 
Ionic App Scripts Version: 0.0.47 
ios-deploy version: 1.8.6 
OS: OS X El Capitan 
Node Version: v6.3.1 
Xcode version: Xcode 7.2 Build version 7C68 

Answer 1

Aktualizacja projekt Ionic i zmienić niektóre preferencje wystarczyły dla mnie.

Tutaj changelog and infos.

1 - Aktualizacja do najnowszej wersji Ionic CLI, Cordova i Typescript:

npm uninstall -g ionic cordova typescript 
npm install -g ionic cordova typescript 

2 - Aktualizacja package.json dopasować następujące zależności, usunąć istniejące node_modules katalog, a następnie uruchomić npm install:

"scripts": { 
    "build": "ionic-app-scripts build", 
    "clean": "ionic-app-scripts clean", 
    "ionic:build": "ionic-app-scripts build", 
    "ionic:serve": "ionic-app-scripts serve" 
    }, 
    "dependencies": { 
    "@angular/common": "4.0.2", 
    "@angular/compiler": "4.0.2", 
    "@angular/compiler-cli": "4.0.2", 
    "@angular/core": "4.0.2", 
    "@angular/forms": "4.0.2", 
    "@angular/http": "4.0.2", 
    "@angular/platform-browser": "4.0.2", 
    "@angular/platform-browser-dynamic": "4.0.2", 
    "@ionic-native/core": "3.6.1", 
    "@ionic-native/in-app-browser": "3.6.1", 
    "@ionic-native/splash-screen": "3.6.1", 
    "@ionic-native/status-bar": "3.6.1", 
    "@ionic/storage": "2.0.1", 
    "ionic-angular": "3.1.1", 
    "ionicons": "3.0.0", 
    "rxjs": "5.1.1", 
    "sw-toolbox": "3.4.0", 
    "zone.js": "0.8.9" 
    }, 
    "devDependencies": { 
    "@ionic/app-scripts": "1.3.6", 
    "typescript": "2.3.2" 
    } 

3 - Aktualizacja config.xlm z tych preferencji (live recenzja jest ok):

<preference name="loadUrlTimeoutValue" value="700000"/> 
    <preference name="webviewbounce" value="false"/> 
    <preference name="UIWebViewBounce" value="false"/> 
    <preference name="DisallowOverscroll" value="true"/> 
    <preference name="android-minSdkVersion" value="16"/> 
    <preference name="BackupWebStorage" value="none"/> 
    <preference name="StatusBarStyle" value="default"/> 
    <preference name="SplashScreen" value="screen"/> 
    <preference name="orientation" value="default"/> 
    <preference name="SplashMaintainAspectRatio" value="true"/> 
    <preference name="FadeSplashScreenDuration" value="300"/> 
    <preference name="ShowSplashScreenSpinner" value="false"/> 
    <preference name="AutoHideSplashScreen" value="false"/> 
    <preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine"/> 
    <preference name="SplashScreenDelay" value="3000"/> 

4 - Potem mam kopiowania/wklejania kodu, które zostały zmodyfikowane od here niedawno do mojego projektu (Ionic 2 demo i aktualne app - Sprawdź GitHub).

Teraz aplikacja rozpoczyna się pomyślnie bez długiego ekranu startowego.

ps:

• livereview: ionic run android -l
• produkcja: ionic run android --prod --release
• Pamiętaj, że masz do ukrycia ręcznie ekran powitalny (jak @Markus powiedział Wagner) w swoim app.component.ts: this.platform.ready().then(() => { Splashscreen.hide(); });

EDIT: Aktualizacja Ionic V3.1.1 (2017-04-28)

Answer 2

domyślnie ekran powitalny jest ukryty po 3 sekundach (patrz https://github.com/apache/cordova-plugin-splashscreen#configxml). Możliwe jednak, że w tej chwili Twoja aplikacja nie jest gotowa.

Dlatego dodaję zawsze następującą preferencję do mojej konfiguracji .xml:

<preference name="AutoHideSplashScreen" value="false"/> 

Zamiast tego ukryć go ręcznie, tak szybko, jak aplikacja jest gotowa:

this.platform.ready().then(() => { 
    Splashscreen.hide(); 
}); 

To działa na iOS, jak i Android.

Answer 3

dodać flagę --prod podczas któregokolwiek z następujących poleceń CLI:

// If iOS 
ionic emulate ios --prod 
ionic build ios --prod 
ionic run ios --prod 


// If Android 
ionic emulate android --prod 
ionic build android --prod 
ionic run android --prod 

Więcej informacji budowy (przygotowanie + kompilacji) projekt Ionic dla danej platformy https://ionicframework.com/docs/cli/cordova/build/