只需用矩形遮罩 UIView

Question

我想知道如何简单地掩盖任何类型的 UIView 的可见区域。到目前为止，我阅读的所有答案/教程都描述了使用图像、渐变或创建圆角进行遮罩，这比我所追求的要先进得多。

示例：我有一个边界为 (0, 0, 100, 100) 的 UIView，我想使用遮罩切除视图的右半部分。因此，我的蒙版框架将是 (0, 0, 50, 100)。

知道如何简单地做到这一点吗？我不想重写 drawrect 方法，因为这应该适用于任何 UIView。

我已经尝试过了，但它只会使整个视图不可见。

CGRect mask = CGRectMake(0, 0, 50, 100);
UIView *maskView = [[UIView alloc] initWithFrame:mask];
viewToMask.layer.mask = maskView.layer;

Answer 1

一个可选层，其 alpha 通道 用作掩码以进行选择 图层背景与合成结果之间 图层的内容及其过滤背景。

@property(retain) CALayer *mask

正确的方法是创建与viewToMask 相同帧（0、0、100、100）的maskView 要屏蔽哪个图层。然后，您需要为要使其不可见的路径设置 clearColor（这将阻止路径上的视图交互，因此请注意视图层次结构）。

Answer 2

感谢 MSK 提供的链接，这是我采用的方法，效果很好：

// Create a mask layer and the frame to determine what will be visible in the view.
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
CGRect maskRect = CGRectMake(0, 0, 50, 100);

// Create a path with the rectangle in it.
CGPathRef path = CGPathCreateWithRect(maskRect, NULL);

// Set the path to the mask layer.
maskLayer.path = path;

// Release the path since it's not covered by ARC.
CGPathRelease(path);

// Set the mask of the view.
viewToMask.layer.mask = maskLayer;

Answer 3

根本不需要任何面具。 只需将其放入具有较小框架的包装视图，然后设置clipsToBounds。

wrapper.clipsToBounds = true

Answer 4

设置MaskToBounds 是不够的，例如，在UIImageView 位于RelativeLayout 内部的情况下。如果您将UIImageView 放在布局的顶部边缘附近，然后旋转您的UIImageView，它将超过布局并且不会被裁剪。如果您将该标志设置为 true，它将被裁剪是，但如果 UIImageView 位于布局的中心，它也会被裁剪，这不是您想要的。

因此，确定maskRect 是正确的方法。

Answer 5

Swift ViewController 中非常简单的示例，基于公认的答案：

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()

        let redView = UIView(frame: view.bounds)
        view.addSubview(redView)

        view.backgroundColor = UIColor.green
        redView.backgroundColor = UIColor.red

        mask(redView, maskRect: CGRect(x: 50, y: 50, width: 50, height: 50))
    }

    func mask(_ viewToMask: UIView, maskRect: CGRect) {
        let maskLayer = CAShapeLayer()
        let path = CGPath(rect: maskRect, transform: nil)
        maskLayer.path = path

        // Set the mask of the view.
        viewToMask.layer.mask = maskLayer
    }
}

输出

Answer 6

谢谢大家的回答。

如果有人在这个问题上找不到合适的答案，就像我刚刚做的那样，我已经在 Swift 2.2 中为masking/clipping UIView 和CGRect 组装了一个工作要点/UIBezierPath：

https://gist.github.com/Flar49/7e977e81f1d2827f5fcd5c6c6a3c3d94

extension UIView {

    func mask(withRect rect: CGRect, inverse: Bool = false) {
        let path = UIBezierPath(rect: rect)
        let maskLayer = CAShapeLayer()

        if inverse {
            path.append(UIBezierPath(rect: self.bounds))
            maskLayer.fillRule = kCAFillRuleEvenOdd
        }

        maskLayer.path = path.cgPath

        self.layer.mask = maskLayer
    }

    func mask(withPath path: UIBezierPath, inverse: Bool = false) {
        let path = path
        let maskLayer = CAShapeLayer()

        if inverse {
            path.append(UIBezierPath(rect: self.bounds))
            maskLayer.fillRule = kCAFillRuleEvenOdd
        }

        maskLayer.path = path.cgPath

        self.layer.mask = maskLayer
    }
}

用法：

let viewSize = targetView.bounds.size
let rect = CGRect(x: 20, y: 20, width: viewSize.width - 20*2, height: viewSize.height - 20*2)

// Cuts rectangle inside view, leaving 20pt borders around
targetView.mask(withRect: rect, inverse: true)

// Cuts 20pt borders around the view, keeping part inside rect intact
targetView.mask(withRect: rect)

希望它会在未来为某人节省一些时间:)

Answer 7

Swift 5，感谢@Dan Rosenstark

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        let red = UIView(frame: view.bounds)
        view.addSubview(red)
        view.backgroundColor = UIColor.cyan
        red.backgroundColor = UIColor.red
        red.mask(CGRect(x: 50, y: 50, width: 50, height: 50))
    }
}

extension UIView{
    func mask(_ rect: CGRect){
        let mask = CAShapeLayer()
        let path = CGPath(rect: rect, transform: nil)
        mask.path = path
        // Set the mask of the view.
        layer.mask = mask
    }
}