在目标C中屏蔽UIImage的透明区域上的背景颜色

时间:2014-01-24 08:35:02

标签: ios objective-c uiimageview uiimage image-masking

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

我目前正在开发一款iOS应用程序,而且我已经设计了一个进度指示器,我已经附上了它的图像

enter image description here

正如您所看到的,当用户进入挑战阶段时,此图像的背景将填满白色,因此如果他们处于5阶段挑战的第1阶段,则填充20%阶段2 40%等等。

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

我应该将相同的原则应用于iOS开发,还是应该以更加编程和有效的方式构建它。

感谢所有人的帮助

2 个答案:

答案 0 :(得分:1)

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

因此,将您的想法转化为观点。创建一个浅绿色背景的容器UIView,并添加一个白色的UIView和一个UIImageView(按顺序将图像放在上面)。图像视图将绿色图像的透明度设置为其image。白色视图将开始位于浅绿色视图下方(具有y值较高的帧),并且随着阶段的进展,您只需将白色视图向上移动,方法是修改它的centerframe属性。 (注意y向下增加)。

答案 1 :(得分:1)

这可能是一种幼稚的方式

  1. 创建一个UIImageView并将其添加到您放置兔子视图的视图中。
  2. 使宽度和x轴值与兔子视图相同,并在阶段完成时更改高度和y轴值。

  3. 在您的imageview上方添加兔子视图。

  4. 通过这种方式,您不仅可以获得进度的颜色,甚至可以在将来分配图像以显示不同变化的进度。

    -(void)completedStage:(int)stage
     {
    
    CGRect frame=rabbitimage.frame;
    bgimageview.frame= CGRectMake(rect.orgin.x,rect.frame.orgin.y+rect.frame.size.height-stage*0.2,rect.frame.size.width,rect.frame.size.height-0*2)
     }
    

    希望这有帮助!!!