使用点和多个图像视图

Question

我正在处理一个包含两个UIImageView的视图控制器。底部图像视图保存照片（由用户拍摄或选择）。第二个图像视图位于此顶部，也占据整个屏幕。

第二个图像视图包含一个指针（下例中的绿点）。它用作可移动视图，可以定位在屏幕上。它的用途是标记背后照片上的位置/点。

在纵向中，此工作正常，底部图像视图设置为图像=纵横填充。因此拍摄的照片占据了整个屏幕。

在横向方向，这不起作用。

我可以用更好的方式解释一下

  

下面的图片严重

例如，如果用户在纵向视图上选择一个点（由绿点显示），则大致位置为220,380。

但是，如果相同的位置在横向上，那么背后的照片上的位置就不一样了。

这一点将转化为280,300。

所以问题是......当VC是方向景观时，如何确定图像的高度和宽度（从底部图像视图中）以计算出相同的点？

OR是否有其他方法/方法来实现这一目标？

-------编辑---------- 我已经创建了一个仅具有此功能的测试应用程序。我具有与上面详述的相同的设置。我已将日志添加到视图中，并将方向更改为横向。以下是我正在使用的日志：

NSLog(@"bottom image view width: %f",self.photoImageView.frame.size.width);
NSLog(@"bottom image view height: %f",self.photoImageView.frame.size.height);
NSLog(@"bottom image view frame bounds X: %f",self.photoImageView.frame.origin.x);
NSLog(@"bottom image view frame bounds Y: %f",self.photoImageView.frame.origin.y);
NSLog(@"bottom image view bounds X: %f",self.photoImageView.bounds.origin.x);
NSLog(@"bottom image view bounds Y: %f",self.photoImageView.bounds.origin.y);
NSLog(@"---------BOTTOM IMAGE VIEW IMAGE DETAILS---------");
NSLog(@"bottom image view image width: %f",self.photoImageView.image.size.width);
NSLog(@"bototm image view image height: %f",self.photoImageView.image.size.height);
NSLog(@"bottom image view image frame bounds X: %f",self.photoImageView.image.accessibilityFrame.origin.x);
NSLog(@"buttom image view image frame bounds Y: %f",self.photoImageView.image.accessibilityFrame.origin.y);

结果如下：

2013-07-30 14:58:23.013 SelectPhotoViewTest[3414:c07] ---------VIEW DETAILS---------
2013-07-30 14:58:23.014 SelectPhotoViewTest[3414:c07] ---------BOTTOM IMAGE VIEW DETAILS---------
2013-07-30 14:58:23.015 SelectPhotoViewTest[3414:c07] bottom image view width: 480.000000
2013-07-30 14:58:23.016 SelectPhotoViewTest[3414:c07] bottom image view height: 268.000000
2013-07-30 14:58:23.016 SelectPhotoViewTest[3414:c07] bottom image view frame bounds X: 0.000000
2013-07-30 14:58:23.017 SelectPhotoViewTest[3414:c07] bottom image view frame bounds Y: 0.000000
2013-07-30 14:58:23.018 SelectPhotoViewTest[3414:c07] bottom image view bounds X: 0.000000
2013-07-30 14:58:23.018 SelectPhotoViewTest[3414:c07] bottom image view bounds Y: 0.000000
2013-07-30 14:58:23.019 SelectPhotoViewTest[3414:c07] ---------BOTTOM IMAGE VIEW IMAGE DETAILS---------
2013-07-30 14:58:23.019 SelectPhotoViewTest[3414:c07] bottom image view image width: 258.000000
2013-07-30 14:58:23.019 SelectPhotoViewTest[3414:c07] bototm image view image height: 480.000000
2013-07-30 14:58:23.020 SelectPhotoViewTest[3414:c07] bottom image view image frame bounds X: 0.000000
2013-07-30 14:58:23.021 SelectPhotoViewTest[3414:c07] buttom image view image frame bounds Y: 0.000000

如何从这些结果中确定中心点相对于底部图像坐标的位置？

Answer 1

您实际上必须在两个方向上将点转换为图像的坐标系。在您给出的示例中，它仅适用于肖像，因为图像具有与屏幕相同的纵横比。如果你有一个方形图像，那么这个点与图像没有1：1的关系，可以很容易地放在图像之外。

我可以想到两种方法来实现你的目标：

1）取决于图像，不要让底部的图像视图占据整个屏幕并填充方面，而是手动调整大小以占据屏幕的整个宽度或高度。即如果您有1000x1000图像，您希望图像视图为320x320用于portait（iphone3）或300x300用于横向。然后，将第二张图像作为第一张图像的子视图。它的位置现在相对于底部图像的坐标系。

2）使用一些简单的数学运算将屏幕上的点转换为图像的坐标系。您知道底部图像视图的大小和宽高比，并且您对图像了解相同。

假设图像为640x920。在横向中，底部图像视图将为480x300。

1）将图像缩放到图像视图中的大小（209x300）

2）由于图像将居中，因此它将从左侧开始约136点

3）因此，屏幕上的点（280,300）将转换为（144,280 [状态栏的-20点]）相对于较小的图像，转换为（441,859）完整图像的坐标系。

我希望这能指出你正确的方向。

修改

好的，处理您的示例日志：

[顺便说一下，你可以像这样更容易打印出一个CGRECT：NSLog（@“％@”，NSStringFromCGRect（self.photoImageView.frame））]

1）缩放图像尺寸，使其适合图像视图：

ratio = photoImageView.frame.size.height / photoImageView.image.size.height;
height = photoImageView.image.size.height * ratio;
width = photoImageView.image.size.width * ratio;

2）计算图像视图内的图像框架

x = (photoImageView.frame.size.width - width) / 2;
y = 0;
frame = CGRectMake(x, y, width, height);

3）假设您使用[touch locationInView：photoImageView]获取位置点，您可以检查触摸是否在图像框内

CGRectContainsPoint(frame, location)

编辑 - 包括使用的实际代码 - 与处理图像视图的方向略有不同。

if (self.photoImageView.frame.size.height < self.photoImageView.frame.size.width ) {
    // This is device and image view is landscape
    if (self.pushedPhoto.size.height < self.pushedPhoto.size.width) {
        // The pushed photo is portrait
        self.photoImageViewRatio = self.photoImageView.frame.size.height / self.pushedPhoto.size.height;
    } else {
        // The pushed photo is landscape
        self.photoImageViewRatio = self.photoImageView.frame.size.width / self.pushedPhoto.size.width;
    }

} else {
    // This is device and image view is portrait
    if (self.pushedPhoto.size.height < self.pushedPhoto.size.width) {
        // The pushed photo is portrait
        self.photoImageViewRatio = self.photoImageView.frame.size.width / self.pushedPhoto.size.width;

    } else {
        // The pushed photo is landscape
        self.photoImageViewRatio = self.photoImageView.frame.size.height / self.pushedPhoto.size.height;
    }
}

self.valueHeight = self.pushedPhoto.size.height * self.photoImageViewRatio;
self.valueWidth = self.pushedPhoto.size.width * self.photoImageViewRatio;




float x =  (self.photoImageView.frame.size.width - self.valueWidth) / 2;
float y = (self.photoImageView.frame.size.height - self.valueHeight) /2;