UIImagePickerController 相机视图大小问题

Question

我正在使用 UIImagePickerController 和自定义 Overlay 构建应用程序。所做的是比较两个图像（前图像和后图像）。拍摄后照片时，我使用自定义叠加层与前图像（请参阅所附图像）。

iPhone 5 - ios7

iPhone 4 - iOS7（拍照时）

iPhone 4 - iOS 7（拍照后）

查看 iPhone 4 和 iPhone 5 相机视图的大小差异。

应用程序适用于 iPhone 5 屏幕尺寸（ios 6 和 ios7）。但是 iPhone 4/4s 的屏幕尺寸，它只适用于 iOS6。问题在于 iphone 4/4s（仅限 ios7），相机视图采用全屏显示。 这意味着，你可以注意到 iPhone 5 相机视图大小 ~ 320*427 (iOS 6 和 iOS 7) iPhone 4 相机视图尺寸 ~ 320*427 (iOS 6) 但 iPhone 4 相机视图大小 ~ 320*480 (iOS 7)。

图片拍摄后，拟合为320*427的实际尺寸。由于这个问题，我无法在 iPhone 4 iOS7 上将图像与相机视图对齐（因为它的尖叫声为 320*480）。

有没有人遇到过这个奇怪的问题。我几乎尝试了一切，但没有运气。有什么想法吗？？？

这是我在照片叠加之前使用自定义加载相机视图的代码。

- (void)loadCameraWithImage
{
    if (!isLoadedOnce)
    {
    isLoadedOnce = YES;
            UIImagePickerController *cameraView = [[UIImagePickerController alloc] init];
           cameraView.sourceType = UIImagePickerControllerSourceTypeCamera;
           cameraView.wantsFullScreenLayout = NO;

        if ([self respondsToSelector:@selector(setEdgesForExtendedLayout:)]) {
         [self setEdgesForExtendedLayout:UIRectEdgeNone];
        }


    // crop before image

    UIImage *imgTmpCropped = [self imageByCropping:imgBefore toRect:CGRectMake(0, 0, imgBefore.size.width/2, imgBefore.size.height)];
    UIImage *overleyImage = [[UIImage alloc] initWithCGImage: imgTmpCropped.CGImage
                                                   scale: [UIScreen mainScreen].scale
                                             orientation: UIImageOrientationDownMirrored];

    UIImageView *crosshairView;
    UIImageView *beforeView;

    CGFloat screenHieght = [UIScreen mainScreen].bounds.size.height;

    if (UI_USER_INTERFACE_IDIOM() == UIUserInterfaceIdiomPad){
        //overleyImage = [UIImage imageNamed:@"overlay_ipad.png"];
        crosshairView = [[UIImageView alloc] initWithImage:overleyImage];
        crosshairView.frame = CGRectMake(0, 0, 768, 1024);
        [crosshairView setUserInteractionEnabled:YES];
        crosshairView.backgroundColor = [UIColor clearColor];

        beforeView = [[UIImageView alloc] initWithImage:overleyImage];
        beforeView.frame = CGRectMake(0, 0, 384, 1024);
        beforeView.alpha = 0.5;
        beforeView.contentMode = UIViewContentModeScaleAspectFill;
    }

    else {
        //overleyImage = [UIImage imageNamed:@"overleyImageAfter.png"];
        crosshairView = [[UIImageView alloc] init];
        beforeView = [[UIImageView alloc] initWithImage:overleyImage];

        if(screenHieght>500){
            crosshairView.frame = CGRectMake(0, 60, 320, 480);
            beforeView.frame = CGRectMake(0, 70, 160, 427);
        }
        else{

            if([[[UIDevice currentDevice] systemVersion] floatValue] <7.0){
                crosshairView.frame = CGRectMake(0, 0, 320, 480);
                beforeView.frame = CGRectMake(0, 0, 160, 427);
            }
            else{
                crosshairView.frame = CGRectMake(0, 0, 320, 480);
                beforeView.frame = CGRectMake(0, 0, 160, 480);
            }

        }

        [crosshairView setUserInteractionEnabled:YES];
        crosshairView.backgroundColor = [UIColor clearColor];
        beforeView.alpha = 0.5;
        beforeView.contentMode = UIViewContentModeScaleToFill;
    }


    //[crosshairView addSubview:beforeView];

    //set our custom overlay view
    cameraView.cameraOverlayView = beforeView;
    cameraView.delegate = (id)self;
    cameraView.showsCameraControls = YES;
    cameraView.navigationBarHidden = YES;
    cameraView.toolbarHidden = YES;
    [cameraView setHidesBottomBarWhenPushed:YES];


    [self.view.window.rootViewController presentViewController:cameraView animated:YES completion:nil];

    isLoadedOnce = NO;
}

}

Answer 1

TL;DR

相机的预览在每台设备上都具有相同的纵横比 (4:3)，而屏幕则不然。假设预览将具有特定的纵横比，并且它将被放置在屏幕上的特定位置。在该区域内绘制叠加层。

更长：

我们遇到了同样的问题。 （我们的用例是用与卡片大小相同的覆盖层为信用卡拍照）。主要问题是每个设备的相机预览比例始终相同 (4:3)，但不同手机的屏幕比例不同（例如 iPhone 4s 与 iPhone 5），因此预览需要以不同方式安装，这使得放置非常困难的叠加和裁剪。

我们的解决方案是（代码有点混乱和hacky，抱歉）：

    // Adjust camera preview to be a little bit more centered instead of adjusted to the top
    CGSize screenSize = [[UIScreen mainScreen] bounds].size;
    float cameraAspectRatio = 4.0 / 3.0;
    float imageHeight = screenSize.width * cameraAspectRatio;
    float verticalAdjustment;
    if (screenSize.height - imageHeight <= 54.0f) {
        verticalAdjustment = 0;
    } else {
        verticalAdjustment = (screenSize.height - imageHeight) / 2.0f;
        verticalAdjustment /= 2.0f; // A little bit upper than centered
    }
    CGAffineTransform transform = self.cameraController.cameraViewTransform;
    transform.ty += verticalAdjustment;
    self.cameraController.cameraViewTransform = transform;

    CGRect previewFrame = CGRectMake(0, verticalAdjustment, screenSize.width, imageHeight);
    CardPhotoView *overlayView = [[CardPhotoView alloc] initWithFrame:CGRectMake(0, 0, screenSize.width, screenSize.height) widthPercentageOfCamera:self.widthPercentageOfCamera previewFrame:previewFrame];
    self.overlayView = overlayView;

    self.overlayView.delegate = self;
    self.overlayView.useViewport = YES;
    [self.overlayView setCameraReady:NO];

    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(cameraIsReady:) name:AVCaptureSessionDidStartRunningNotification object:nil];

    self.cameraController.showsCameraControls = NO;
    self.cameraController.navigationBarHidden = YES;
    self.cameraController.toolbarHidden = YES;
    self.cameraController.cameraOverlayView = self.overlayView;

    [self presentViewController:self.cameraController animated:NO completion:nil];

解释：

self.cameraController 是 UIImagePickerController。 CardPhotoView 是一个绘制叠加层的视图子类，它需要预览帧才能准确地知道预览的位置（有些设备的顶部和底部会有黑条，有些则不会）。还需要一个宽度百分比来为裁剪窗口添加一点填充。 此外，我们已经隐藏了所有默认的相机控件，并且我们已经实现了一些可以为我们完成工作的按钮。这些按钮被添加到 CardPhotoView 类中，并且在绘制时考虑了预览框的位置。