Вопрос:

Попытка изменить цвет текста в строке состояния приложения Ionic

android ios angularjs ionic-framework ionic2

2828 просмотра

2 ответа

276 Репутация автора

Похоже, что множество потоков обсуждают это, но не с каким-либо реальным решением. Я надеялся, что это будет что-то простое. По сути, все, что я хочу сделать, это изменить цвет текста строки состояния, так как мой заголовок / панель навигации / строка состояния темно-синий. Цвет текста по умолчанию черный, и я просто хочу изменить его на белый, это так просто.

Где я могу сделать эти изменения? Я уже установил плагин строки состояния, и мой конфигурационный файл находится ниже (без каких-либо изменений, предложенных в некоторых темах).

<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="portrait" />
<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" />

Как я могу решить это?

Автор: bluewavestudio Источник Размещён: 18.03.2017 08:44

Ответы (2)


4 плюса

1861 Репутация автора

Это зависит от фона строки состояния, если вы используете темный фон, вы можете сделать это:

platform.ready().then(() => {
    // Okay, so the platform is ready and our plugins are available.
    // Here you can do any higher level native things you might need.
        StatusBar.styleLightContent();
});

У меня есть это на конструкторе моего app.component.ts

Чтобы проверить больше вариантов, вы можете проверить документ здесь

Автор: Carlos Guzman Размещён: 18.03.2017 08:48

-1 плюса

671 Репутация автора

В app.jsфайле примените это:

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard)
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if (window.StatusBar) {
      // org.apache.cordova.statusbar required
      // StatusBar.styleDefault();
      StatusBar.style(1)
    }
  });
})

Другие варианты:

  • StatusBar.style(1) // Свет
  • StatusBar.style(2) // Черный, полупрозрачный
  • StatusBar.style(3) // черный, непрозрачный
  • Statusbar.styleColor( 'Черный')
  • Statusbar.styleHex('#FF0000') // Красный
Автор: Jonathan Brizio Размещён: 18.03.2017 09:30
Вопросы из категории :
32x32