动态 UIView 上的半透明动态蒙版答案

【问题标题】：Semi transparent dynamic mask on over dynamic UIView动态 UIView 上的半透明动态蒙版
【发布时间】：2016-09-20 22:28:43
【问题描述】：

不知道在哪里可以找到它，但我想创建一个视图或图层的半透明蒙版，它可以移动、更改不透明度并同时在屏幕上显示多个重叠。

大意是这样的：

两个小盒子可以移动并改变颜色的不透明度。

我尝试过使用CALayer 面具，但这只是穿透，所以我在孔中添加了一个CAShapeLayer，但你可以看到边缘。我尝试在CAShapeLayer 上使用allowsEdgeAntialiasing，但这似乎不起作用。

我见过的其他示例仅适用于 UIImageViews，因为它们使用两个 UIImageViews 相互叠加来获得效果。不幸的是，我需要它来处理任何类型的 UIView。

我也尝试使用CGBlendMode.SourceOut，它效果很好，除了重叠区域更轻，这完全有道理，但不是我想要的。

let blendMode = CGBlendMode.SourceOut

CGContextSaveGState(context)

CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 0.75).CGColor)
CGContextFillRect(context, rect)

CGContextSetBlendMode(context, blendMode)

CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 0.25).CGColor)
CGContextFillRect(context, CGRectMake(0, 500, 60, 50))

CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 1).CGColor)
CGContextFillRect(context, CGRectMake(0, 550, 60, 50))

最后两个填充矩形重叠，第一个是将整个视图设置为具有半透明覆盖。

【问题讨论】：

标签： ios transparency calayer mask

【解决方案1】：

看起来你可以使用混合模式：

背景正常
清除正方形的孔
方块再次正常以呈现重叠外观

当第二个框设置为与背景相同的 alpha 时，这似乎不会显示正方形周围的边缘

此代码生成顶部图像（在 drawRect 中调用）：

CGContextSetBlendMode(context, CGBlendMode.Normal)
CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 0.75).CGColor)
CGContextFillRect(context, rect)

CGContextSetBlendMode(context, CGBlendMode.Clear)
CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 1).CGColor)
CGContextFillRect(context, CGRectMake(20, 150, 100, 100))
CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 1).CGColor)
CGContextFillRect(context, CGRectMake(50, 200, 100, 100))

CGContextSetBlendMode(context, CGBlendMode.Normal)
CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 0.25).CGColor)
CGContextFillRect(context, CGRectMake(20, 150, 100, 100))
CGContextSetFillColorWithColor(context, UIColor(white: 0.0, alpha: 0.15).CGColor)
CGContextFillRect(context, CGRectMake(50, 200, 100, 100))

【讨论】：