React Native + React Native Navigation: launch images setup [iOS] (iPhone)

Readme.md

Personal note on how to setup launch images in RN when using RNN [iOS] (iPhone).

Preparation

Launch image sizes:

portrait

1. Retina HD 5.5" : 1242 x 2208 px
2. Retina HD 4.7" : 750 x 1334 px
3. 2x : 640 x 960 px
4. Retina 4 : 640 x 1136 px

format: .png

Setting up

1. Navigate to Images.xcassets
2. Press + in the bottom left corner
3. In the dropdown menu select App Icons & Launch Images -> New iOS Launch Image
4. This will create a new Launch Image Set
5. Select it and in the Utilites view navigate to the Attributes Inspector
6. In the Attributes Inspector for the iOS 7.0 and Later & iOS 8.0 and Later select desired modes Portarit/Landscape that are supported by the app. You can uncheck all boxes in iOS 6.0 and Prior
7. Drag and drop your .png images to the according boxes.
8. Remove LaunchScreen.xib (auto-generated file from react-native init)
9. Select your project and in the General tab set Launch Images Soruce to the LaunchImage
10. Shift + Cmd + K - to clean the project
11. Profit $$$

To make it more beautifull

1. Check Hide status bar in Xcode
2. Set screenBackgroundColor in the navigatorStyle object to match your screen bg
3. Set animationType in the startSingleScreenApp or startTabBasedApp