前言
在剛開始學習iOS開發時，我制作了OneClock，它除了使用最多的翻頁時鐘效果，還擁有最常見的時鐘樣式。
今天用一個很簡單的方式為大家展示如何實現時鐘效果。
1.分別創建時針、分針、秒針
2.隨著時間改變進行對應旋轉
一、創建時針、分針、秒針
分別創建三個指針的同時，我們初始化了他們的位置，也就是在12點的方向。
這里我只貼出創建的代碼，在使用的過程中可以根據需要進行放置。其中hourLength、minuteLength、secondLength分別代表三個指針的長度，在實際使用中根據頁面情況進行調整大小。
//創建一個時針VIEW let hourView:UIView! = UIView.init() hourView.center = self.view.center hourView.layer.bounds = CGRect(x: 0, y: 0, width: 2, height: hourLength) hourView.backgroundColor = PolarTheme.bottomColor hourView.layer.anchorPoint = CGPoint(x: 1, y: 1) hourView.layer.cornerRadius = 1 self.hourView = hourView self.view.addSubview(self.hourView) //創建一個分針VIEW let minuteView:UIView! = UIView.init() minuteView.center = self.view.center minuteView.layer.bounds = CGRect(x: 0, y: 0, width: Int(1.5), height: Int(minuteLength)) minuteView.backgroundColor = PolarTheme.bottomColor minuteView.layer.anchorPoint = CGPoint(x: 1, y: 1) self.minuteView = minuteView self.view.addSubview(self.minuteView) //創建一個秒針VIEW let secondView:UIView! = UIView.init() secondView.center = self.view.center secondView.layer.bounds = CGRect(x: 0, y: 0, width: 1, height: secondLength) secondView.backgroundColor = PolarTheme.topColor secondView.layer.anchorPoint = CGPoint(x: 1, y: 1) self.secondView = secondView self.view.addSubview(self.secondView)
二、時間跟蹤器
創建指針只是時鐘的第一步，之后我們需要用時間來改變對應的指針位置。所以在創建指針之后，我們需要緊跟著一個時間監視器，通過move函數來調整指針方向。
先定義Timer
var timer:Timer!
再為Timer綁定函數，時間間隔為0.2秒執行一次move
timer = Timer.scheduledTimer(timeInterval: 0.2,target:self,selector:#selector(PolarViewController.move),userInfo:nil,repeats:true)
三、改變指針位置
實現原理是，先在函數move()中定義每個指針旋轉的大小，再進行周期性刷新位置。
func move(){ var angleSecond:CGFloat = CGFloat(Double.pi * 2/60.0) var angleMinute:CGFloat = CGFloat(Double.pi * 2/60.0) var angleHour:CGFloat = CGFloat(Double.pi * 2/12.0) //當前時間 let date = Date() let calendar = NSCalendar.current let secondInt = CGFloat(calendar.component(.second, from: date)) let minuteInt = CGFloat(calendar.component(.minute, from: date)) let hourInt = CGFloat(calendar.component(.hour, from: date)) //計算旋轉角度 angleSecond = angleSecond * secondInt angleMinute = angleMinute * minuteInt + angleSecond/60.0 angleHour = angleHour * hourInt + angleMinute/60.0 //保持中心點 self.secondView.center = self.view.center self.minuteView.center = self.view.center self.hourView.center = self.view.center //旋轉各自的角度 self.secondView.transform = CGAffineTransform(rotationAngle: angleSecond) self.minuteView.transform = CGAffineTransform(rotationAngle: angleMinute) self.hourView.transform = CGAffineTransform(rotationAngle: angleHour)}四、手機旋轉后的頁面刷新
最后增加在旋轉模式下的自動刷新，幫助修正顯示。
override func willRotate(to toInterfaceOrientation: UIInterfaceOrientation, duration: TimeInterval) { move()}總結
以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作具有一定的參考學習價值，如果有疑問大家可以留言交流，謝謝大家對VEVB武林網的支持。
新聞熱點
疑難解答
