user1246562
user1246562

Reputation: 825

How is the size of the StatusBar (in the Toolbar) set?

In my app, on iphone as well as in the iPhoneX skin on the simulator, the size of StatusBar (inside the Toolbar) is for some reason too small/thin, so the title of the Form is shown partially hidden by the iPhoneX notch.

I've tried to understand how to fix this, but I simply can't figure out how the size of the StatusBar is set. I don't change the size of the StatusBar UIID in my css file, nor in my code and yet it is smaller than if I create a fresh Hello World example with the iPhoneX.skin.

I first thought it could be the SafeArea which changed the size, but it doesn't seem so. Then I thought the default theme (or the values of the Default UIID in the css) could change the size, but it doesn't seem to be that either. I probably miss something obvious, but I'm stuck so any help would be greatly appreciated.

PS. I could of course force the size of the StatusBar in css myself, but then I'm not sure it will work on the various devices, so I prefer rely on the default value defined by CN1.

Upvotes: 1

Views: 87

Answers (1)

Shai Almog
Shai Almog

Reputation: 52770

The StatusBar UIID is defined internally and is generally hard coded to a value that fits for most themes. This very much depends on the padding in your Title UIID which is often large and works in tandem with the status bar. Assuming your title has 0 padding you might need more padding to the StatusBar.

Assuming you're using CSS you can use something like:

@media platform-ios {
    StatusBar {
        padding: 7mm;
    }
}

Upvotes: 0

Related Questions