ios - 在 Objective-C 的 UIImage 的透明区域上屏蔽背景颜色

Question

我对如何解决这个问题有点迷茫，我真的在寻找它背后的理论，我不能 100% 确定标题是否正确。

我目前正在开发一个 iOS 应用程序，我有点坚持设计的进度指示器，我在下面附上了它的图片

正如您所看到的，当用户在挑战的各个阶段取得进展时，此图像的背景会填充白色，因此如果他们处于 5 阶段挑战的第 1 阶段，则其填充 20% 第 2 阶段 40% 等。

我遇到的问题是我不是 100% 确定如何解决这个问题，如果我在 HTML 中这样做，我会创建具有绿色背景的图像并为兔子和形状保留透明区域，然后创建一个 div在它后面会改变它的高度。

我应该将相同的原则应用到 iOS 开发中，还是应该以更具程序性和效率的方式构建它。

谢谢大家的帮助

Answer 1

您所说的解决方案听起来不错。许多程序化解决方案会涉及 mask 并且可能性能较低( mask 实际上非常昂贵)，其他程序化解决方案涉及抚摸不同的矢量路径，但如果您想将它们全部切割成一条线，这会变得复杂。

因此，将您的想法转化为观点。创建一个具有浅绿色背景的容器 UIView，并向其添加一个白色 UIView 和一个 UIImageView(按此顺序使图像位于顶部)。 ImageView 会将带有透明度的绿色图像设置为其 image。白色 View 将开始位于浅绿色 View 下方(具有更高 y 值的框架)，并且随着阶段的进行，您只需通过修改它的 center 或 向上移动白色 View 框架属性。 (注意 y 向下增加)。