使用 ImageMask Swift 填充图像

Question

我正在尝试 fiddle 如何用一种颜色填充中心透明的 PNG。 我给你做了一个预览，让你看到我无法解释的东西 :D

"Shield Icon"只是一笔画。无论是在里面还是在外面，都没有背景。

我想调用这样的函数

func fillShield(percentage: CGFLoat) {
     ...
     //code needed to fill the shield
}

如何在 swift 中实现类似的功能？

干杯，尼克拉斯

Answer 1

您有原始的 SVG（或者您能得到一个）而不是 PNG。如果是这样，我建议获取 PaintCode，它将采用此 SVG 并为您提供使用贝塞尔曲线绘制它的代码——从那里也很容易部分填充它——你可以使用贝塞尔曲线和矩形作为遮罩。

如果不是，您能否修改 png 使其在外部不透明？如果是这样，你只需要在下面画一个绿色的矩形，它就会显示出来。

如果您需要外部透明（以覆盖在背景上），请复制两份 PNG，一份内部透明，一份外部透明。使用第一个制作进度图像，然后将第二个的 Alpha 通道复制到结果中。

CoreImage 和 CoreGraphics 具有完成每个部分所需的功能 -- 这里有一个 link 用于了解如何获取像素（用于复制通道）：

http://www.raywenderlich.com/69855/image-processing-in-ios-part-1-raw-bitmap-modification

编辑：详细说明。你需要两张图片

1. 图1是外面白色不透明，里面透明的盾牌

2. 图2是里面白色不透明外面透明的盾牌

步骤：

1. 使用 CoreGraphics

在图像上绘制一个绿色矩形，其高度由进度决定，底部设置为盾牌的内部底部

2. 在上面画图 1。你现在有一个图像，盾牌充满了绿色的进步，外面是白色的。

3. 将图像 2 的 alpha 通道复制到步骤 2 的结果上。您现在有一个填充了进度且外部透明的图像。