在UIWebView中显示来自摄像头的UIImage

Question

在我的iPhone应用程序中,我希望用户能够使用相机拍照,然后将该图像显示在一些本地存储的HTML中UIWebView.

所以我从中得到了UIImage对象UIImagePickerController,现在我需要找出如何将它保存到内存中以便我可以在中引用它UIWebView.

请注意,我不仅仅想要它自己的图像UIWebView(我想在一些HTML中将图片用作背景图像,其他图像分层在顶部).我还使用存储在应用程序中的其他图像和HTML,我通过将baseURLUIWebView设置为包路径来引用,例如:

NSURL *baseURL = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]];
[self.webView loadHTMLString:html baseURL:baseURL];

Answer 1

你绝对可以选择在本地保存文件,获取它的绝对路径并使用它.我用于混合应用程序的另一个选项是将UIImage转换为Base64字符串并将其通过javascript传递给webview以执行您想要的任何操作.为了做到这一点,在获得UIImage编码之后(有各种各样的库来做到这一点:

UIImage *image = [info objectForKey:@"UIImagePickerControllerOriginalImage"];
NSString *base64EncodedImage = [Base64 encode:UIImageJPEGRepresentation(image, 0.5)];

然后在您的HTML中,您可以使用给定base64图像的方法并将其设置为某些IMG或背景或您需要的任何内容:

 function cameraCallback(imageData) {
     var image = document.getElementById('myImage');
     image.src = "data:image/jpeg;base64," + imageData;
 }

要么

<img src="data:image/gif;base64, [YOUR BASE64 STRING HERE]" alt="" width="80" height="15" />

然后在webview中的HTML中使用

[mywebview stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"cameraCallback(%@)", base64EncodedImage]];

Answer 2

这就是我最终做到这一点的方式.在处理使用相机拍摄的图像的代码中,我实际上将文件直接保存到光盘:

// Get the image out of the camera
UIImage *image = (UIImage *)[info valueForKey:UIImagePickerControllerOriginalImage];

// Images from the camera are always in landscape, so rotate
UIImage *rotatedImage = scaleAndRotateImage(self.image);

// Save the image to the filesystem
NSData *imageData = UIImagePNGRepresentation(rotatedImage);
NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
NSString *documentsPath = [paths objectAtIndex:0];
NSString* savePath = [documentsPath stringByAppendingPathComponent:@"CameraPhoto.png"];
BOOL result = [imageData writeToFile:savePath atomically:YES];  

直接从此博客http://blog.logichigh.com/2008/06/05/uiimage-fix/复制旋转图像的功能.

然后当我想在UIWebView中显示这个图像时,我只是做一个字符串替换来引用注入图像的路径.所以在我的HTML中有类似<img src="{CameraPhotoUrl}" />然后:

// Build the reference to the image we just saved
NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
NSString *documentsPath = [paths objectAtIndex:0];
NSString *cameraImagePath = [documentsPath stringByAppendingPathComponent:[NSString stringWithFormat:@"CameraPhoto.png?x=%@", [[NSDate date] description]]];

// Load the HTML into the webview
NSString *htmlFilePath = [[NSBundle mainBundle] pathForResource:@"MyHtmlFile" ofType:@"htm"];
NSString *html = [NSString stringWithContentsOfFile:htmlFilePath encoding:NSUTF8StringEncoding error:nil];
html = [html stringByReplacingOccurrencesOfString:@"{CameraPhotoUrl}" withString:cameraImagePath];
NSURL *baseURL = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]];
[self.webView loadHTMLString:html baseURL:baseURL];

瞧!请注意,我将基于日期的查询字符串参数附加到CameraPhoto.png文件名,以防止缓存.