When I run app on ios mobile simulator it works perfectly. But the problem is when i run app on iPad pro the content didn't show properly it seems like mobile ui. There are space areas in the left and Righ sides. I didn't get the actual problem.

Xcode version-14.0.1 and iPad version-- iPad pro 5 generations (12.9 inch display).

code example:

import {StyleSheet, Text, View} from 'react-native';
import React from 'react';

const App = () => {
  return (
    <View>
      <Text>App</Text>
    </View>
  );
};

export default App;

const styles = StyleSheet.create({});

Please Check the attached file, And suggest to me to solve this issue that how can make full screen in react native!

Note: I try to solve it by changing the Targeted Device Families to iPhone, iPad because there is no universal option in mentioned Xcode given in the attached file.

CodePudding user response：

To solve this issues in Xcode version: 14.0.1, follow the below instructions as given,

1. Make sure selected iPhone, iPad from Build Settings / Targeted Device Families of Xcode as given attached file,
2. In Supported Destination, need to add both iPhone and iPad as given in the attached file,
3. Delete the previous app from the simulator
4. Delete all of the files from ...../Library/Developer/Xcode/DerivedData
5. Then Clean the Build Folder from Xcode(Product->Clean Build Folder)

Then Run the app using mentioned commands,

• Start Metro: npm start
• Run the App: npx react-native run-ios

And All is Done!!!