如何在不改变原始宽高比的情况下组合两个不同大小的UIImages？ [英] How to combine two UIImages of difference size without altering their original aspect ratios?

问题描述

我目前结合使用UIImages的方法来自答案因此，以及这个关于使用宽高比调整UIImage大小的流行问题。我目前的问题如下：

My current method of combining UIImages come from this answer on SO, as well as this popular question on resizing UIImage with aspect ratio. My current issue is the following:

我有一个名为 pictureImage 的UIImage用相机拍摄标准尺寸 2448 * 3264 。我还有一个名为 self.annotateView 的UIImageView，其框架为 320 * 568 ，用户可在其中绘制和注释图片。当我在 UIImageView 中显示 pictureImage 时，我将图像显示设置为 Aspect Fill 这样就占据了整个iPhone屏幕。当然这意味着 pictureImage 的部分在左右两边都被截断（实际上两边都是304像素），但这是预期的。

I have an UIImage called pictureImage taken with the camera that comes out to the standard dimension 2448*3264. I also have a UIImageView called self.annotateView that has a frame of 320*568 where the user could draw and annotate the picture. When I present the pictureImage in a UIImageView, I set the image presentation as Aspect Fill so that it takes up the whole iPhone screen. Of course this means parts of pictureImage is cut off on both left and right (in fact 304 pixels on both sides), but this intended.

我的问题是，当我将UIImages pictureImage 和 annotateView.image 组合成一个新的维度 320 * 568 ，我的组合图像通过水平拉伸来改变 annotateView.image 的原始方面。这很奇怪，因为新尺寸正好是 annotateView.image 的原始尺寸。

My problem is, when I combine the UIImages pictureImage and annotateView.image to a new dimension of 320*568, my combined image alters the original aspects of annotateView.image by stretching it horizontally. This is strange since the new dimensions are exactly that of annotateView.image's original dimensions.

这是什么结果看起来像 -

Here is what the outcome looks like -

在结合UIImages之前

Before combining the UIImages

合并图像后

请注意底层图片没有拉伸。但是， annotateView.image 只是水平拉伸而不是垂直拉伸。

Note that the underlying picture is not stretched. However, annotateView.image is stretched only horizontally, not vertically.

这是我合并UIImages的代码。

Here is my code for merging the UIImages.

//Note: self.firstTakenImage is set to 320*568

CGSize newSize = CGSizeMake(self.firstTakenImage.frame.size.width, self.firstTakenImage.frame.size.height);
UIGraphicsBeginImageContext(newSize);
[self.firstTakenImage.image drawInRect:CGRectMake(0, 0, newSize.width, newSize.height)];
[self.drawView.image drawInRect:CGRectMake(0, 0, newSize.width, newSize.height)];
UIImage *combinedImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

推荐答案

在执行drawInRect时，您必须重做缩放并使用AspectFill使系统为您做中心，使其与原始流程相匹配。这样的事情：

While doing the drawInRect, you have to redo the scaling and centering that the system did for you with AspectFill to make it match the original process. Something like this:

CGSize fullSize = self.pictureView.image.size;
CGSize newSize = self.outputView.frame.size;
CGFloat scale = newSize.height/fullSize.height;
CGFloat offset = (newSize.width - fullSize.width*scale)/2;
CGRect offsetRect = CGRectMake(offset, 0, newSize.width-offset*2, newSize.height);
NSLog(@"offset = %@",NSStringFromCGRect(offsetRect));

UIGraphicsBeginImageContext(newSize);
[self.pictureView.image drawInRect:offsetRect];
[self.annotateView.image drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
UIImage *combImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

self.outputView.image = combImage;

这篇关于如何在不改变原始宽高比的情况下组合两个不同大小的UIImages？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！