使用 Phonegap 在 iOS 上的相机预览上叠加图像

Question

我正在创建一个应用程序，其中半透明图像叠加在相机预览上。我知道他们的原生 Phonegap 相机 api 不支持这一点。我想知道是否有编写 Phonegap 插件经验的人可以给我任何关于插件是否可以实现这一点的建议。我想我已经看到这种技术可以通过本机代码实现，所以在我看来，可以编写一个 Phonegap 插件来访问此功能，我只是没有任何使用 Phonegap 插件的经验。

Answer 1

我知道，有点晚了，但有办法（仅限 iPad）。您可以使用标准的 org.apache.cordova.camera 插件。但你必须稍微调整一下它

首先将 CDVCameraPicker 子类化，以便你可以通过 cordova-api 切换覆盖：

CDVCameraPicker+Overlay.h:

#import "CDVCamera.h"

@interface CDVCameraPicker (Overlay)
@property (nonatomic, strong) id showOverlay;
@end

CDVCameraPicker+Overlay.m:

#import "CDVCameraPicker+Overlay.h"
#import <objc/runtime.h>

static void *overlayKey;

@implementation CDVCameraPicker (Overlay)
@dynamic showOverlay;

- (void) setShowOverlay:(id)showOverlay {
    objc_setAssociatedObject(self, overlayKey, showOverlay, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}
- (id) showOverlay {
    return objc_getAssociatedObject(self, overlayKey);
}
@end

然后将这些行添加到 CDVCamera。 m 检查完 ImagePickerSourceType（第 132 行）后

    if ([cameraPicker.showOverlay intValue] == 1) {
        UIImageView *overlay = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 768, 1024)];
        overlay.contentMode = UIViewContentModeScaleAspectFill;
        overlay.image = [UIImage imageNamed:@"overlay.png"];
    }

不要忘记在 CDVCamera.m 中导入您的子类 CameraPicker
#import "CDVCameraPicker+Overlay.h"

不，您必须编辑 Camera.js 文件
将此行添加到其他选项下方

var showOverlay = getValue(options.showOverlay, false);

，然后将 var 添加到 args-Array 的最后一个索引处。就是这样。现在您可以像这样切换叠加层：

       navigator.camera.getPicture(onSuccess, onFail, { quality: 40,
                        destinationType: Camera.DestinationType.FILE_URI,
                        sourceType: Camera.PictureSourceType.CAMERA,
                        encodingType: Camera.EncodingType.JPEG,
                        correctOrientation: true,
                        saveToPhotoAlbum: true,
                        showOverlay: false
                    }); 

Answer 2

我尝试了接受的答案，但不幸的是对我不起作用。

相反，我找到了一个更简单的解决方案。在 CDVCamera.m 中：

  + (instancetype) createFromPictureOptions(CDVPictureOptions*)pictureOptions;{

      CDVCameraPicker* cameraPicker = [[CDVCameraPicker alloc] init];
      cameraPicker.pictureOptions = pictureOptions;
      cameraPicker.sourceType = pictureOptions.sourceType;
      cameraPicker.allowsEditing = pictureOptions.allowsEditing;

if (cameraPicker.sourceType == UIImagePickerControllerSourceTypeCamera) {
    // More code...

         // Here is where you place your overlay.
         dispatch_async(dispatch_get_main_queue(), ^{
            UIImageView *overlayImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"myImage.png"]];
            overlayImage.frame = CGRectMake(0, 0, 768, 1024);
            [cameraPicker.cameraOverlayView addSubview:overlayImage];
            [cameraPicker setCameraOverlayView:overlayImage];
     });

   //  Code left out for brevity
   }
}

使用 Grand Central Dispatch 执行叠加非常重要。