前言
看到這個標題你可能會覺得“這不是很簡單嗎阵苇？像下面這么一寫就完了唄”
UIView.animate(withDuration: 0.25) {
self.tableView.setContentOffset(CGPoint(x: 0, y: 500), animated: false)
}
不不不，如果你覺得就這么簡單的話說明你還是太年輕了悴晰。這樣寫你的列表在滾動的一開始上面的cell就消失了，這種效果是完全過不了產(chǎn)品和視覺小姐姐的像素眼。
為了實現(xiàn)自定義滾動動效我們可以使用CADisplayLink來實現(xiàn)瓤介，至于為什么不用其他timer相信大家可以自己百度了解。
當然如果你并不想那么麻煩的自己寫的話可以使用Facebook出品的Pop動畫庫赘那，它也是基于CADisplayLink實現(xiàn)的刑桑。由于UIScrollView的滾動原理，我們可以用POPBasicAnimation設置UIScrollView的bounds屬性動畫即可募舟。
Demo
實現(xiàn)
Animator
首先我們先實現(xiàn)實際動畫的類ScrollViewAnimator祠斧。
private class ScrollViewAnimator {
weak var scrollView: UIScrollView?
let timingFunction: ScrollTimingFunction
var closure: (() -> Void)?
//動畫開始時間
var startTime: TimeInterval = 0
//動畫初始的contentOffset
var startOffset: CGPoint = .zero
//動畫目標的contentOffset
var destinationOffset: CGPoint = .zero
//動畫時長
var duration: TimeInterval = 0
//動畫已運行時長
var runTime: TimeInterval = 0
var timer: CADisplayLink?
init(scrollView: UIScrollView, timingFunction: ScrollTimingFunction) {
self.scrollView = scrollView
self.timingFunction = timingFunction
}
func setContentOffset(_ contentOffset: CGPoint, duration: TimeInterval) {
guard let scrollView = scrollView else {
return
}
//設置需要的屬性
startTime = Date().timeIntervalSince1970
startOffset = scrollView.contentOffset
destinationOffset = contentOffset
self.duration = duration
runTime = 0
guard self.duration > 0 else {
scrollView.setContentOffset(contentOffset, animated: false)
return
}
if timer == nil {
timer = CADisplayLink(target: self, selector: #selector(animtedScroll))
//把timer加入到common的runloop中
timer?.add(to: .main, forMode: .common)
}
}
@objc
func animtedScroll() {
guard let timer = timer else { return }
guard let scrollView = scrollView else { return }
//由于CADisplayLink每次回調(diào)的時間不固定突琳，所以使用它自己記錄的回調(diào)時間來增加運行時長
runTime += timer.duration
if runTime >= duration {
//如果運行時長超過動畫時長說明動畫需要結束了
scrollView.setContentOffset(destinationOffset, animated: false)
timer.invalidate()
self.timer = nil
closure?()
return
}
var offset = scrollView.contentOffset
offset.x = timingFunction.compute(CGFloat(runTime), startOffset.x, destinationOffset.x - startOffset.x, CGFloat(duration))
offset.y = timingFunction.compute(CGFloat(runTime), startOffset.y, destinationOffset.y - startOffset.y, CGFloat(duration))
scrollView.setContentOffset(offset, animated: false)
}
}
UIScrollView拓展
我們用OC的runtime知識動態(tài)為分類添加屬性方便使用
public extension UIScrollView {
private struct AssociatedKeys {
static var animator: String = "animator"
}
private var animator: ScrollViewAnimator? {
set {
objc_setAssociatedObject(self, &AssociatedKeys.animator, newValue, .OBJC_ASSOCIATION_RETAIN_NONATOMIC)
}
get {
return objc_getAssociatedObject(self, &AssociatedKeys.animator) as? ScrollViewAnimator
}
}
func setContentOffset(_ contentOffset: CGPoint, duration: TimeInterval, timingFunction: ScrollTimingFunction = .linear, completion: (() -> Void)? = nil) {
if animator == nil {
animator = ScrollViewAnimator(scrollView: self, timingFunction: timingFunction)
}
animator!.closure = { [weak self] in
guard let strongSelf = self else { return }
DispatchQueue.main.async {
strongSelf.animator = nil
}
completion?()
}
animator!.setContentOffset(contentOffset, duration: duration)
}
}
ScrollTimingFunction枚舉
動畫緩沖函數(shù)的實現(xiàn)可以參考http://robertpenner.com/easing/猛计。具體實現(xiàn)例子在Demo中
參考
http://robertpenner.com/easing/
https://blog.csdn.net/S_clifftop/article/details/89490422
https://zsisme.gitbooks.io/ios-/content/index.html
