1

我对如何去做有点迷茫，我真的在寻找它背后的理论，我不是 100% 确定标题是否正确。

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

在此处输入图像描述

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

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

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

感谢你的帮助

4

2 回答 2

1

这可能是一种幼稚的方式

  1. 制作一个 UIImageView 并将其添加到您放置兔子视图的视图中。

  2. 使宽度和 x 轴值与您的兔子视图相同，并在阶段完成时更改高度和 y 轴值。

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

通过这种方式，您不仅可以拥有进度的颜色，您甚至可以在将来分配图像以显示不同更改的进度。

-(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)
 }

希望这可以帮助 ！！！

于 2014-01-24T08:53:09.163 回答
1

您正在谈论的解决方案听起来不错。许多程序解决方案将涉及屏蔽并且可能性能较低（屏蔽实际上非常昂贵），其他程序解决方案涉及抚摸不同的矢量路径，但如果您想将它们全部剪切到同一条线上，这将变得复杂。

因此，将您的想法转化为观点。创建一个具有浅绿色背景的容器 UIView，并向其中添加一个白色 UIView 和一个 UIImageView（以便将图像放在顶部）。图像视图将具有透明度设置为其的绿色图像image。白色视图将开始位于浅绿色视图下方（具有更高 y 值的框架），并且随着阶段的进展，您只需通过修改它的center或frame属性将白色视图向上移动。（注意 y 向下增加）。

于 2014-01-24T08:44:52.673 回答