在 UIView 上绘制图像，并打一个透明孔可以看到下面的 UIView

Question

我有一个 UIView，我正在尝试将其放在另一个视图之上。这个新视图需要有一个完全透明的洞。我附上了我正在尝试完成的截图（棋盘格图案是底层 UIView，它将添加这个新的 UIView 作为子层，红色是 UIImage）。

我有以下代码可以渲染中间有孔的黑色背景：

- (void)
drawRect:(CGRect)rect
{
  CGRect boxRect = CGRectMake(_location.x - (kPointRadius/2), _location.y - (kPointRadius/2), kPointRadius, kPointRadius);

  UIBezierPath *path = [UIBezierPath
                        bezierPathWithRoundedRect:CGRectMake(0, 0, self.layer.frame.size.width, self.layer.frame.size.height)
                        cornerRadius:0];

  UIBezierPath *circlePath = [UIBezierPath
                              bezierPathWithRoundedRect:boxRect
                              cornerRadius:kPointRadius];
  [path appendPath:circlePath];
  [path setUsesEvenOddFillRule:YES];

  CAShapeLayer *fillLayer = [CAShapeLayer layer];
  fillLayer.path = path.CGPath;
  fillLayer.fillRule = kCAFillRuleEvenOdd;
  fillLayer.fillColor = [UIColor blackColor].CGColor;
  fillLayer.borderWidth = 5.0;
  fillLayer.borderColor = [UIColor redColor].CGColor;
  fillLayer.opacity = 0.7;
  [self.layer addSublayer:fillLayer];
}

但是，当我向其添加图像并使用 [[UIImage imageNamed:@"testimg" drawAtPoint:CGPointMake(x, y)]; 添加图像时，图像会覆盖该孔。

谁能给我指出正确的方向？我被难住了。

编辑： 我现在几乎可以做到了。我可以得到我需要的一切，除了在黑色上分层的图像，90% 不透明背景也是 90% 不透明度。

CGRect boxRect = CGRectMake(
                              _location.x - (kPointRadius/2),
                              _location.y - (kPointRadius/2),
                              kPointRadius,
                              kPointRadius);

  UIBezierPath *path = [UIBezierPath
                        bezierPathWithRoundedRect:CGRectMake(0, 0, self.layer.frame.size.width, self.layer.frame.size.height) cornerRadius:0];

  UIBezierPath *circlePath = [UIBezierPath
                              bezierPathWithRoundedRect:boxRect
                              cornerRadius:kPointRadius];
  [path appendPath:circlePath];
  [path setUsesEvenOddFillRule:YES];

  UIImage *image = [UIImage imageNamed:@"testimg"];
  UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(13, 57, 350, 230)];
  imageView.image = image;
  CGRect r = CGRectMake(self.layer.frame.origin.x, self.layer.frame.origin.y, self.layer.frame.size.width, self.layer.frame.size.height);
  UIGraphicsBeginImageContextWithOptions(r.size, NO, 0);
  CGContextRef c = UIGraphicsGetCurrentContext();
  CGContextAddPath(c, CGPathCreateCopy(path.CGPath));

  CGContextEOClip(c);
  CGContextFillRect(c, r);
  UIImage* maskim = UIGraphicsGetImageFromCurrentImageContext();
  UIGraphicsEndImageContext();
  CALayer* mask = [CALayer layer];
  mask.frame = r;
  mask.contents = (id)maskim.CGImage;
  imageView.layer.mask = mask;
  self.layer.mask = mask;
  self.layer.backgroundColor = [UIColor blackColor].CGColor;
  self.layer.opacity = 0.8;
  [self.layer addSublayer:imageView.layer];

Answer 1

EDIT: I'm now able to get it almost there. I can get everything I need EXCEPT the image layered on top of the black, 90% opaque background is also at 90% opacity.

您可以将图层的背景颜色设置为 [UIColor colorWithWhite:0.0 alpha:0.9]，而不是设置其不透明度。

在 UIView 上绘制图像，并打一个透明孔可以看到下面的 UIView

Drawing an image on a UIView, and making a transparent hole to see the UIView underneath

objective-c

uiview

uiimage

ios