ios – 如何为倒计时器创建循环进度指示器

概述我正在尝试添加倒计时到我的应用程序,我有动画这个问题.我想要的外观类似于下面显示的iPad倒计时,红色条随着时钟倒计时而增加. 最初我创建了一个图像地图集,每个倒计时的半秒都有一个单独的图像,但这似乎需要大量内存才能运行,因此崩溃了应用程序,所以我现在必须找到替代方案. 我一直在寻找着色在这里https://developer.apple.com/library/prerelease/ios/do 我正在尝试添加倒计时到我的应用程序,我有动画这个问题.我想要的外观类似于下面显示的iPad倒计时,红色条随着时钟倒计时而增加.

最初我创建了一个图像地图集,每个倒计时的半秒都有一个单独的图像,但这似乎需要大量内存才能运行,因此崩溃了应用程序,所以我现在必须找到替代方案.

我一直在寻找着色在这里https://developer.apple.com/library/prerelease/ios/documentation/GraphicsAnimation/Conceptual/SpriteKit_PG/Sprites/Sprites.html#//apple_ref/doc/uid/TP40013043-CH9,但看不到一种方法来着色精灵的一部分,似乎整个精灵将被改变.

有没有人知道在这里是否可以选择着色,还是有办法减少图像地图集使用的内存？

谢谢

解决方法 你可以使用CAShapeLayer和动画结束动画如下：

更新Xcode 9•Swift 4

定义剩下的时间

let timeleftShapeLayer = CAShapeLayer()let bgShapeLayer = CAShapeLayer()var timeleft: TimeInterval = 60var endTime: Date?var timeLabel =  UILabel()var timer = Timer()// here you create your basic animation object to animate the strokeEndlet strokeIt = CABasicAnimation(keyPath: "strokeEnd")

定义一个创建de UIBezIErPath的方法

startAngle在-90˚和endAngle 270

func drawBgShape() {    bgShapeLayer.path = UIBezIErPath(arcCenter: CGPoint(x: vIEw.frame.mIDX,y: vIEw.frame.mIDY),radius:        100,startAngle: -90.degreesToradians,endAngle: 270.degreesToradians,clockwise: true).cgPath    bgShapeLayer.strokecolor = UIcolor.white.cgcolor    bgShapeLayer.fillcolor = UIcolor.clear.cgcolor    bgShapeLayer.linewidth = 15    vIEw.layer.addSublayer(bgShapeLayer)}func drawTimeleftShape() {    timeleftShapeLayer.path = UIBezIErPath(arcCenter: CGPoint(x: vIEw.frame.mIDX,clockwise: true).cgPath    timeleftShapeLayer.strokecolor = UIcolor.red.cgcolor    timeleftShapeLayer.fillcolor = UIcolor.clear.cgcolor    timeleftShapeLayer.linewidth = 15    vIEw.layer.addSublayer(timeleftShapeLayer)}

添加您的标签

func addTimeLabel() {    timeLabel = UILabel(frame: CGRect(x: vIEw.frame.mIDX-50,y: vIEw.frame.mIDY-25,wIDth: 100,height: 50))    timeLabel.textAlignment = .center    timeLabel.text = timeleft.time    vIEw.addSubvIEw(timeLabel)}

在vIEwDIDload中设置endTime并将CAShapeLayer添加到视图中：

overrIDe func vIEwDIDLoad() {    super.vIEwDIDLoad()    vIEw.backgroundcolor = UIcolor(white: 0.94,Alpha: 1.0)    drawBgShape()    drawTimeleftShape()    addTimeLabel()    // here you define the fromValue,tovalue and duration of your animation    strokeIt.fromValue = 0    strokeIt.tovalue = 1    strokeIt.duration = timeleft    // add the animation to your timeleftShapeLayer    timeleftShapeLayer.add(strokeIt,forKey: nil)    // define the future end time by adding the timeleft to Now Date()    endTime = Date().addingTimeInterval(timeleft)    timer = Timer.scheduledTimer(timeInterval: 0.1,target: self,selector: #selector(updateTime),userInfo: nil,repeats: true)}

更新时间

@objc func updateTime() {    if timeleft > 0 {        timeleft = endTime?.timeIntervalSinceNow ?? 0        timeLabel.text = timeleft.time    } else {        timeLabel.text = "00:00"        timer.invalIDate()    }}

您可以使用此扩展名将度数转换为弧度并显示时间

extension TimeInterval {    var time: String {        return String(format:"%02d:%02d",Int(self/60),Int(ceil(truncatingRemainder(divIDingBy: 60))) )    }}extension Int {    var degreesToradians : CGfloat {        return CGfloat(self) * .pi / 180    }}

Sample project

总结

以上是内存溢出为你收集整理的ios – 如何为倒计时器创建循环进度指示器全部内容，希望文章能够帮你解决ios – 如何为倒计时器创建循环进度指示器所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。