Блог

Главная - Вопросы по программированию - Ионный с конденсатором, удаляющим белый экран после всплеска?

Ионный с конденсатором, удаляющим белый экран после всплеска?

#ionic-framework #capacitor

#ионный-фреймворк #конденсатор

Вопрос:

пытаясь решить проблему с белым экраном после загрузки заставки, как нам ее удалить? я попытался установить тайм-аут, но все еще не работает.

с помощью cordova я могу его настроить, но у меня не получается использовать конденсатор

Комментарии:

1. Где именно вы терпите неудачу? Вы должны отредактировать свой вопрос и объяснить его и, возможно, показать некоторый код. Это увеличивает ваши шансы получить полезный ответ.

2. когда приложение загружается, оно показывает заставку, а затем после этого показывает белый экран перед полной загрузкой приложения. можете ли вы помочь?

3. Как упоминалось @marsh-wiggle, добавьте несколько скриншотов кода. В частности, ваш метод ngOnInit() в app.component.ts .. должен быть какой-то блокирующий код, который приводит к белому экрану.

Ответ №1:

Попробуйте это.

capacitor.config.json — о плагинах

 "plugins": {
            "SplashScreen": {
              "launchShowDuration": 5000,
              "launchAutoHide": true,
              "androidScaleType": "CENTER_CROP",
              "androidSplashResourceName": "splash",
              "splashFullScreen": false,
              "splashImmersive": false
            }
          },
          "android": {
            "allowMixedContent": true
          }

А затем в android/app/src/main/res/values/styles.xml файле:

Измените приведенное ниже:

 <style name="AppTheme.NoActionBarLaunch" parent="AppTheme.NoActionBar">
    <item name="android:background">@drawable/splash</item>
</style>

Для:

 <style name="AppTheme.NoActionBarLaunch" parent="AppTheme.NoActionBar">
        <item name="android:background">@drawable/splash</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:windowActionBar">false</item>
        <item name="android:windowFullscreen">true</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowIsTranslucent">true</item>
   </style>

launchShowDuration Вероятно, это то, что вам нужно. В случае, если у вас возникнет проблема с растягиванием ширины изображения всплеска, xml решит это…

Комментарии:

1. Согласно вашему методу, строка состояния скрыта даже после заставки.

Ответ №2:

У меня была такая же проблема.

конденсатор для управления необходим для установки плагина SplashScreen.

Это работает для меня:

 npm i --save @capacitor/splash-screen

capacitor.config.json // .ts

 "plugins": {
"SplashScreen": {
  "launchShowDuration": 10000,
  "launchAutoHide": false
}}

app.component.ts

 import {SplashScreen} from '@capacitor/splash-screen';
setTimeout(() => {
    SplashScreen.hide();
  }, 2000);

Комментарии:

1. lol это просто ждет, пока он не завершит загрузку, закрывшись параметром setTimeout: P

Ответ №3:

Вы можете изменить цвет в capacitor.config с. backgroundColor 

 {
    "appId": "io.ionic.starter",
    "appName": "app",
    "webDir": "build",
    "bundledWebRuntime": false,
    "backgroundColor": "#ff0000" // <-- here
}

Вам не нужно загружать дополнительный пакет «@capacitor / SplashScreen» lol.

Отказ от ответственности: Я говорю за конденсатор v3 и ионный v5

Комментарии:

1. Работает и на Ionic 6 тоже, спасибо!

Ответ №4:

Конденсатор 3 / Ионный 5 / Угловой 12

Это работает для меня:

capacitor.config.json

  "plugins": {
    "SplashScreen": {
      "launchAutoHide": false,
      "showSpinner": true
    }
  }

app.component.ts

  ngOnInit(): void {
    this.initializeApp();
  }

 private initializeApp(): void {
   
    // other code here

    setTimeout(() => {
      SplashScreen.hide();
    }, 2000);
  }
Метки: