快速进度指示器图像蒙版

时间:2015-01-11 00:05:18

标签: ios swift mask progress

首先,这个项目是使用Swift构建的。

我想创建一个自定义进度指示器,以便填满"当脚本运行。该脚本将调用从远程服务器提取的JSON提要。

为了更好地想象我之后的事情,我做了这个:

enter image description here

我的猜测是有两个PNG图像;一个白色和一个红色,然后根据进度金额做一些掩蔽。

对此有何想法?

1 个答案:

答案 0 :(得分:5)

掩盖对此可能有点过头了。只需每次重绘图像。当你这样做时,你绘制红色矩形以填充图形的下半部分,达到你想要的任何高度;然后你绘制液滴图像(PNG),中间有透明度,红色矩形透过。因此,一个PNG就足够了,因为可以绘制红色矩形"直播"每次重绘。

我非常喜欢你的绘画,我想把它变为现实,所以这里是我的工作代码(我的PNG被称为 tear.png iv是一个我的界面中的UIImageView; percent应该是介于0和1之间的CGFloat:

func redraw(percent:CGFloat) {
    let tear : UIImage! = UIImage(named:"tear")!
    if tear == nil {return}
    let sz = tear.size
    let top = sz.height*(1-percent)
    UIGraphicsBeginImageContextWithOptions(sz, false, 0)
    let con = UIGraphicsGetCurrentContext()
    UIColor.redColor().setFill()
    CGContextFillRect(con, CGRectMake(0,top,sz.width,sz.height))
    tear.drawAtPoint(CGPointMake(0,0))
    self.iv.image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
}

我还连接了一个UISlider,其动作方法将其value转换为CGFloat并调用该方法,以便前后移动滑块在泪珠中上下移动红色填充。我可以玩几个小时了!

enter image description here