I faced with problem. My StatusBar in the app has zoomed like on screen below.
** App init:
<Root>
<StatusBar
barStyle={'dark-content'} />
<App />
</Root>
** React-native v0.55.4
** iPhone 8+
How to avoid this problem? Thank you for any answers!
As per react-native docs status bar style dark-content type makes your text and icon bold.
StatusBarStyle
default - Default status bar style (dark for iOS, light for Android)
light-content - Dark background, white texts and icons
dark-content - Light background, dark texts and icons
In some case lauch images/lauch storyboard is reason for zoomed
Related
When launching a flutter built iOS application, I briefly get this black background surrounding the launch screen. How would you change the black background depicted in the image? I tried changing the launch screen background color in Xcode, but I still get this black "border".
The black "border" in the opening app animation has to do with the way the default flutter icons were generated. I generated my own icons using this generator, and the app animates as intended.
I have auto generated app icon using "ionic cordova resources ios" command.The icon generated for iOS having black border around the app icon and not looking properly .Do we need to manually create the icons with recommended iOS app icon sizes? . Has anyone faced similar kind of issues?. please suggest.
Note :The icon is having For android icon looks good at all different resolutions
As Ionic using automated Icon generation for iOS and Android app and due to that your Icon have black border around.
Black border reason :
Your Main Icon have some transparency or transparent area around your Icon. or may be your Icon is already have corner radius.
Solution : Please remove transparency from your icon and corner radius and again generate your iOS icon will remove black border.
Note: iPhone OS automatically add corner radius so not required to add
it in our app icon.
Hope this Info will help to solve your problem!
I am working with Ionic framework and noticed this issue when emulating the app on ios.
If I try to emulate my app on iPhone the status bar is hidden, but if I try to emulate on iPad the status bar overlaps with my app screen.
To emulate I use this command:
ionic emulate ios --target="iPad-Air"
This is an example image that shows what I mean by overlap. The "TOP OF MY CONTENT" overlaps with status bar.
Here is the example that does not overlap:
And this image shows what I mean by hidden status bar:
The the status bar on the left image is visible and on the image on the right is hidden.
My questions:
Why if I emulate on iPad as target: ionic emulate ios --target="iPad-Air" the status bar overlaps with my app page, but when I use iPhone as target: ionic emulate ios --target="iPhone-6-Plus" the status bar is hidden?
How can I hide the status bar or at least force it not to overlap with my app screen?
I have already found some answers to modify the config.xml like this:
<preference name="StatusBarOverlaysWebView" value="false" />
But it does not work.
I try to use the status bar plug-in in the config.xml to build with phonegap
and then change the color and StatusBarOverlaysWebView, ...
Everything's fine when opening the app in portrait. Statusbar in black above the appview and it remains OK when changing to landscape.
But opening the app in landscape gives me 3/4 of the screen (from the left) in black. If I change to portrait from there, the black remains.
Anyone else had this problem?
changing the phonegap version doesn't help
thnx
grtz
Change the plugin with this one:
<gap:plugin name="cordova-plugin-statusbar" source="npm" />
iOS 6 provided statusbar tinted on iPhone, but I cant find it on iPad
I tried to modify [SBApplication StatusBarStyle] and other [StatusBarStyle]'s value to "1" via FLEX (Cydia plugin), and after I enabled these tweaks, any App's 1st launch, I can see the StatusBar is tinted with color
however, after the App is fully started, statusbar went totally black
can anybody help me? thx a alot!