diff --git a/example/index.tsx b/example/index.tsx index f4c507e..823a9f4 100644 --- a/example/index.tsx +++ b/example/index.tsx @@ -5,11 +5,19 @@ import { App } from './src/App'; import { Settings } from './src/Settings'; import { Splash } from './src/Splash'; import { Media } from './src/Media'; +import { Camera } from 'react-native-vision-camera'; Navigation.setDefaultOptions({ topBar: { visible: false, }, + window: { + backgroundColor: 'black', + }, + layout: { + backgroundColor: 'black', + componentBackgroundColor: 'black' + }, }); Navigation.registerComponent('Splash', () => gestureHandlerRootHOC(Splash), () => Splash); @@ -17,18 +25,27 @@ Navigation.registerComponent('Home', () => gestureHandlerRootHOC(App), () => App Navigation.registerComponent('Media', () => gestureHandlerRootHOC(Media), () => Media); Navigation.registerComponent('Settings', () => gestureHandlerRootHOC(Settings), () => Settings); -Navigation.events().registerAppLaunchedListener(() => { - Navigation.setRoot({ - root: { - stack: { - children: [ - { - component: { - name: 'Splash' - } - } - ] - } - } +Navigation.events().registerAppLaunchedListener(async () => { + const [cameraPermission, microphonePermission] = await Promise.all([ + Camera.getCameraPermissionStatus(), + Camera.getMicrophonePermissionStatus(), + ]); + let rootName = "Splash"; + if (cameraPermission === "authorized" && microphonePermission === "authorized") { + rootName = "Home"; + } + + Navigation.setRoot({ + root: { + stack: { + children: [ + { + component: { + name: rootName + } + } + ] + } + } }); }); diff --git a/example/ios/VisionCameraExample/Images.xcassets/Contents.json b/example/ios/VisionCameraExample/Images.xcassets/Contents.json index 2d92bd5..73c0059 100644 --- a/example/ios/VisionCameraExample/Images.xcassets/Contents.json +++ b/example/ios/VisionCameraExample/Images.xcassets/Contents.json @@ -1,6 +1,6 @@ { "info" : { - "version" : 1, - "author" : "xcode" + "author" : "xcode", + "version" : 1 } } diff --git a/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/Contents.json b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/Contents.json new file mode 100644 index 0000000..1ccfa79 --- /dev/null +++ b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/Contents.json @@ -0,0 +1,23 @@ +{ + "images" : [ + { + "filename" : "IMG_7966.jpg", + "idiom" : "universal", + "scale" : "1x" + }, + { + "filename" : "IMG_7966-1.jpg", + "idiom" : "universal", + "scale" : "2x" + }, + { + "filename" : "IMG_7966-2.jpg", + "idiom" : "universal", + "scale" : "3x" + } + ], + "info" : { + "author" : "xcode", + "version" : 1 + } +} diff --git a/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966-1.jpg b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966-1.jpg new file mode 100644 index 0000000..95609da Binary files /dev/null and b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966-1.jpg differ diff --git a/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966-2.jpg b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966-2.jpg new file mode 100644 index 0000000..95609da Binary files /dev/null and b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966-2.jpg differ diff --git a/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966.jpg b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966.jpg new file mode 100644 index 0000000..95609da Binary files /dev/null and b/example/ios/VisionCameraExample/Images.xcassets/shutter.imageset/IMG_7966.jpg differ diff --git a/example/ios/VisionCameraExample/LaunchScreen.storyboard b/example/ios/VisionCameraExample/LaunchScreen.storyboard index fe917be..249e507 100644 --- a/example/ios/VisionCameraExample/LaunchScreen.storyboard +++ b/example/ios/VisionCameraExample/LaunchScreen.storyboard @@ -1,9 +1,9 @@ - + - + @@ -16,43 +16,28 @@ - - - + + + + + + + - - - - - - - - - - - - + + + + + - + + + + diff --git a/example/src/App.tsx b/example/src/App.tsx index cf2044a..f2c6fd5 100644 --- a/example/src/App.tsx +++ b/example/src/App.tsx @@ -282,7 +282,6 @@ export const App: NavigationFunctionComponent = ({ componentId }) => { style={styles.captureButton} camera={camera} onMediaCaptured={onMediaCaptured} - maximumVideoDuration={15} cameraZoom={zoom} flash={supportsFlash ? flash : "off"} enabled={isCameraInitialized && isActive} diff --git a/example/src/views/CaptureButton.tsx b/example/src/views/CaptureButton.tsx index 17843aa..da19e7b 100644 --- a/example/src/views/CaptureButton.tsx +++ b/example/src/views/CaptureButton.tsx @@ -24,9 +24,10 @@ import { CAPTURE_BUTTON_SIZE, SCREEN_HEIGHT, SCREEN_WIDTH, USE_SNAPSHOT_ON_ANDRO const PAN_GESTURE_HANDLER_FAIL_X = [-SCREEN_WIDTH, SCREEN_WIDTH]; const PAN_GESTURE_HANDLER_ACTIVE_Y = [-2, 2]; -const IS_ANDROID = Platform.OS === "android" +const IS_ANDROID = Platform.OS === "android"; const START_RECORDING_DELAY = 200; +const BORDER_WIDTH = CAPTURE_BUTTON_SIZE * 0.1; interface Props extends ViewProps { camera: React.RefObject; @@ -79,8 +80,8 @@ const _CaptureButton: React.FC = ({ // capture rate at the cost of greatly reduced quality. const photoMethod = USE_SNAPSHOT_ON_ANDROID && - IS_ANDROID && - takePhotoOptions.flash === "off" + IS_ANDROID && + takePhotoOptions.flash === "off" ? "snapshot" : "photo"; console.log(`Taking ${photoMethod}...`); @@ -251,8 +252,8 @@ const _CaptureButton: React.FC = ({ () => ({ transform: [ { - scale: withSpring(isPressingButton.value ? 1.1 : 1, { - mass: 0.5, + scale: withSpring(isPressingButton.value ? 1 : 0, { + mass: 1, damping: 35, stiffness: 300, }), @@ -262,23 +263,29 @@ const _CaptureButton: React.FC = ({ [isPressingButton] ); const buttonStyle = useAnimatedStyle( - () => ({ - opacity: withTiming(enabled ? 1 : 0.3, { - duration: 100, - easing: Easing.linear, - }), - transform: [ - { - scale: withSpring( - enabled ? (isPressingButton.value ? 1 : 0.9) : 0.6, - { - stiffness: 500, - damping: 300, - } - ), - }, - ], - }), + () => { + return ({ + opacity: withTiming(enabled ? 1 : 0.3, { + duration: 100, + easing: Easing.linear, + }), + transform: [ + { + scale: withSpring( + enabled + ? isPressingButton.value + ? 1 + : 0.9 + : 0.6, + { + stiffness: 500, + damping: 300, + } + ), + }, + ], + }) + }, [enabled, isPressingButton] ); @@ -319,14 +326,13 @@ const styles = StyleSheet.create({ width: CAPTURE_BUTTON_SIZE, height: CAPTURE_BUTTON_SIZE, borderRadius: CAPTURE_BUTTON_SIZE / 2, - borderWidth: 3, - borderColor: "rgba(225, 48, 108, 0.7)", + backgroundColor: "#e34077", }, button: { width: CAPTURE_BUTTON_SIZE, height: CAPTURE_BUTTON_SIZE, borderRadius: CAPTURE_BUTTON_SIZE / 2, - borderWidth: CAPTURE_BUTTON_SIZE * 0.1, + borderWidth: BORDER_WIDTH, borderColor: "white", }, });