diff --git a/example/index.tsx b/example/index.tsx
index fd8e4f4..9c1c591 100644
--- a/example/index.tsx
+++ b/example/index.tsx
@@ -5,6 +5,11 @@ import App from './src/App';
import Settings from './src/Settings';
import Splash from './src/Splash';
+Navigation.setDefaultOptions({
+ topBar: {
+ visible: false,
+ },
+});
Navigation.registerComponent('Splash', () => gestureHandlerRootHOC(Splash), () => Splash);
Navigation.registerComponent('Home', () => gestureHandlerRootHOC(App), () => App);
diff --git a/example/ios/Podfile.lock b/example/ios/Podfile.lock
index 913a59e..a8b3393 100644
--- a/example/ios/Podfile.lock
+++ b/example/ios/Podfile.lock
@@ -336,6 +336,8 @@ PODS:
- React-RCTVibration
- ReactCommon/turbomodule/core
- Yoga
+ - RNStaticSafeAreaInsets (2.1.1):
+ - React
- Yoga (1.14.0)
- YogaKit (1.18.1):
- Yoga (~> 1.14)
@@ -391,6 +393,7 @@ DEPENDENCIES:
- ReactNativeNavigation (from `../node_modules/react-native-navigation`)
- RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
- RNReanimated (from `../node_modules/react-native-reanimated`)
+ - RNStaticSafeAreaInsets (from `../node_modules/react-native-static-safe-area-insets`)
- Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
SPEC REPOS:
@@ -467,6 +470,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-gesture-handler"
RNReanimated:
:path: "../node_modules/react-native-reanimated"
+ RNStaticSafeAreaInsets:
+ :path: "../node_modules/react-native-static-safe-area-insets"
Yoga:
:path: "../node_modules/react-native/ReactCommon/yoga"
@@ -511,6 +516,7 @@ SPEC CHECKSUMS:
ReactNativeNavigation: fa1eed29e815dfca6a1cb325776ef97658c54ce3
RNGestureHandler: 5e58135436aacc1c5d29b75547d3d2b9430d052c
RNReanimated: ca4f28c765329144d68bdad126bf6b0b1afc7a5a
+ RNStaticSafeAreaInsets: 6103cf09647fa427186d30f67b0f5163c1ae8252
Yoga: 4bd86afe9883422a7c4028c00e34790f560923d6
YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
diff --git a/example/ios/VisionCameraExample/Info.plist b/example/ios/VisionCameraExample/Info.plist
index 31a06bd..dbb4df3 100644
--- a/example/ios/VisionCameraExample/Info.plist
+++ b/example/ios/VisionCameraExample/Info.plist
@@ -37,8 +37,12 @@
+ NSCameraUsageDescription
+ VisionCamera needs access to your Camera for very obvious reasons.
NSLocationWhenInUseUsageDescription
+ NSMicrophoneUsageDescription
+ VisionCamera needs access to your Microphone to record videos with audio.
UILaunchStoryboardName
LaunchScreen
UIRequiredDeviceCapabilities
@@ -48,13 +52,7 @@
UISupportedInterfaceOrientations
UIInterfaceOrientationPortrait
- UIInterfaceOrientationLandscapeLeft
- UIInterfaceOrientationLandscapeRight
- NSMicrophoneUsageDescription
- VisionCamera needs access to your Microphone to record videos with audio.
- NSCameraUsageDescription
- VisionCamera needs access to your Camera for very obvious reasons.
UIViewControllerBasedStatusBarAppearance
diff --git a/example/package-lock.json b/example/package-lock.json
index 649295a..3af6442 100644
--- a/example/package-lock.json
+++ b/example/package-lock.json
@@ -6222,6 +6222,11 @@
}
}
},
+ "react-native-static-safe-area-insets": {
+ "version": "2.1.1",
+ "resolved": "https://registry.npmjs.org/react-native-static-safe-area-insets/-/react-native-static-safe-area-insets-2.1.1.tgz",
+ "integrity": "sha512-NUSRNZp+0IJOuLeoHoU4kw/cY9g7ozUo2ApCbJAiPyYbkbv49S8gdAcZRkeR0nqwzFDA07sCZCbPI03iEV0RTQ=="
+ },
"react-refresh": {
"version": "0.4.3",
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz",
diff --git a/example/package.json b/example/package.json
index 1c5166a..e532aec 100644
--- a/example/package.json
+++ b/example/package.json
@@ -13,7 +13,8 @@
"react-native": "0.63.4",
"react-native-gesture-handler": "^1.10.1",
"react-native-navigation": "^7.10.0",
- "react-native-reanimated": "^2.0.0-rc.3"
+ "react-native-reanimated": "^2.0.0-rc.3",
+ "react-native-static-safe-area-insets": "^2.1.1"
},
"devDependencies": {
"@babel/core": "^7.12.10",
diff --git a/example/src/Constants.ts b/example/src/Constants.ts
new file mode 100644
index 0000000..639430b
--- /dev/null
+++ b/example/src/Constants.ts
@@ -0,0 +1,10 @@
+import StaticSafeAreaInsets from "react-native-static-safe-area-insets";
+
+export const CONTENT_SPACING = 15;
+
+export const SAFE_AREA_PADDING = {
+ paddingLeft: StaticSafeAreaInsets.safeAreaInsetsLeft + CONTENT_SPACING,
+ paddingTop: StaticSafeAreaInsets.safeAreaInsetsTop + CONTENT_SPACING,
+ paddingRight: StaticSafeAreaInsets.safeAreaInsetsRight + CONTENT_SPACING,
+ paddingBottom: StaticSafeAreaInsets.safeAreaInsetsBottom + CONTENT_SPACING
+}
diff --git a/example/src/Splash.tsx b/example/src/Splash.tsx
index 76b6826..bbc90b0 100644
--- a/example/src/Splash.tsx
+++ b/example/src/Splash.tsx
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
import { StyleSheet, View, Text, Image } from 'react-native';
import { Camera, CameraPermissionStatus } from 'react-native-vision-camera';
+import { SAFE_AREA_PADDING } from './Constants';
export default function Splash() {
const [
@@ -64,6 +65,7 @@ const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: 'white',
+ ...SAFE_AREA_PADDING
},
box: {
width: 60,
diff --git a/example/tsconfig.json b/example/tsconfig.json
index f2a88e9..78916fc 100644
--- a/example/tsconfig.json
+++ b/example/tsconfig.json
@@ -2,7 +2,7 @@
"compilerOptions": {
"baseUrl": ".",
"paths": {
- "react-native-vision-camera": ["./src/index"]
+ "react-native-vision-camera": ["../src/index"]
},
"allowJs": false,
"allowUnreachableCode": false,