Determining Camera Texture - react-native

Question

Been stuck a while trying to figure an issue out for android devices. The sample code from the tensorFlow.js library says that the resolution of the camera has to be determined empirically. With iphone it's been relatively consistent across versions (only changing for version 6 and above), but android phones are so varied I need to figure out a way to automatically determine it. When the resolution is incorrect, the waypoints used to refer to different parts of the body in the body scan app are in the wrong locations (Ex: Head is near the shoulder). Does anyone have tips to find the resolution? A lot of the resources just refer to them as magic numbers. I've also linked someone with a similar issue who has had no response.
import { Camera } from 'expo-camera';
import { cameraWithTensors } from '#tensorflow/tfjs-react-native';
const TensorCamera = cameraWithTensors(Camera);
class MyComponent {
handleCameraStream(images, updatePreview, gl) {
const loop = async () => {
const nextImageTensor = images.next().value
//
// do something with tensor here
//
// if autorender is false you need the following two lines.
// updatePreview();
// gl.endFrameEXP();
requestAnimation(loop);
}
loop();
}
render() {
// Currently expo does not support automatically determining the
// resolution of the camera texture used. So it must be determined
// empirically for the supported devices and preview size.
let textureDims;
if (Platform.OS === 'ios') {
textureDims = {
height: 1920,
width: 1080,
};
} else {
textureDims = {
height: 1200,
width: 1600,
};
}
return <View>
<TensorCamera
// Standard Camera props
style={styles.camera}
type={Camera.Constants.Type.front}
// Tensor related props
cameraTextureHeight={textureDims.height}
cameraTextureWidth={textureDims.width}
resizeHeight={200}
resizeWidth={152}
resizeDepth={3}
onReady={this.handleCameraStream}
autorender={true}
/>
</View>
}
}

Answer 1

The textureDims also varies depending on whether the user is in potrait or landscape so the current hard-coded value for iOS devices wouldn't work as well if the user were to change the orientation of the device.
What you could use instead is useWindowDimensions but this only works with functional components not with class components.
import React, { useState } from "react";
import { View, useWindowDimensions } from "react-native";
const [textureDims, setTextureDims] = useState();
const windowWidth = useWindowDimensions().width;
const windowHeight = useWindowDimensions().height;
setTextureDims({ height: windowHeight, width: windowWidth });
return (
<View>
<TensorCamera
// Standard Camera props
style={styles.camera}
type={Camera.Constants.Type.front}
// Tensor related props
cameraTextureHeight={textureDims.height}
cameraTextureWidth={textureDims.width}
resizeHeight={200}
resizeWidth={152}
resizeDepth={3}
onReady={handleCameraStream}
autorender={true}
/>
</View>
);