Nativescript: Status bar text stays black with out action bar

[firescript]

Tell us about the problem

The action bar is required to change the color of the status bar text.

Which platform(s) does your issue occur on?

iOS

Please provide the following version numbers that your issue occurs with:

• CLI: 2.01

  Please tell us how to recreate the issue in as much detail as possible.

• new project (tns create statusbar)

• try and change color of status bar to white, with out having an action bar.

Code to change status text to white:

    if (page.ios) {
        var navigationBar = frameModule.topmost().ios.controller.navigationBar;
        navigationBar.barStyle = 1;
        navigationBar.tintColor = UIColor.whiteColor();
    } 

add this action bar code to main-page.xml

<Page.actionBar>
    <ActionBar title="Title" icon="">
        <NavigationButton text="Back" icon="" tap="" />
        <ActionBar.actionItems>
            <ActionItem icon="" text="Left" tap="" ios.position="left" />
            <ActionItem icon="" text="Right" tap="" ios.position="right" />
        </ActionBar.actionItems>
    </ActionBar>
</Page.actionBar>

once you have the action bar code in, you will see the color go to white. if you remove the action bar code you will see the white text goes away and it goes back to black.

if we could chose white/black and set background to transparent even with out an action bar that would be awesome.

DEMO APP with everything in it: statusBar.zip

[tsonevn]

Hi @firescript,
Thank your for reporting your problem.

I reviewed your issue and found that you could not style StatusBar with navigationBar.barStyle = 1; when you do not have ActionBarin your xml file. However I found that there is one easy way to set different StatusBar style to your application. You could add in your app/App_Resources/iOS/Info.plist following lines

<key>UIStatusBarStyle</key>
<string>UIStatusBarStyleLightContent</string>
<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

before closing </dict> tag. In regard to that you should set backgroundColor to your page and to set page.backgroundSpanUnderStatusBar to true. I am attaching example bellow:

main-page.xml

<Page navigatedTo="navigatingTo" backgroundColor="red">
    <Label text="sample status bar style" />
</Page>

main-page.js

function navigatingTo(args) {
    var page = args.object;
    page.backgroundSpanUnderStatusBar = true;
}
exports.navigatingTo = navigatingTo;

I hope this helps.

[sitefinitysteve]

Any chance we could add this to the official docs before closing? It's gonna keep coming up again and again.

[larssn]

Is it possible to dynamically change the iOS statusbar text color, while, again, not using the ActionBar?

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.