In react native there are a popular NPM plugin known as react-native-safe-area-context which handles Safe Area in both android and iOS devices. The Safe Area context manages all the Safe Area in all devices like notch devices, drop notch devices etc. SafeAreaProvider is a component which automatically adds padding to the notch area without affecting the application screen. Sometimes when we install the react navigation then it is essential to install the react-native-safe-area-context plugin to works well in all devices. So in this tutorila we would learn about a most common error RNCSafeAreaView was not found in the UIManager React Native iOS Error Solution.
Screenshot of Error :-
Error Message:
Component Exception, requireNativeComponent : “RNCSafeAreaProvider was not found in the UIManager”
Contents in this project RNCSafeAreaView was not found in the UIManager React Native iOS Error Solution:
1. To solve this error first we have to install react-native-safe-area-context NPM plugin. So open your react native project Root director in Command Prompt or Terminal and execute below command to install Safe Area.
1
|
npm install react–native–safe–area–context
|
Screenshot of Terminal:
Screenshot of Terminal after done installation:
2. After done installation we have to execute
npx pod–install ios command to link all the newly installed libraries in react native iOS project.
Screenshot:
Screenshot after done installation of POD:
3. Here you go guys. Now simply see the below code of example to import the Safe Area in your code and how to use it.
1
2
3
4
5
|
import { SafeAreaProvider } from ‘react-native-safe-area-context’;
function App() {
return <SafeAreaProvider>...</SafeAreaProvider>;
}
|
Thanks for reading our tutorial, If you like our tutorial then please write us a comment in comment section .