react-native-vision-camera
react-native-vision-camera copied to clipboard
mrousavy
🐛 On app install `device` is null and `<Camera />` is stuck on the top-left corner!
What's happening?
When app is first installed, firstly, the device returned from useCameraPermission() hook is undefined and upon reload the expo server, the device variable is there however the <Camera /> is stuck on top-left corner of the screen.
1. When app is installed after uninstall
2. When I hit r to reload the expo server, the device in not undefined anymore, but the <Camera /> is stuck on the top-left corner of the screen, no idea why.
Reproduceable Code
import { layout } from '@/styles/common';
import { Button, Dimensions, Image, StyleSheet, Text, View } from 'react-native';
import { useRouter } from 'expo-router';
import { useRef } from 'react';
import { Camera, useCameraDevice, useCameraPermission } from 'react-native-vision-camera';
import Svg, { Mask, Rect } from 'react-native-svg';
const { width } = Dimensions.get('window');
const frameX = (width - (width * 0.9)) / 2;
const frameY = (300 - 300 * 0.9) / 2;
export default function Scan() {
const router = useRouter();
const { hasPermission, requestPermission } = useCameraPermission()
const cameraRef = useRef<Camera>(null);
const device = useCameraDevice('back');
console.log(JSON.stringify(device, (k, v) => k === "formats" ? [] : v, 2))
return (
<View style={layout.fill}>
<View style={styles.darkContainer}>
<View style={styles.instructionContainer}>
<Text style={styles.cameraScanText}>Camera scan</Text>
<Text style={styles.instructionText}>Hold your card under camera to scan</Text>
</View>
<View style={styles.cameraContainer}>
{!hasPermission ? (
<View>
<Text style={styles.permissionPromptText}>
We need your permission to show the camera
</Text>
<Button onPress={requestPermission} title="grant permission" />
</View>
) : (
device && (
<View
style={{
flex: 1,
}}
>
<Camera
style={StyleSheet.absoluteFill}
ref={cameraRef}
device={device}
isActive={true}
resizeMode="cover"
photo={true}
/>
{/* Masked Overlay */}
<Svg style={StyleSheet.absoluteFill}>
<Mask id="mask">
{/* This covers the whole screen in white. White in a mask means “keep this part visible.” */}
<Rect
x="0"
y="0"
width={'100%'}
height={'100%'}
fill="white"
/>
{/* This draws a black rounded rectangle in the middle-ish of the screen. Black in a mask means “cut a hole here.” */}
<Rect
x={frameX}
y={frameY}
width={'90%'}
height={'90%'}
rx={10}
ry={10}
fill="black"
/>
</Mask>
<Rect
width={'100%'}
height={'100%'}
fill="#000000C7"
mask="url(#mask)"
/>
</Svg>
</View>
)
)}
</View>
<View style={styles.guidePromptContainer}>
<View
style={{
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
}}
>
<Text style={[styles.bodyText, { color: 'white' }]}>Point on the </Text>
<Text style={[styles.bodyText, { color: '#2E9ECE' }]}>Emirates ID</Text>
</View>
</View>
</View>
</View>
);
}
const styles = StyleSheet.create({
darkContainer: {
backgroundColor: '#000000C7',
flex: 1,
borderRadius: 10,
marginTop: 20,
justifyContent: 'space-evenly',
alignItems: 'center',
},
instructionContainer: {
justifyContent: 'center',
alignItems: 'center',
flex: 1,
},
cameraScanText: {
// fontFamily: fonts.montserratSemiBold,
fontSize: 20,
color: '#2BABA1',
marginTop: 20,
},
instructionText: {
// ...typography.body,
color: 'white',
},
permissionPromptText: {
// ...typography.body,
color: 'white',
marginBottom: 10,
},
bodyText: {
// ...typography.body,
},
flashPromptContainer: {
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
},
camera: {
flex: 1,
},
guidePromptContainer: {
justifyContent: 'space-between',
paddingVertical: 10,
alignItems: 'center',
flex: 1,
},
cameraContainer: {
height: 290,
width: '100%',
},
});
Relevant log output
vityLetterboxHorizontalPosition= -1 topActivityLetterboxWidth=1344 topActivityLetterboxHeight=2992 isUserFullscreenOverrideEnabled=false isSystemFullscreenOverrideEnabled=false cameraCompatTaskInfo=CameraCompatTaskInfo { cameraCompatControlState=hidden freeformCameraCompatMode=inactive}}}, pipTask = null, remoteTransition = null, displayChange = null, flags = 0, debugId = 83 }
04-15 16:02:53.722 580 602 V WindowManager: startWCT=WindowContainerTransaction { changes = {} hops = [] errorCallbackToken=null taskFragmentOrganizer=null }
04-15 16:02:53.722 827 865 V WindowManagerShell: try handler com.android.wm.shell.transition.DefaultTransitionHandler@97cc283
04-15 16:02:53.722 580 602 V WindowManager: info={id=83 t=OPEN f=0x0 trk=0 opt={t=FROM_STYLE} r=[0@Point(0, 0)] c=[
04-15 16:02:53.722 580 602 V WindowManager: {null m=OPEN f=TRANSLUCENT|FILLS_TASK leash=Surface(name=ActivityRecord{e753835 u0 com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity)/@0x6532509 sb=Rect(0, 0 - 0, 0) eb=Rect(0, 0 - 1344, 2992) d=-1->0 r=-1->0:-1 bc=fff1f0f7 component=com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity}
04-15 16:02:53.722 580 602 V WindowManager: ]}
04-15 16:02:53.722 827 865 V WindowManagerShell: start default transition animation, info = {id=83 t=OPEN f=0x0 trk=0 opt={t=FROM_STYLE} r=[0@Point(0, 0)] c=[{null m=OPEN f=TRANSLUCENT|FILLS_TASK leash=Surface(name=ActivityRecord{e753835 u0 com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity)/@0xde1e470 sb=Rect(0, 0 - 0, 0) eb=Rect(0, 0 - 1344, 2992) d=-1->0 r=-1->0:-1 bc=fff1f0f7 component=com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity}]}
04-15 16:02:53.722 827 865 V WindowManagerShell: loadAnimation: anim=null animAttr=0x4 type=OPEN isEntrance=true
04-15 16:02:53.723 827 865 V WindowManagerShell: Transition animation finished (aborted=false), notifying core (#83) android.os.BinderProxy@13c85ed@0
04-15 16:02:53.724 580 602 V WindowManager: Finish Transition (#83): created at 04-15 16:02:53.527 collect-started=0.062ms request-sent=7.831ms started=8.914ms ready=33.081ms sent=187.147ms finished=196.743ms
04-15 16:02:53.725 827 865 V WindowManagerShell: Track 0 became idle
04-15 16:02:53.725 827 865 V WindowManagerShell: All active transition animations finished
04-15 16:02:53.725 827 865 V WindowManagerShell: animated by com.android.wm.shell.transition.DefaultTransitionHandler@97cc283
04-15 16:02:53.725 827 865 V WindowManagerShell: Track 0 became idle
04-15 16:02:53.725 827 865 V WindowManagerShell: All active transition animations finished
04-15 16:02:53.728 580 926 W UserManagerService: Requested status bar icon for non-badged user 0
04-15 16:02:53.730 580 926 W UserManagerService: Requested status bar icon for non-badged user 0
04-15 16:02:53.737 580 697 I ImeTracker: com.google.android.permissioncontroller:b2b27c03: onRequestHide at ORIGIN_SERVER reason HIDE_ALWAYS_HIDDEN_STATE fromUser false
04-15 16:02:53.737 580 697 I ImeTracker: com.google.android.permissioncontroller:b2b27c03: onCancelled at PHASE_SERVER_SHOULD_HIDE04-15 16:02:53.738 1280 1280 I GoogleInputMethodService: GoogleInputMethodService.onFinishInput():2043
04-15 16:02:53.739 1280 1280 I Module : DeviceLockedStatusModuleProvider$Module.updateDeviceLockedStatus():100 repeatCheckTimes = 0, locked = false
04-15 16:02:53.740 1280 1280 I GoogleInputMethodService: GoogleInputMethodService.onStartInput():1293 onStartInput(EditorInfo{EditorInfo{packageName=com.google.android.permissioncontroller, inputType=0, inputTypeString=NULL, enableLearning=false, autoCorrection=false, autoComplete=false, imeOptions=0, privateImeOptions=null, actionName=UNSPECIFIED, actionLabel=null, initialSelStart=-1, initialSelEnd=-1, initialCapsMode=0, label=null, fieldId=0, fieldName=null, extras=null, hintText=null, hintLocales=[]}}, false)
04-15 16:02:53.740 480 4037 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:53.741 1280 1280 I Module : DeviceLockedStatusModuleProvider$Module.updateDeviceLockedStatus():100 repeatCheckTimes = 1, locked = false
04-15 16:02:53.741 580 1066 W PackageConfigPersister: App-specific configuration not found for packageName: com.google.android.permissioncontroller and userId: 0
04-15 16:02:53.757 827 1010 D EGL_emulation: app_time_stats: avg=24492.71ms min=24492.71ms max=24492.71ms count=1
04-15 16:02:54.469 1246 1246 I GrantPermissionsViewModel: Logged buttons presented and clicked permissionGroupName=android.permission-group.CAMERA uid=10234 selectedPrecision=0 package=com.mgulfam.test presentedButtons=44 clickedButton=4 isPermissionRationaleShown=false sessionId=7062623343049387381 targetSdk=34
04-15 16:02:54.469 420 4228 D audioserver: logFgsApiBegin: FGS Logger Transaction failed, -129
04-15 16:02:54.470 580 598 W AS.PlaybackActivityMon: No piid assigned for invalid/internal port id 15
04-15 16:02:54.471 580 602 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:54.473 827 865 V WindowManagerShell: Transition requested (#84): android.os.BinderProxy@d58d79c TransitionRequestInfo
{ type = CLOSE, triggerTask = null, pipTask = null, remoteTransition = null, displayChange = null, flags = 0, debugId = 84 }
04-15 16:02:54.474 580 602 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:54.478 439 439 I BpBinder: onLastStrongRef automatically unlinking death recipients:
04-15 16:02:54.485 6509 6509 W unknown:BridgelessReact: ReactHost{0}.onHostResume(activity)
04-15 16:02:54.485 6509 6509 W unknown:BridgelessReact: ReactContext.onHostResume()
04-15 16:02:54.485 827 1964 V WindowManagerShell: onTransitionReady(transaction=2491081034950)
04-15 16:02:54.486 580 602 V WindowManager: Sent Transition (#84) createdAt=04-15 16:02:54.473 via request=TransitionRequestInfo { type = CLOSE, triggerTask = null, pipTask = null, remoteTransition = null, displayChange = null, flags = 0, debugId = 84 }
04-15 16:02:54.486 580 602 V WindowManager: startWCT=WindowContainerTransaction { changes = {} hops = [] errorCallbackToken=null taskFragmentOrganizer=null }
04-15 16:02:54.486 580 602 V WindowManager: info={id=84 t=CLOSE f=0x0 trk=0 opt={t=FROM_STYLE} r=[0@Point(0, 0)] c=[
04-15 16:02:54.486 580 602 V WindowManager: {null m=CLOSE f=TRANSLUCENT|FILLS_TASK leash=Surface(name=ActivityRecord{e753835 u0 com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity)/@0x6532509 sb=Rect(0, 0 - 1344, 2992) eb=Rect(0, 0 - 1344, 2992) d=0 bc=fff1f0f7 component=com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity}
04-15 16:02:54.486 580 602 V WindowManager: ]}
04-15 16:02:54.487 827 865 V WindowManagerShell: onTransitionReady (#84) android.os.BinderProxy@d58d79c: {id=84 t=CLOSE f=0x0 trk=0 opt={t=FROM_STYLE} r=[0@Point(0, 0)] c=[{null m=CLOSE f=TRANSLUCENT|FILLS_TASK leash=Surface(name=ActivityRecord{e753835 u0 com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity)/@0xf2d85a5 sb=Rect(0, 0 - 1344, 2992) eb=Rect(0, 0 - 1344, 2992) d=0 bc=fff1f0f7 component=com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity}]}
04-15 16:02:54.488 827 865 V WindowManagerShell: Playing animation for (#84) android.os.BinderProxy@d58d79c@0
04-15 16:02:54.489 827 865 V WindowManagerShell: try handler com.android.wm.shell.transition.DefaultMixedHandler@c0b07e8
04-15 16:02:54.489 827 865 V WindowManagerShell: try handler com.android.wm.shell.keyguard.KeyguardTransitionHandler@28b3e01
04-15 16:02:54.489 827 865 V WindowManagerShell: try handler com.android.wm.shell.pip.PipTransition@7f3e4a6
04-15 16:02:54.490 827 865 V WindowManagerShell: try handler com.android.wm.shell.activityembedding.ActivityEmbeddingController@e71ee7
04-15 16:02:54.490 827 865 V WindowManagerShell: try handler com.android.wm.shell.recents.RecentsTransitionHandler@b7cba94
04-15 16:02:54.490 827 865 V ShellRecents: RecentsTransitionHandler.startAnimation: no controller found
04-15 16:02:54.491 827 865 V WindowManagerShell: try handler com.android.wm.shell.splitscreen.StageCoordinator@76cb93d
04-15 16:02:54.491 827 865 V WindowManagerShell: try handler com.android.wm.shell.transition.RemoteTransitionHandler@be9a532
04-15 16:02:54.491 827 865 V WindowManagerShell: Transition doesn't have explicit remote, search filters for match for {id=84 t=CLOSE f=0x0 trk=0 opt={t=FROM_STYLE} r=[0@Point(0, 0)] c=[{null m=CLOSE f=TRANSLUCENT|FILLS_TASK leash=Surface(name=ActivityRecord{e753835 u0 com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity)/@0xf2d85a5 sb=Rect(0, 0 - 1344, 2992) eb=Rect(0, 0 - 1344, 2992) d=0 bc=fff1f0f7 component=com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity}]}
04-15 16:02:54.491 827 865 V WindowManagerShell: Checking filter Pair{{types=[] flags=0x0] notFlags=0x0 checks=[{atype=undefined
independent=true modes=[OPEN,TO_FRONT] flags=IN_TASK_WITH_EMBEDDED_ACTIVITY mustBeTask=false order=ANY topActivity=ComponentInfo{com.google.android.apps.nexuslauncher/com.google.android.apps.nexuslauncher.NexusLauncherActivity} launchCookie=null},{atype=undefined independent=true modes=[CLOSE,TO_BACK] flags=IN_TASK_WITH_EMBEDDED_ACTIVITY mustBeTask=false order=ANY topActivity=null launchCookie=null}]} RemoteTransition { remoteTransition = android.window.IRemoteTransition$Stub$Proxy@924d91e, appThread = android.app.IApplicationThread$Stub$Proxy@a0bc5ff, debugName = OverlaySwipeBack }}
04-15 16:02:54.491 827 865 V WindowManagerShell: Checking filter Pair{{types=[] flags=0x0] notFlags=0x0 checks=[{atype=dream independent=true modes=[OPEN,TO_FRONT] flags=NONE mustBeTask=false order=ANY topActivity=null launchCookie=null},{atype=home independent=true modes=[CLOSE,TO_BACK] flags=NONE mustBeTask=false order=ANY topActivity=null launchCookie=null}]} RemoteTransition { remoteTransition = android.window.IRemoteTransition$Stub$Proxy@f912fcc, appThread = android.app.IApplicationThread$Stub$Proxy@129b215, debugName =
LauncherToDream }}
04-15 16:02:54.491 827 865 V WindowManagerShell: Checking filter Pair{{types=[] flags=0x0] notFlags=0x100 checks=[{atype=home independent=true modes=[OPEN,TO_FRONT] flags=NONE mustBeTask=false order=TOP topActivity=ComponentInfo{com.google.android.apps.nexuslauncher/com.google.android.apps.nexuslauncher.NexusLauncherActivity} launchCookie=null},{atype=standard independent=true modes=[CLOSE,TO_BACK] flags=NONE mustBeTask=false order=ANY topActivity=null launchCookie=null}]} RemoteTransition { remoteTransition = android.window.IRemoteTransition$Stub$Proxy@441692a, appThread = android.app.IApplicationThread$Stub$Proxy@e60c31b, debugName = QuickstepLaunchHome }}
04-15 16:02:54.491 827 865 V WindowManagerShell: Delegate animation for (#84) to null
04-15 16:02:54.491 827 865 V WindowManagerShell: try handler com.android.wm.shell.transition.DefaultTransitionHandler@97cc283
04-15 16:02:54.491 827 865 V WindowManagerShell: start default transition animation, info = {id=84 t=CLOSE f=0x0 trk=0 opt={t=FROM_STYLE} r=[0@Point(0, 0)] c=[{null m=CLOSE f=TRANSLUCENT|FILLS_TASK leash=Surface(name=ActivityRecord{e753835 u0 com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity)/@0xf2d85a5 sb=Rect(0, 0 - 1344, 2992) eb=Rect(0, 0 - 1344, 2992) d=0 bc=fff1f0f7 component=com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity}]}
04-15 16:02:54.491 827 865 V WindowManagerShell: loadAnimation: anim=null animAttr=0x7 type=CLOSE isEntrance=false
04-15 16:02:54.492 827 865 V WindowManagerShell: Transition animation finished (aborted=false), notifying core (#84) android.os.BinderProxy@d58d79c@0
04-15 16:02:54.495 827 865 V WindowManagerShell: Track 0 became idle
04-15 16:02:54.496 580 602 V WindowManager: Finish Transition (#84): created at 04-15 16:02:54.473 collect-started=0.033ms request-sent=0.081ms started=1.907ms ready=8.062ms sent=11.221ms finished=20.76ms
04-15 16:02:54.496 6509 6547 I ReactNativeJS: undefined
04-15 16:02:54.500 827 865 V WindowManagerShell: All active transition animations finished
04-15 16:02:54.501 420 526 D AudioFlinger: mixer(0x79f52e1e38e0) throttle end: throttle time(36)
04-15 16:02:54.502 580 598 W UserManagerService: Requested status bar icon for non-badged user 0
04-15 16:02:54.504 827 865 V WindowManagerShell: animated by com.android.wm.shell.transition.DefaultTransitionHandler@97cc283
04-15 16:02:54.505 827 865 V WindowManagerShell: Track 0 became idle
04-15 16:02:54.505 827 865 V WindowManagerShell: All active transition animations finished
04-15 16:02:54.505 580 598 W UserManagerService: Requested status bar icon for non-badged user 0
04-15 16:02:54.508 6509 6547 I ReactNativeJS: undefined
04-15 16:02:54.514 6509 6525 D EGL_emulation: app_time_stats: avg=11.87ms min=1.19ms max=167.21ms count=52
04-15 16:02:54.521 580 697 I ImeTracker: com.mgulfam.test:5fe532a4: onRequestHide at ORIGIN_SERVER reason HIDE_UNSPECIFIED_WINDOW
fromUser false
04-15 16:02:54.521 580 697 I ImeTracker: com.mgulfam.test:5fe532a4: onCancelled at PHASE_SERVER_SHOULD_HIDE
04-15 16:02:54.523 1246 1246 D VRI[GrantPermissionsActivity]: visibilityChanged oldVisibility=true newVisibility=false
04-15 16:02:54.525 1246 1246 W WindowOnBackDispatcher: sendCancelIfRunning: isInProgress=false callback=android.view.ViewRootImpl$$ExternalSyntheticLambda11@2290c7e
04-15 16:02:54.525 580 598 D CoreBackPreview: Window{934cf6e u0 com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity}: Setting back callback null
04-15 16:02:54.526 580 598 W InputManager-JNI: Input channel object '934cf6e com.google.android.permissioncontroller/com.android.permissioncontroller.permission.ui.GrantPermissionsActivity (client)' was disposed without first being removed with the input manager!
04-15 16:02:54.527 1280 1280 I GoogleInputMethodService: GoogleInputMethodService.onFinishInput():2043
04-15 16:02:54.534 1280 1280 I Module : DeviceLockedStatusModuleProvider$Module.updateDeviceLockedStatus():100 repeatCheckTimes = 0, locked = false
04-15 16:02:54.535 1280 1280 I GoogleInputMethodService: GoogleInputMethodService.onStartInput():1293 onStartInput(EditorInfo{EditorInfo{packageName=com.mgulfam.test, inputType=0, inputTypeString=NULL, enableLearning=false, autoCorrection=false, autoComplete=false,
imeOptions=0, privateImeOptions=null, actionName=UNSPECIFIED, actionLabel=null, initialSelStart=-1, initialSelEnd=-1, initialCapsMode=0, label=null, fieldId=0, fieldName=null, extras=null, hintText=null, hintLocales=[]}}, false)
04-15 16:02:54.536 1280 1280 I Module : DeviceLockedStatusModuleProvider$Module.updateDeviceLockedStatus():100 repeatCheckTimes = 1, locked = false
04-15 16:02:54.536 580 1066 W PackageConfigPersister: App-specific configuration not found for packageName: com.mgulfam.test and userId: 0
04-15 16:02:54.550 1246 1252 W ssioncontroller: ApkAssets: Deleting an ApkAssets object '<empty> and /data/app/~~1_ReeVQdwtg91iGp-olS3w==/com.mgulfam.test-i8sruyXHJwxhuVUO7LEtmw==/base.apk' with 1 weak references
04-15 16:02:54.704 420 526 D audioserver: logFgsApiEnd: FGS Logger Transaction failed, -129
04-15 16:02:57.573 376 3236 D [email protected]: threadLoop: entering standby, frames: 3888512
04-15 16:02:58.427 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.427 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.427 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.428 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.428 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.429 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.429 1421 1624 I BugleRcsEngine: Connected state: [1], networkType: [WIFI] [CONTEXT thread_id=58 ]
04-15 16:02:58.429 1421 2251 I BugleRcsEngine: handleMessage processing message:[NOTIFY_UPTIME_IGNORE_STATE_CHANGED] with [non-null]:RcsEngineImpl reference [CONTEXT log_prefix="RcsEngineImpl[DUAL_REG]:[5b42d8af-5e50]>Handler" thread_id=64 ]
04-15 16:02:58.429 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.431 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.431 2261 2713 D WM-NetworkStateTracker: Network capabilities changed: [ Transports: WIFI Capabilities: NOT_METERED&INTERNET&NOT_RESTRICTED&TRUSTED&NOT_VPN&VALIDATED&NOT_ROAMING&FOREGROUND&NOT_CONGESTED&NOT_SUSPENDED&NOT_VCN_MANAGED&NOT_BANDWIDTH_CONSTRAINED LinkUpBandwidth>=12000Kbps LinkDnBandwidth>=30000Kbps TransportInfo: <SSID: <unknown ssid>, BSSID: 02:00:00:00:00:00, MAC: 02:00:00:00:00:00, IP: /10.0.2.16, Security type: 0, Supplicant state: COMPLETED, Wi-Fi standard: legacy, RSSI: -50, Link speed: 11Mbps, Tx Link speed: 11Mbps, Max Supported Tx Link speed: 11Mbps, Rx Link speed: 2Mbps, Max Supported Rx Link speed: 11Mbps, Frequency: 2447MHz, Net ID: -1, Metered hint: false, score: 60, isUsable: true, CarrierMerged: false, SubscriptionId: -1, IsPrimary: -1, Trusted: true, Restricted: false, Ephemeral: false, OEM paid: false, OEM private: false, OSU AP: false, FQDN: <none>, Provider friendly name: <none>, Requesting package name: <none><none>MLO Information: , Is TID-To-Link negotiation supported by the AP: false, AP MLD Address: <none>, AP MLO Link Id: <none>, AP MLO Affiliated links: <none>, Vendor Data: <none>> SignalStrength: -50 UnderlyingNetworks: Null]
04-15 16:02:58.431 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.432 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.432 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.433 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.434 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.434 1065 2032 I NullBinder: NullBinder for android.net.action.RECOMMEND_NETWORKS triggering remote TransactionTooLargeException due to Service without Chimera impl
04-15 16:02:58.434 1065 2032 W .gms.persistent: Large reply transaction of 1056768 bytes, interface descriptor , code 1
04-15 16:02:58.435 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:02:58.443 1421 2251 I BugleRcsEngine: No RCS Configuration was found in Bugle for simID: redacted-pii:sim_id[chars:20,last3:897] [CONTEXT log_prefix="ProvisioningEngineDataRetriever" thread_id=64 ]
04-15 16:03:00.019 1385 1631 I AiAiEcho: Predicting[0]: [CONTEXT sampling_count=5 ]
04-15 16:03:00.019 1385 1631 I AiAiEcho: EchoTargets:
04-15 16:03:00.019 1385 1631 I AiAiEcho: Filtered by AiAi flag check:
04-15 16:03:00.019 1385 1631 I AiAiEcho: [CONTEXT ratelimit_period="10 SECONDS" ]
04-15 16:03:00.020 1385 1631 I AiAiEcho: Ranked targets strategy: SORT, count: 0, ranking metadata: [CONTEXT ratelimit_period="10 SECONDS" ]
04-15 16:03:00.020 827 1010 D EGL_emulation: app_time_stats: avg=312.88ms min=8.19ms max=5339.28ms count=20
04-15 16:03:00.020 1385 1631 I AiAiEcho: #remoteViewsTwiddler: feature disabled.
04-15 16:03:00.021 1385 1631 I AiAiEcho: Predicting[0]: [CONTEXT sampling_count=5 ]
04-15 16:03:00.022 1385 1631 I AiAiEcho: EchoTargets:
04-15 16:03:00.022 1385 1631 I AiAiEcho: Filtered by AiAi flag check:
04-15 16:03:00.022 1385 1631 I AiAiEcho: [CONTEXT ratelimit_period="10 SECONDS" ]
04-15 16:03:00.022 1385 1631 I AiAiEcho: Ranked targets strategy: SORT, count: 0, ranking metadata: [CONTEXT ratelimit_period="10 SECONDS" ]
04-15 16:03:00.023 1385 1631 I AiAiEcho: #remoteViewsTwiddler: feature disabled.
04-15 16:03:00.024 1385 1631 I AiAiEcho: #postPredictionTargets: Sending updates to UISurface lockscreen with targets# 0 (types=[])
04-15 16:03:00.024 1385 1631 I AiAiEcho: #postPredictionTargets: Sending updates to UISurface home with targets# 0 (types=[])
04-15 16:03:00.024 827 827 W PageIndicator: Total number of pages invalid: 0. Assuming 1 page.
04-15 16:03:00.026 1131 1131 D SsBaseTemplateCard: No text view can be set up
04-15 16:03:00.026 1131 1131 D SsBaseTemplateCard: Passed-in item info is null
04-15 16:03:00.026 1131 1131 D SsBaseTemplateCard: Passed-in item info is null
04-15 16:03:00.026 1131 1131 D SsBaseTemplateCard: Passed-in item info is null
04-15 16:03:00.026 1131 1131 I SsBaseTemplateCard: Secondary card pane is null
04-15 16:03:01.442 1065 2032 I NullBinder: NullBinder for android.net.action.RECOMMEND_NETWORKS triggering remote TransactionTooLargeException due to Service without Chimera impl
04-15 16:03:01.442 1065 2032 W .gms.persistent: Large reply transaction of 1056768 bytes, interface descriptor , code 1
04-15 16:03:01.443 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.444 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.445 1421 2251 I BugleRcsEngine: handleMessage processing message:[NOTIFY_UPTIME_IGNORE_STATE_CHANGED] with [non-null]:RcsEngineImpl reference [CONTEXT log_prefix="RcsEngineImpl[DUAL_REG]:[5b42d8af-5e50]>Handler" thread_id=64 ]
04-15 16:03:01.446 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.446 1421 1624 I BugleRcsEngine: Connected state: [1], networkType: [WIFI] [CONTEXT thread_id=58 ]
04-15 16:03:01.447 2261 2713 D WM-NetworkStateTracker: Network capabilities changed: [ Transports: WIFI Capabilities: NOT_METERED&INTERNET&NOT_RESTRICTED&TRUSTED&NOT_VPN&VALIDATED&NOT_ROAMING&FOREGROUND&NOT_CONGESTED&NOT_SUSPENDED&NOT_VCN_MANAGED&NOT_BANDWIDTH_CONSTRAINED LinkUpBandwidth>=12000Kbps LinkDnBandwidth>=30000Kbps TransportInfo: <SSID: <unknown ssid>, BSSID: 02:00:00:00:00:00, MAC: 02:00:00:00:00:00, IP: /10.0.2.16, Security type: 0, Supplicant state: COMPLETED, Wi-Fi standard: legacy, RSSI: -50, Link speed: 2Mbps, Tx Link speed: 2Mbps, Max Supported Tx Link speed: 11Mbps, Rx Link speed: 2Mbps, Max Supported Rx Link speed: 11Mbps, Frequency: 2447MHz, Net ID: -1, Metered hint: false, score: 60, isUsable: true, CarrierMerged: false, SubscriptionId: -1, IsPrimary: -1, Trusted: true,
Restricted: false, Ephemeral: false, OEM paid: false, OEM private: false, OSU AP: false, FQDN: <none>, Provider friendly name: <none>, Requesting package name: <none><none>MLO Information: , Is TID-To-Link negotiation supported by the AP: false, AP MLD Address: <none>, AP MLO Link Id: <none>, AP MLO Affiliated links: <none>, Vendor Data: <none>> SignalStrength: -50 UnderlyingNetworks: Null]
04-15 16:03:01.449 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.449 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.450 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.450 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.450 1421 2251 I BugleRcsEngine: No RCS Configuration was found in Bugle for simID: redacted-pii:sim_id[chars:20,last3:897] [CONTEXT log_prefix="ProvisioningEngineDataRetriever" thread_id=64 ]
04-15 16:03:01.451 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.451 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.451 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.451 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.452 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.452 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:01.452 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:03.767 580 679 D ActivityManager: freezing 1818 com.android.vending
04-15 16:03:03.773 580 740 D InetDiagMessage: Destroyed 0 sockets, proto=IPPROTO_TCP, family=AF_INET, states=14
04-15 16:03:03.774 580 740 D InetDiagMessage: Destroyed 0 sockets, proto=IPPROTO_TCP, family=AF_INET6, states=14
04-15 16:03:03.775 580 740 D InetDiagMessage: Destroyed live tcp sockets for uids={10142} in 3ms
04-15 16:03:04.504 580 679 D ActivityManager: freezing 1246 com.google.android.permissioncontroller
04-15 16:03:04.508 580 740 D InetDiagMessage: Destroyed 0 sockets, proto=IPPROTO_TCP, family=AF_INET, states=14
04-15 16:03:04.510 580 740 D InetDiagMessage: Destroyed 0 sockets, proto=IPPROTO_TCP, family=AF_INET6, states=14
04-15 16:03:04.510 580 740 D InetDiagMessage: Destroyed live tcp sockets for uids={10193} in 3ms
04-15 16:03:07.468 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.468 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.469 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.469 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.469 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.470 2261 2713 D WM-NetworkStateTracker: Network capabilities changed: [ Transports: WIFI Capabilities: NOT_METERED&INTERNET&NOT_RESTRICTED&TRUSTED&NOT_VPN&VALIDATED&NOT_ROAMING&FOREGROUND&NOT_CONGESTED&NOT_SUSPENDED&NOT_VCN_MANAGED&NOT_BANDWIDTH_CONSTRAINED LinkUpBandwidth>=12000Kbps LinkDnBandwidth>=30000Kbps TransportInfo: <SSID: <unknown ssid>, BSSID: 02:00:00:00:00:00, MAC: 02:00:00:00:00:00, IP: /10.0.2.16, Security type: 0, Supplicant state: COMPLETED, Wi-Fi standard: legacy, RSSI: -50, Link speed: 5Mbps, Tx Link speed: 5Mbps, Max Supported Tx Link speed: 11Mbps, Rx Link speed: 2Mbps, Max Supported Rx Link speed: 11Mbps, Frequency: 2447MHz, Net ID: -1, Metered hint: false, score: 60, isUsable: true, CarrierMerged: false, SubscriptionId: -1, IsPrimary: -1, Trusted: true,
Restricted: false, Ephemeral: false, OEM paid: false, OEM private: false, OSU AP: false, FQDN: <none>, Provider friendly name: <none>, Requesting package name: <none><none>MLO Information: , Is TID-To-Link negotiation supported by the AP: false, AP MLD Address: <none>, AP MLO Link Id: <none>, AP MLO Affiliated links: <none>, Vendor Data: <none>> SignalStrength: -50 UnderlyingNetworks: Null]
04-15 16:03:07.471 1421 2251 I BugleRcsEngine: handleMessage processing message:[NOTIFY_UPTIME_IGNORE_STATE_CHANGED] with [non-null]:RcsEngineImpl reference [CONTEXT log_prefix="RcsEngineImpl[DUAL_REG]:[5b42d8af-5e50]>Handler" thread_id=64 ]
04-15 16:03:07.471 1065 3338 I NullBinder: NullBinder for android.net.action.RECOMMEND_NETWORKS triggering remote TransactionTooLargeException due to Service without Chimera impl
04-15 16:03:07.471 1065 3338 W .gms.persistent: Large reply transaction of 1056768 bytes, interface descriptor , code 1
04-15 16:03:07.471 1421 1624 I BugleRcsEngine: Connected state: [1], networkType: [WIFI] [CONTEXT thread_id=58 ]
04-15 16:03:07.472 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.472 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.472 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.472 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.472 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.473 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.473 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.473 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.475 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.476 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.476 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:07.478 1421 2251 I BugleRcsEngine: No RCS Configuration was found in Bugle for simID: redacted-pii:sim_id[chars:20,last3:897] [CONTEXT log_prefix="ProvisioningEngineDataRetriever" thread_id=64 ]
04-15 16:03:10.479 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.479 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.480 1065 3338 I NullBinder: NullBinder for android.net.action.RECOMMEND_NETWORKS triggering remote TransactionTooLargeException due to Service without Chimera impl
04-15 16:03:10.480 1065 3338 W .gms.persistent: Large reply transaction of 1056768 bytes, interface descriptor , code 1
04-15 16:03:10.480 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.480 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.480 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.481 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.481 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.482 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.482 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.482 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.482 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.482 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.483 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.484 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.484 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.484 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:10.486 2261 2713 D WM-NetworkStateTracker: Network capabilities changed: [ Transports: WIFI Capabilities: NOT_METERED&INTERNET&NOT_RESTRICTED&TRUSTED&NOT_VPN&VALIDATED&NOT_ROAMING&FOREGROUND&NOT_CONGESTED&NOT_SUSPENDED&NOT_VCN_MANAGED&NOT_BANDWIDTH_CONSTRAINED LinkUpBandwidth>=12000Kbps LinkDnBandwidth>=30000Kbps TransportInfo: <SSID: <unknown ssid>, BSSID: 02:00:00:00:00:00, MAC: 02:00:00:00:00:00, IP: /10.0.2.16, Security type: 0, Supplicant state: COMPLETED, Wi-Fi standard: legacy, RSSI: -50, Link speed: 1Mbps, Tx Link speed: 1Mbps, Max Supported Tx Link speed: 11Mbps, Rx Link speed: 2Mbps, Max Supported Rx Link speed: 11Mbps, Frequency: 2447MHz, Net ID: -1, Metered hint: false, score: 60, isUsable: true, CarrierMerged: false, SubscriptionId: -1, IsPrimary: -1, Trusted: true,
Restricted: false, Ephemeral: false, OEM paid: false, OEM private: false, OSU AP: false, FQDN: <none>, Provider friendly name: <none>, Requesting package name: <none><none>MLO Information: , Is TID-To-Link negotiation supported by the AP: false, AP MLD Address: <none>, AP MLO Link Id: <none>, AP MLO Affiliated links: <none>, Vendor Data: <none>> SignalStrength: -50 UnderlyingNetworks: Null]
04-15 16:03:10.486 1421 2251 I BugleRcsEngine: handleMessage processing message:[NOTIFY_UPTIME_IGNORE_STATE_CHANGED] with [non-null]:RcsEngineImpl reference [CONTEXT log_prefix="RcsEngineImpl[DUAL_REG]:[5b42d8af-5e50]>Handler" thread_id=64 ]
04-15 16:03:10.486 1421 1624 I BugleRcsEngine: Connected state: [1], networkType: [WIFI] [CONTEXT thread_id=58 ]
04-15 16:03:10.491 1421 2251 I BugleRcsEngine: No RCS Configuration was found in Bugle for simID: redacted-pii:sim_id[chars:20,last3:897] [CONTEXT log_prefix="ProvisioningEngineDataRetriever" thread_id=64 ]
04-15 16:03:13.598 1400 1684 I baur : (REDACTED) getHotwordActive::active query: %s, watch: %s, devices connected: %s
04-15 16:03:16.497 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.497 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.498 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.499 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.501 1421 1624 I BugleRcsEngine: Connected state: [1], networkType: [WIFI] [CONTEXT thread_id=58 ]
04-15 16:03:16.501 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.501 1421 2251 I BugleRcsEngine: handleMessage processing message:[NOTIFY_UPTIME_IGNORE_STATE_CHANGED] with [non-null]:RcsEngineImpl reference [CONTEXT log_prefix="RcsEngineImpl[DUAL_REG]:[5b42d8af-5e50]>Handler" thread_id=64 ]
04-15 16:03:16.502 2261 2713 D WM-NetworkStateTracker: Network capabilities changed: [ Transports: WIFI Capabilities: NOT_METERED&INTERNET&NOT_RESTRICTED&TRUSTED&NOT_VPN&VALIDATED&NOT_ROAMING&FOREGROUND&NOT_CONGESTED&NOT_SUSPENDED&NOT_VCN_MANAGED&NOT_BANDWIDTH_CONSTRAINED LinkUpBandwidth>=12000Kbps LinkDnBandwidth>=30000Kbps TransportInfo: <SSID: <unknown ssid>, BSSID: 02:00:00:00:00:00, MAC: 02:00:00:00:00:00, IP: /10.0.2.16, Security type: 0, Supplicant state: COMPLETED, Wi-Fi standard: legacy, RSSI: -50, Link speed: 2Mbps, Tx Link speed: 2Mbps, Max Supported Tx Link speed: 11Mbps, Rx Link speed: 2Mbps, Max Supported Rx Link speed: 11Mbps, Frequency: 2447MHz, Net ID: -1, Metered hint: false, score: 60, isUsable: true, CarrierMerged: false, SubscriptionId: -1, IsPrimary: -1, Trusted: true,
Restricted: false, Ephemeral: false, OEM paid: false, OEM private: false, OSU AP: false, FQDN: <none>, Provider friendly name: <none>, Requesting package name: <none><none>MLO Information: , Is TID-To-Link negotiation supported by the AP: false, AP MLD Address: <none>, AP MLO Link Id: <none>, AP MLO Affiliated links: <none>, Vendor Data: <none>> SignalStrength: -50 UnderlyingNetworks: Null]
04-15 16:03:16.503 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.503 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.503 1065 3337 I NullBinder: NullBinder for android.net.action.RECOMMEND_NETWORKS triggering remote TransactionTooLargeException due to Service without Chimera impl
04-15 16:03:16.503 1065 3337 W .gms.persistent: Large reply transaction of 1056768 bytes, interface descriptor , code 1
04-15 16:03:16.507 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.508 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.508 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.509 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.509 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.510 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.510 1421 2251 I BugleRcsEngine: No RCS Configuration was found in Bugle for simID: redacted-pii:sim_id[chars:20,last3:897] [CONTEXT log_prefix="ProvisioningEngineDataRetriever" thread_id=64 ]
04-15 16:03:16.510 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.511 580 740 W IPCThreadState: Sending oneway calls to frozen process.
04-15 16:03:16.511 580 740 W IPCThreadState: Sending oneway calls to frozen process.
Camera Device
undefined when app is first installed, when I restart the expo server by pressing r, everything seems normal, except the <Camera /> is stick on top-left corner of the screen
{
"formats": [],
"sensorOrientation": "landscape-left",
"hardwareLevel": "limited",
"maxZoom": 1,
"minZoom": 1,
"maxExposure": 6,
"supportsLowLightBoost": false,
"neutralZoom": 1,
"physicalDevices": [
"ultra-wide-angle-camera"
],
"supportsFocus": true,
"supportsRawCapture": false,
"isMultiCam": false,
"minFocusDistance": 0,
"minExposure": -6,
"name": "10 (BACK) androidx.camera.camera2",
"hasFlash": false,
"hasTorch": false,
"position": "back",
"id": "10"
}
Device
Android Pixel Emulator
VisionCamera Version
4.6.4
Can you reproduce this issue in the VisionCamera Example app?
Yes, I can reproduce the same issue in the Example app here
Additional information
- [x] I am using Expo
- [ ] I have enabled Frame Processors (react-native-worklets-core)
- [x] I have read the Troubleshooting Guide
- [x] I agree to follow this project's Code of Conduct
- [x] I searched for similar issues in this repository and found none.
@mgulfam0722 Do you have any temp solution while wait this bug to be fixed ? I have same issue
Yes, so for the <Camera /> UI fix is to set overflow: 'hidden' in the parent view of <Camera /> component and use a physical device for null device error. The device null error only seems to be present in android emulators not physical device.
Let me know if you need any help.
Cheers.
@ngxhuyhoang just in-case, below is my updated code which solves the UI issue of the <Camera /> component.
import { layout } from '@/styles/common';
import { Button, Dimensions, StyleSheet, Text, View } from 'react-native';
import { useRouter } from 'expo-router';
import { useRef } from 'react';
import { Camera, useCameraDevice, useCameraPermission } from 'react-native-vision-camera';
import Svg, { Mask, Rect } from 'react-native-svg';
const { width } = Dimensions.get('window');
const frameX = (width - (width * 0.9)) / 2;
const frameY = (300 - 300 * 0.9) / 2;
export default function Scan() {
const router = useRouter();
const { hasPermission, requestPermission } = useCameraPermission()
const cameraRef = useRef<Camera>(null);
const device = useCameraDevice('back');
console.log(JSON.stringify(device, (k, v) => k === "formats" ? [] : v, 2))
return (
<View style={layout.fill}>
<View style={styles.darkContainer}>
<View style={styles.instructionContainer}>
<Text style={styles.cameraScanText}>Camera scan</Text>
<Text style={styles.instructionText}>Hold your card under camera to scan</Text>
</View>
<View style={styles.cameraContainer}>
{!hasPermission ? (
<View>
<Text style={styles.permissionPromptText}>
We need your permission to show the camera
</Text>
<Button onPress={requestPermission} title="grant permission" />
</View>
) : (
device && (
<View
style={{
flex: 1,
overflow: 'hidden'
}}
>
<Camera
style={StyleSheet.absoluteFill}
ref={cameraRef}
device={device}
isActive={true}
resizeMode="cover"
photo={true}
/>
{/* Masked Overlay */}
<Svg style={StyleSheet.absoluteFill}>
<Mask id="mask">
{/* This covers the whole screen in white. White in a mask means “keep this part visible.” */}
<Rect
x="0"
y="0"
width={'100%'}
height={'100%'}
fill="white"
/>
{/* This draws a black rounded rectangle in the middle-ish of the screen. Black in a mask means “cut a hole here.” */}
<Rect
x={frameX}
y={frameY}
width={'90%'}
height={'90%'}
rx={10}
ry={10}
fill="black"
/>
</Mask>
<Rect
width={'100%'}
height={'100%'}
fill="#000000C7"
mask="url(#mask)"
/>
</Svg>
</View>
)
)}
</View>
<View style={styles.guidePromptContainer}>
<View
style={{
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
}}
>
<Text style={[styles.bodyText, { color: 'white' }]}>Point on the </Text>
<Text style={[styles.bodyText, { color: '#2E9ECE' }]}>Emirates ID</Text>
</View>
</View>
</View>
</View>
);
}
const styles = StyleSheet.create({
darkContainer: {
backgroundColor: '#000000C7',
flex: 1,
borderRadius: 10,
marginTop: 20,
justifyContent: 'space-evenly',
alignItems: 'center',
},
instructionContainer: {
justifyContent: 'center',
alignItems: 'center',
flex: 1,
},
cameraScanText: {
fontSize: 20,
color: '#2BABA1',
marginTop: 20,
},
instructionText: {
color: 'white',
},
permissionPromptText: {
color: 'white',
marginBottom: 10,
},
bodyText: {
},
flashPromptContainer: {
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
},
camera: {
flex: 1,
},
guidePromptContainer: {
justifyContent: 'space-between',
paddingVertical: 10,
alignItems: 'center',
flex: 1,
},
cameraContainer: {
height: 290,
width: '100%',
},
});
I am experiencing the same issue on a real device (Google Pixel 5, with the latest OS). The camera view simply ignores the Y position of the parent container. It also ignores "top" when I try to set its style as position: "absolute", top: 300.
The fix I applied was to use the following styles:
<View style={{width: "100%", height: cameraViewHeight}}>
<View style={{flex: 1, overflow: 'hidden', width: cameraViewWidth}}>
<Camera ... style = {StyleSheet.absoluteFill} />
</View>
</View>
I.e., compared to the solution given above, I also had to set a specific width of the Camera's closest parent container
Duplicate of https://github.com/mrousavy/react-native-vision-camera/issues/3237
