1

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.

user1246562
  • 825
  • 5
  • 7

1 Answers1

0

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;
    }
}
Shai Almog
  • 51,749
  • 5
  • 35
  • 65
  • Thanks. However, my question is not actually about how to set it, but to understand how/why it changes to a wrong value in my app. The margin of StatusBar is somehow changed to 2 and padding to 3 (pixels) and I just can’t figure how/where it happens. But it sounds from your answer like it should not be changed by CN1 except for the values set by the theme (the iOS7Theme.res file I assume)? I’ve also checked the .res file in the Designer to and the StatusBar does not Derive from anything else. – user1246562 Mar 23 '21 at 21:50
  • Are you using CSS or the Designer? Did you define a global default that might impact the default usage of millimeters as the unit type? – Shai Almog Mar 24 '21 at 03:40
  • I use css. But I checked the .res with Designer. I have indeed defined Default in css but it doesn’t define padding/margin. I was not aware there is a way to change the default usage of millimeters as unit type, what could make that happen? – user1246562 Mar 24 '21 at 06:34
  • The base iOS native theme defines the default to millimeters. I don't think that's changeable but maybe there's a bug in the loading that caused the theme to load partially. Do you see anything in the console? – Shai Almog Mar 25 '21 at 03:21
  • I don't see any obvious issues in the output log. I get this: "Retina Scale: 2.0 Using stateful mode. Use -help flag to see options for new stateless mode. Updating merge file /Users/user/NetBeansProjects/myapp/target/css/theme.css.merged Compiling /Users/user/NetBeansProjects/myapp/target/css/theme.css.merged to /Users/user/NetBeansProjects/myapp/src/theme.res File has not changed since last compile." I found somewhere in the code that the styles initialize to the same 2 and 3 I mentioned above. Is there a way I could debug to understand where the theme style is being changed? – user1246562 Mar 26 '21 at 20:54
  • UIManager is where the theme is applied to the UI. If you can extract a test case that shows this consistently I'd like to see that. – Shai Almog Mar 27 '21 at 04:35