Handling iOS Camera Preview vs Captured Image Discrepancy in VIN Recognition

When developing a VIN code recognition component, the preview image shown in the iOS camera viewfinder differs from the actual captured image, causing misalignment of the framing box on different iPhone models.

The root cause is that iOS scales the preview to fill the screen without black bars, leading to either height‑aligned (case A) or width‑aligned (case B) display depending on the aspect‑ratio comparison between the photo and the preview.

- (CGRect)fixCropRect:(CGRect)cropRect realImageSize:(CGSize)realImageSize previewRect:(CGRect)previewRect { CGRect fixedCropRect = cropRect; CGFloat imageRatio = realImageSize.width / realImageSize.height; CGFloat previewRatio = previewRect.size.width / previewRect.size.height; if (imageRatio > previewRatio) { CGFloat imageScreenWidth = imageRatio * previewRect.size.height; fixedCropRect.origin.x = (imageScreenWidth - cropRect.size.width)/2; } else if (imageRatio < previewRatio) { CGFloat imageScreenHeight = previewRect.size.width / imageRatio; CGFloat diff_y = (imageScreenHeight - previewRect.size.height)/2; fixedCropRect.origin.y += diff_y; } return fixedCropRect; }

- (CGRect)subimageCropRectOnImage:(UIImage *)orgimage cropRect:(CGRect)cropRect previewRect:(CGRect)previewRect { CGSize imageSize = orgimage.size; CGFloat PREVIEW_WIDTH = previewRect.size.width; CGFloat PREVIEW_HEIGHT = previewRect.size.height; CGFloat imageRatio = imageSize.width / imageSize.height; CGFloat previewRatio = PREVIEW_WIDTH / PREVIEW_HEIGHT; if (imageRatio > previewRatio) { CGFloat scale = PREVIEW_HEIGHT / imageSize.height; CGFloat x = cropRect.origin.x / scale; CGFloat y = cropRect.origin.y / scale; CGFloat w = cropRect.size.width / scale; CGFloat h = cropRect.size.height / scale; return CGRectMake(x, y, w, h); } else { CGFloat scale = PREVIEW_WIDTH / imageSize.width; CGFloat x = cropRect.origin.x / scale; CGFloat y = cropRect.origin.y / scale; CGFloat w = cropRect.size.width / scale; CGFloat h = cropRect.size.height / scale; return CGRectMake(x, y, w, h); } }

- (CGRect)subimageCropRectOnImage:(UIImage *)orgimage cropRect:(CGRect)cropRect previewRect:(CGRect)previewRect { CGSize imageSize = orgimage.size; CGFloat PREVIEW_WIDTH = previewRect.size.width; CGFloat PREVIEW_HEIGHT = previewRect.size.height; CGFloat imageRatio = imageSize.width / imageSize.height; CGFloat previewRatio = PREVIEW_WIDTH / PREVIEW_HEIGHT; if (imageRatio > previewRatio) { CGFloat imageScreenWidth = imageRatio * previewRect.size.height; cropRect.origin.x = (imageScreenWidth - cropRect.size.width)/2; CGFloat scale = PREVIEW_HEIGHT / imageSize.height; CGFloat x = cropRect.origin.x / scale; CGFloat y = cropRect.origin.y / scale; CGFloat w = cropRect.size.width / scale; CGFloat h = cropRect.size.height / scale; return CGRectMake(x, y, w, h); } else { CGFloat imageScreenHeight = previewRect.size.width / imageRatio; CGFloat diff_y = (imageScreenHeight - previewRect.size.height)/2; cropRect.origin.y += diff_y; CGFloat scale = PREVIEW_WIDTH / imageSize.width; CGFloat x = cropRect.origin.x / scale; CGFloat y = cropRect.origin.y / scale; CGFloat w = cropRect.size.width / scale; CGFloat h = cropRect.size.height / scale; return CGRectMake(x, y, w, h); } }

The combined method first applies the preview‑to‑screen compensation (fixCropRect) and then scales the rect to the actual image dimensions, yielding the correct crop rectangle for a true‑to‑preview VIN photo.