React Native - Odd spaces on iPhone X
Camo's answer is right. The issue is related on splash screen. But i just wanted to share how i fixed my issue since I am not using storyboard for my launchScreen. So first i created a new launchscreen image with dimensions 1125x2436(portrait) and 2436x1125(landscape) and added it to my launchimage directory. And then updated the Contents.json file adding this 2 configurations:
{
"orientation" : "portrait",
"idiom" : "iphone",
"extent" : "full-screen",
"minimum-system-version" : "11.0",
"filename" : "1125x2436.png",
"subtype" : "2436h",
"scale" : "3x"
},
{
"orientation" : "landscape",
"idiom" : "iphone",
"extent" : "full-screen",
"minimum-system-version" : "11.0",
"filename" : "2436x1125.png",
"subtype" : "2436h",
"scale" : "3x"
}
Probably you are setting the launch screen as images, try by setting the LaunchScreen
as a storyboard and be sure to have the Use Safe Area Layout Guides
active on it.
If you don't have a LaunchScreen.storyboard
you can just create a new one an set it, or create a new empty project and just grab the existing LaunchScreen.storyboard
and copy/paste it to your current project.