Белый экран после заставки, Ionic2, Android-устройство

В настоящее время я разрабатываю приложение Ionic2. Я сталкиваюсь с проблемой, что после экрана Splash, перед экраном приложения на экране появляется белый экран в течение 6-7 секунд.

Я попробовал какой-то поисковик, но ничего не работает. Моя последняя попытка решить -

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

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

Пожалуйста, помогите мне в этом выпуске;

EDIT:: My ionic info есть

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

Ответы

Ответ 1

Обновление Ионного проекта и изменение некоторых настроек сделало трюк для меня.

Здесь журнал изменений и информация.

1 - обновите до последней версии Ionic CLI, Cordova и Typescript:

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

2 - Обновите package.json, чтобы соответствовать следующим зависимостям, удалите существующий каталог node_modules, а затем запустите 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 - обновите свой config.xlm с этими настройками (просмотр в реальном времени - это нормально):

  <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 - Затем у меня есть копия/вставка кода, который недавно был изменен из здесь в мой проект (демо-версия Ionic 2 и до приложение даты - проверьте Github).

Теперь приложение запускается успешно без длинного экрана.

пс:

  • livereview: ionic run android -l
  • продукция: ionic run android --prod --release
  • Помните, что вам нужно спрятать вручную заставку (например, @Markus Wagner) в app.component.ts: this.platform.ready().then(() => { Splashscreen.hide(); });

РЕДАКТИРОВАТЬ: Обновить до Ionic v3.1.1 (2017-04-28)

Ответ 2

По умолчанию заставка закроется через 3 секунды (см. https://github.com/apache/cordova-plugin-splashscreen#configxml). Но может быть, что на данный момент ваше приложение не готово.

Поэтому я всегда добавляю следующее предпочтение в свой config.xml:

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

Вместо этого я спрячу его вручную, как только приложение будет готово:

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

Это работает как на iOS, так и на Android.

Ответ 3

Добавьте флаг -prod во время любой из следующих команд 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

Дополнительная информация о сборке (подготовка + компиляция) ионного проекта для данной платформы https://ionicframework.com/docs/cli/cordova/build/