iPhone屏幕上的像素到点

Question

我正在使用在线 OCR 服务，它会为我提供每个已识别的单词及其上/左点、宽度和高度（以像素为单位）。

我很难将它们转换为点并在识别的单词周围绘制一个矩形，因为（我认为）除了从像素到点本身的转换之外，包含图像的 imageView（以及我想要的绘制矩形）具有“缩放方面适合”内容模式。

这就是我获取图像并将其发送到网络服务的方式：

__weak typeof(self) weakSelf = self;

[self.cameraView captureImageWithCompletionHander:^(id image)
 {
     self.cameraView.enableTorch = NO;
     self.captureImageView = [[UIImageView alloc] initWithImage:image];
     self.captureImageView.backgroundColor = [UIColor colorWithWhite:0.0 alpha:0.7];
     self.captureImageView.frame = CGRectOffset(weakSelf.view.bounds, 0, -weakSelf.view.bounds.size.height);
     self.captureImageView.alpha = 1.0;
     self.captureImageView.contentMode = UIViewContentModeScaleAspectFit;
     self.captureImageView.userInteractionEnabled = YES;
     [self.cameraView addSubview:self.captureImageView];
     NSData *imageData = UIImagePNGRepresentation(image);
     NSURL *urlSave = [[self getDocumentsPathURL] URLByAppendingPathComponent:k_IMAGE_NAME];
     [imageData writeToFile:urlSave.path atomically:NO];
     OCRController *ocrController = [OCRController sharedInstance];
     [ocrController callOCRSpace:(UIImage*)image
                      completion:^(NSArray *responseObject) {
                          [ProgressHUD dismiss];
                          NSLog(@"Results: %@", responseObject);
                          dispatch_async(dispatch_get_main_queue(), ^{
                              [self drawRectangleOnImage:self.scannedImage rect:responseObject];
                          });
                      } error:^(NSError *error) {
                          [ProgressHUD dismiss];
                          NSLog(@"Error OCR: %@", error.localizedDescription);
                      }];

这是绘制矩形的方法（我现在只尝试第一个）：

- (void)drawRectangles:(NSArray*)objects {
    Words *firstObj = objects[0];
    NSLog(@"Word: %@", firstObj.wordText);
    UIView *rectView = [[UIView alloc] initWithFrame:CGRectMake([firstObj.left floatValue] / 4, [firstObj.top floatValue] / 4, [firstObj.width floatValue] / 4, [firstObj.height floatValue] / 4)];
    rectView.layer.borderColor = [UIColor redColor].CGColor;
    rectView.layer.borderWidth = 2.0;
    NSLog(@"Rect.:\nTop: %.2f - Left: %.2f\nWidth: %.2f - Height: %.2f", [firstObj.top floatValue] / 4, [firstObj.left floatValue] / 4, [firstObj.width floatValue] / 4, [firstObj.height floatValue] / 4);
    [self.captureImageView addSubview:rectView];
}

这是图像左上角第一个检测到的单词“Gracias”的结果：

在 Prashant Tukadiya 的回答之后

编辑：

- (void)drawRectangles:(NSArray*)objects {
    Words *firstObj = objects[0];
    CGPoint imagePoints = CGPointMake([firstObj.left doubleValue], [firstObj.top doubleValue]);
    float percentX = imagePoints.x / self.scannedImage.size.width;
    float percentY = imagePoints.y / self.scannedImage.size.height;
    CGPoint imageViewPoints = CGPointMake(self.captureImageView.frame.size.width * percentX, self.captureImageView.frame.size.height * percentY);

    UIView *rectView = [[UIView alloc] initWithFrame:CGRectMake(imageViewPoints.x, imageViewPoints.y, [firstObj.width floatValue], [firstObj.height floatValue])];
    rectView.layer.borderColor = [UIColor redColor].CGColor;
    rectView.layer.borderWidth = 2.0;
    [self.captureImageView addSubview:rectView];
}

我还从链接的答案中添加了 UIImageView+GeometryConversion 类别，但我真的不知道如何使用它。

我对所有这些坐标的东西都很陌生，我真的迷路了。

这是目前的结果，看起来我的 X 是对的，至少：

第二次编辑：我很接近了

所以，我找到了另一个示例并创建了一个新方法：

-(void)drawRectangleOnImage:(UIImage *)img rect:(NSArray *)objects {
    CGSize imgSize = img.size;
    CGFloat scale = 0;
    UIGraphicsBeginImageContextWithOptions(imgSize, NO, scale);
    [img drawAtPoint:CGPointZero];

    for (Words *item in objects) {
        CGRect rect = [self.captureImageView convertRect:CGRectMake([item.left doubleValue], [item.top doubleValue], [item.width floatValue], [item.height floatValue]) toView:self.captureImageView];
        [[UIColor greenColor] setFill];
        UIRectFill(rect);
        NSLog(@"Palabra: %@\nRect: %@\n\n", item.wordText, NSStringFromCGRect(rect));
    }

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    self.captureImageView.image = newImage;
}

这次我已经能够在每个识别的单词上画一个矩形。现在的问题是：

1. 画一个空的矩形（我还没能做到，是的，我觉得自己很蠢）

2. 让用户可以缩放图像，触摸图像上的单词，然后在该单词周围绘制矩形

这是我的最后一个结果：

Answer 1

您正在做的是将每个点静态除以 4，例如 [firstObj.left floatValue] / 4

没有允许从UIImage 转换为UIImageView 的内置方法，反之亦然

所以正如我在评论中提到的，你需要做的是

CGPoint imagePoints =  ..whatever your points you are getting 

float percentX = imagePoints.x / yourImage.size.width;
float percentY = imagePoints.y / yourImage.size.height;

CGPoint imageViewPoints = CGPointMake(imageView.frame.size.width * percentX, imageView.frame.size.height * percentY);

在这里您将获得 imageViewPoints，以便您可以使用该点添加您的子视图。还有一件事是你也需要处理纵横比。请参阅此帖子Convert points from image to UIImageView points, contentMode-aware。

希望对你有帮助