Swift90Days - 如何实现圆形加载进度条
今天照着 raywenderlich 的教程学习了一下使用 CAShapeLayer 实现一个原型的加载指示器。完成效果如图:
通过自定义一个 UIView
实现了这个红色的加载指示器,上面有一个 CAShapeLayer
,用来显示红色的圆环,圆环部分的关键代码是:
let circlePathLayer = CAShapeLayer() let circleRadius: CGFloat = 20.0 func configure() { circlePathLayer.frame = bounds circlePathLayer.linewidth = 2 circlePathLayer.fillColor = UIColor.clearColor().CGColor circlePathLayer.strokeColor = UIColor.redColor().CGColor layer.addSublayer(circlePathLayer) backgroundColor = UIColor.whiteColor() progress = 0 }
其实也没什么,就是设置 frame
和 linewidth
以及一些颜色之类的。然后在 layoutSubviews
里面设置 layer
的 path
就可以了:
override func layoutSubviews() { super.layoutSubviews() circlePathLayer.frame = bounds circlePathLayer.path = UIBezierPath(ovalInRect: circleFrame()).CGPath }
至于动画,则是通过 setter
来实现的,在 set
里设置 Layer
的终点:
var progress: CGFloat { get { return circlePathLayer.strokeEnd } set { if (newValue > 1) { circlePathLayer.strokeEnd = 1 } else if (newValue < 0) { circlePathLayer.strokeEnd = 0 } else { circlePathLayer.strokeEnd = newValue } } }
嗯挺简单也挺实用的,刚好公司里面有用到。完整的教程和项目源码见原文。
原文链接:
原文地址:https://www.jb51.cc/swift/327554.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。