From 0234feb01f06e34ccb9ec40824bf1185e846f3eb Mon Sep 17 00:00:00 2001 From: Marc Rousavy Date: Wed, 22 Sep 2021 14:56:03 +0200 Subject: [PATCH 1/2] Choose more efficient format and Video Stabilization Mode --- src/App.tsx | 29 ++++++++- src/utils/sortFormats.ts | 124 +++++++++++++++++++++++++++++++++++++++ 2 files changed, 151 insertions(+), 2 deletions(-) create mode 100644 src/utils/sortFormats.ts diff --git a/src/App.tsx b/src/App.tsx index ab853de..5008d7a 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -25,6 +25,12 @@ import {TapGestureHandler} from 'react-native-gesture-handler'; import StaticSafeAreaInsets from 'react-native-static-safe-area-insets'; import {AnimatedStatusBar} from './components/AnimatedStatusBar'; import {BlurView} from '@react-native-community/blur'; +import { + getBestVideoStabilizationMode, + logDevice, + logFormat, + sortFormats, +} from './utils/sortFormats'; const IS_IOS = Platform.OS === 'ios'; const BackgroundView = IS_IOS @@ -74,6 +80,20 @@ export function App() { console.log('Camera initialized!'); }, []); + const format = useMemo(() => { + if (device == null) { + return undefined; + } + const formats = sortFormats(device.formats); + return formats[0]; + }, [device]); + const videoStabilizationMode = useMemo(() => { + if (format == null) { + return undefined; + } + return getBestVideoStabilizationMode(format.videoStabilizationModes); + }, [format]); + const isActiveAnimation = useDerivedValue( () => withSpring(isHolding.value ? 0 : 1, { @@ -192,12 +212,15 @@ export function App() { }; }, [isPageActive, isHolding]); + useEffect(() => { + logDevice(device); + logFormat(format); + }, [device, format]); + if (device == null) { return ; } - console.log(`Camera Device: ${device.name}`); - return ( { + let leftScore = 0; + let rightScore = 0; + + const leftBestStabilizationMode = getBestVideoStabilizationMode( + left.videoStabilizationModes, + ); + const rightBestStabilizationMode = getBestVideoStabilizationMode( + right.videoStabilizationModes, + ); + const leftVideoStabilizationScore = getVideoStabilizationModeScore( + leftBestStabilizationMode ?? 'off', + ); + const rightVideoStabilizationScore = getVideoStabilizationModeScore( + rightBestStabilizationMode ?? 'off', + ); + if (rightVideoStabilizationScore > leftVideoStabilizationScore) { + rightScore += 1; + } else if (leftVideoStabilizationScore > rightVideoStabilizationScore) { + leftScore += 1; + } + + const leftPixels = left.videoWidth * left.videoHeight; + const rightPixels = right.videoWidth * right.videoHeight; + if (rightPixels > leftPixels) { + rightScore += 1; + } else if (leftPixels > rightPixels) { + rightScore += 1; + } + + return leftScore - rightScore; + }); + return formats; +} + +export function logDevice(device: CameraDevice | undefined) { + if (device == null) { + console.log('No Camera Device!'); + } else { + console.log(`Camera Device: ${device.name} (${device.id})`); + } +} + +export function logFormat(format: CameraDeviceFormat | undefined) { + if (format == null) { + console.log('No Camera Format!'); + } else { + const resolution = `${format.videoWidth}x${format.videoHeight}`; + const videoStabilizationMode = getBestVideoStabilizationMode( + format.videoStabilizationModes, + ); + const minFpsSorted = format.frameRateRanges.sort( + (left, right) => left.minFrameRate - right.minFrameRate, + ); + const minFps = minFpsSorted[0]; + const maxFpsSorted = format.frameRateRanges.sort( + (left, right) => left.maxFrameRate - right.maxFrameRate, + ); + const maxFps = maxFpsSorted[maxFpsSorted.length - 1]; + const colorSpaces = format.colorSpaces.join(', '); + + console.log( + `Device Format: ${resolution} (` + + `Video Stabilization: ${videoStabilizationMode} | ` + + `Color Spaces: ${colorSpaces} | ` + + `FPS: ${minFps} FPS - ${maxFps} FPS | ` + + `ISO: ${format.minISO} - ${format.maxISO} | ` + + `Supports Video HDR: ${format.supportsVideoHDR})`, + ); + } +} From 992fc22ba3f44e1c6a7c85e0d159885de8d16433 Mon Sep 17 00:00:00 2001 From: Marc Rousavy Date: Wed, 22 Sep 2021 15:04:01 +0200 Subject: [PATCH 2/2] Fix Pixel sorting --- src/utils/sortFormats.ts | 21 ++++++++++++--------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/src/utils/sortFormats.ts b/src/utils/sortFormats.ts index 7f410eb..a7d1fd5 100644 --- a/src/utils/sortFormats.ts +++ b/src/utils/sortFormats.ts @@ -1,3 +1,4 @@ +import {Dimensions, PixelRatio} from 'react-native'; import type { CameraDevice, CameraDeviceFormat, @@ -40,6 +41,8 @@ function getVideoStabilizationModeScore( } } +const SCREEN_HEIGHT = Dimensions.get('window').height * PixelRatio.get(); + /** * Custom Format sorter function. Copies the array instead of sorting in-place. * @@ -73,15 +76,15 @@ export function sortFormats( leftScore += 1; } - const leftPixels = left.videoWidth * left.videoHeight; - const rightPixels = right.videoWidth * right.videoHeight; - if (rightPixels > leftPixels) { - rightScore += 1; - } else if (leftPixels > rightPixels) { + const leftPixelsDiff = SCREEN_HEIGHT - left.videoWidth; + const rightPixelsDiff = SCREEN_HEIGHT - right.videoWidth; + if (rightPixelsDiff < leftPixelsDiff) { rightScore += 1; + } else if (leftPixelsDiff < rightPixelsDiff) { + leftScore += 1; } - return leftScore - rightScore; + return rightScore - leftScore; }); return formats; } @@ -105,12 +108,12 @@ export function logFormat(format: CameraDeviceFormat | undefined) { const minFpsSorted = format.frameRateRanges.sort( (left, right) => left.minFrameRate - right.minFrameRate, ); - const minFps = minFpsSorted[0]; + const minFps = minFpsSorted[0]?.minFrameRate ?? 0; const maxFpsSorted = format.frameRateRanges.sort( (left, right) => left.maxFrameRate - right.maxFrameRate, ); - const maxFps = maxFpsSorted[maxFpsSorted.length - 1]; - const colorSpaces = format.colorSpaces.join(', '); + const maxFps = maxFpsSorted[maxFpsSorted.length - 1]?.maxFrameRate ?? 0; + const colorSpaces = `[${format.colorSpaces.join(', ')}]`; console.log( `Device Format: ${resolution} (` +