Add static safe area insets
This commit is contained in:
parent
5ba1df8c08
commit
e1d041644a
@ -5,6 +5,11 @@ import App from './src/App';
|
|||||||
import Settings from './src/Settings';
|
import Settings from './src/Settings';
|
||||||
import Splash from './src/Splash';
|
import Splash from './src/Splash';
|
||||||
|
|
||||||
|
Navigation.setDefaultOptions({
|
||||||
|
topBar: {
|
||||||
|
visible: false,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
Navigation.registerComponent('Splash', () => gestureHandlerRootHOC(Splash), () => Splash);
|
Navigation.registerComponent('Splash', () => gestureHandlerRootHOC(Splash), () => Splash);
|
||||||
Navigation.registerComponent('Home', () => gestureHandlerRootHOC(App), () => App);
|
Navigation.registerComponent('Home', () => gestureHandlerRootHOC(App), () => App);
|
||||||
|
@ -336,6 +336,8 @@ PODS:
|
|||||||
- React-RCTVibration
|
- React-RCTVibration
|
||||||
- ReactCommon/turbomodule/core
|
- ReactCommon/turbomodule/core
|
||||||
- Yoga
|
- Yoga
|
||||||
|
- RNStaticSafeAreaInsets (2.1.1):
|
||||||
|
- React
|
||||||
- Yoga (1.14.0)
|
- Yoga (1.14.0)
|
||||||
- YogaKit (1.18.1):
|
- YogaKit (1.18.1):
|
||||||
- Yoga (~> 1.14)
|
- Yoga (~> 1.14)
|
||||||
@ -391,6 +393,7 @@ DEPENDENCIES:
|
|||||||
- ReactNativeNavigation (from `../node_modules/react-native-navigation`)
|
- ReactNativeNavigation (from `../node_modules/react-native-navigation`)
|
||||||
- RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
|
- RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
|
||||||
- RNReanimated (from `../node_modules/react-native-reanimated`)
|
- 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`)
|
- Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
|
||||||
|
|
||||||
SPEC REPOS:
|
SPEC REPOS:
|
||||||
@ -467,6 +470,8 @@ EXTERNAL SOURCES:
|
|||||||
:path: "../node_modules/react-native-gesture-handler"
|
:path: "../node_modules/react-native-gesture-handler"
|
||||||
RNReanimated:
|
RNReanimated:
|
||||||
:path: "../node_modules/react-native-reanimated"
|
:path: "../node_modules/react-native-reanimated"
|
||||||
|
RNStaticSafeAreaInsets:
|
||||||
|
:path: "../node_modules/react-native-static-safe-area-insets"
|
||||||
Yoga:
|
Yoga:
|
||||||
:path: "../node_modules/react-native/ReactCommon/yoga"
|
:path: "../node_modules/react-native/ReactCommon/yoga"
|
||||||
|
|
||||||
@ -511,6 +516,7 @@ SPEC CHECKSUMS:
|
|||||||
ReactNativeNavigation: fa1eed29e815dfca6a1cb325776ef97658c54ce3
|
ReactNativeNavigation: fa1eed29e815dfca6a1cb325776ef97658c54ce3
|
||||||
RNGestureHandler: 5e58135436aacc1c5d29b75547d3d2b9430d052c
|
RNGestureHandler: 5e58135436aacc1c5d29b75547d3d2b9430d052c
|
||||||
RNReanimated: ca4f28c765329144d68bdad126bf6b0b1afc7a5a
|
RNReanimated: ca4f28c765329144d68bdad126bf6b0b1afc7a5a
|
||||||
|
RNStaticSafeAreaInsets: 6103cf09647fa427186d30f67b0f5163c1ae8252
|
||||||
Yoga: 4bd86afe9883422a7c4028c00e34790f560923d6
|
Yoga: 4bd86afe9883422a7c4028c00e34790f560923d6
|
||||||
YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
|
YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
|
||||||
|
|
||||||
|
@ -37,8 +37,12 @@
|
|||||||
</dict>
|
</dict>
|
||||||
</dict>
|
</dict>
|
||||||
</dict>
|
</dict>
|
||||||
|
<key>NSCameraUsageDescription</key>
|
||||||
|
<string>VisionCamera needs access to your Camera for very obvious reasons.</string>
|
||||||
<key>NSLocationWhenInUseUsageDescription</key>
|
<key>NSLocationWhenInUseUsageDescription</key>
|
||||||
<string></string>
|
<string></string>
|
||||||
|
<key>NSMicrophoneUsageDescription</key>
|
||||||
|
<string>VisionCamera needs access to your Microphone to record videos with audio.</string>
|
||||||
<key>UILaunchStoryboardName</key>
|
<key>UILaunchStoryboardName</key>
|
||||||
<string>LaunchScreen</string>
|
<string>LaunchScreen</string>
|
||||||
<key>UIRequiredDeviceCapabilities</key>
|
<key>UIRequiredDeviceCapabilities</key>
|
||||||
@ -48,13 +52,7 @@
|
|||||||
<key>UISupportedInterfaceOrientations</key>
|
<key>UISupportedInterfaceOrientations</key>
|
||||||
<array>
|
<array>
|
||||||
<string>UIInterfaceOrientationPortrait</string>
|
<string>UIInterfaceOrientationPortrait</string>
|
||||||
<string>UIInterfaceOrientationLandscapeLeft</string>
|
|
||||||
<string>UIInterfaceOrientationLandscapeRight</string>
|
|
||||||
</array>
|
</array>
|
||||||
<key>NSMicrophoneUsageDescription</key>
|
|
||||||
<string>VisionCamera needs access to your Microphone to record videos with audio.</string>
|
|
||||||
<key>NSCameraUsageDescription</key>
|
|
||||||
<string>VisionCamera needs access to your Camera for very obvious reasons.</string>
|
|
||||||
<key>UIViewControllerBasedStatusBarAppearance</key>
|
<key>UIViewControllerBasedStatusBarAppearance</key>
|
||||||
<false/>
|
<false/>
|
||||||
</dict>
|
</dict>
|
||||||
|
5
example/package-lock.json
generated
5
example/package-lock.json
generated
@ -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": {
|
"react-refresh": {
|
||||||
"version": "0.4.3",
|
"version": "0.4.3",
|
||||||
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz",
|
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.4.3.tgz",
|
||||||
|
@ -13,7 +13,8 @@
|
|||||||
"react-native": "0.63.4",
|
"react-native": "0.63.4",
|
||||||
"react-native-gesture-handler": "^1.10.1",
|
"react-native-gesture-handler": "^1.10.1",
|
||||||
"react-native-navigation": "^7.10.0",
|
"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": {
|
"devDependencies": {
|
||||||
"@babel/core": "^7.12.10",
|
"@babel/core": "^7.12.10",
|
||||||
|
10
example/src/Constants.ts
Normal file
10
example/src/Constants.ts
Normal file
@ -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
|
||||||
|
}
|
@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
|
|||||||
|
|
||||||
import { StyleSheet, View, Text, Image } from 'react-native';
|
import { StyleSheet, View, Text, Image } from 'react-native';
|
||||||
import { Camera, CameraPermissionStatus } from 'react-native-vision-camera';
|
import { Camera, CameraPermissionStatus } from 'react-native-vision-camera';
|
||||||
|
import { SAFE_AREA_PADDING } from './Constants';
|
||||||
|
|
||||||
export default function Splash() {
|
export default function Splash() {
|
||||||
const [
|
const [
|
||||||
@ -64,6 +65,7 @@ const styles = StyleSheet.create({
|
|||||||
container: {
|
container: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
backgroundColor: 'white',
|
backgroundColor: 'white',
|
||||||
|
...SAFE_AREA_PADDING
|
||||||
},
|
},
|
||||||
box: {
|
box: {
|
||||||
width: 60,
|
width: 60,
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"baseUrl": ".",
|
"baseUrl": ".",
|
||||||
"paths": {
|
"paths": {
|
||||||
"react-native-vision-camera": ["./src/index"]
|
"react-native-vision-camera": ["../src/index"]
|
||||||
},
|
},
|
||||||
"allowJs": false,
|
"allowJs": false,
|
||||||
"allowUnreachableCode": false,
|
"allowUnreachableCode": false,
|
||||||
|
Loading…
Reference in New Issue
Block a user