React Native: 카메라 스캔 영역 지정하기 camera scan limit area

편리한 카메라 모듈인 react-native-camera를 사용했다.

설치:
yarn add react-native-camera

카메라 스캔 영역 지정하는법:
const CAM_VIEW_HEIGHT = Dimensions.get('screen').width * 1.5;
const CAM_VIEW_WIDTH = Dimensions.get('screen').width;

const leftMargin = 100;
const topMargin = 50;
const frameWidth = 200;
const frameHeight = 250;

const scanAreaX = leftMargin / CAM_VIEW_HEIGHT;
const scanAreaY = topMargin / CAM_VIEW_WIDTH;
const scanAreaWidth = frameWidth / CAM_VIEW_HEIGHT;
const scanAreaHeight = frameHeight / CAM_VIEW_WIDTH;

class Demo extends Component {
render() {
return (
<View style={styles.container}>
<RNCamera
rectOfInterest={{
x: scanAreaX,
y: scanAreaY,
width: scanAreaWidth,
height: scanAreaHeight,
}}
cameraViewDimensions={{
width: CAM_VIEW_WIDTH,
height: CAM_VIEW_HEIGHT,
}}
>
<View
style={{
position: 'absolute',
top: leftMargin,
right: topMargin,
width: frameHeight,
height: frameWidth,
borderWidth: 2,
borderColor: 'red',
opacity: 0.5,
}}
/>
</RNCamera>
</View>
);
}
}