How to support Split View in React Native

Question

I want to write an app that would run side by side with a drawing app to display images for daily drawing practices, so split view is an essential feature of the app I want to build.

I thought I might be able to use react-native and was able to quickly copy some example code to display an images and change the app type to iPad Pro, but I am not able to use split screen with the app. I can slide out another app from the right of the screen and but it will not lock in split view mode.

I found the following ios documentation on implementing split view which seems to imply that it should work by default unless you explicilty opt out by setting UIRequiresFullScreen YES. I checked the Info.plist and this is not set so I'm not really sure why it doesn't work.

I have no experience with iOS development or react-native (few hours) and I'm guessing maybe additional steps may be needed for auto layout and size change events. I thought maybe I would be able to find an example where split view works but after trying several layout examples on rnplay.org nothing seems to support split view.

Is this possible in react-native or maybe a current limitation? I'm just trying to get a better idea of the scope of the solution and if I'm going to need to learn objective c to solve this or if I just need to add a few properties or events somewhere to make it work. Does anyone know of any examples where split view works? or what steps might be required?

Answer 1

The reason it didn't work for me is that I changed the simulator to iPad but not the deployment info.

You need to change this to iPad (or perhaps universal with appropriate iPad config) and you must support all four orientations. Then it should work: