iOS系統(tǒng)中的pop動(dòng)畫引擎的使用

　　iOS可以通過CADisplayLink實(shí)現(xiàn)自定義動(dòng)畫引擎，pop就是基于此實(shí)現(xiàn)的，而且比原生Core Animation更強(qiáng)大好用。譬如當(dāng)ViewController側(cè)滑返回的時(shí)候，系統(tǒng)會(huì)將Core Animation的動(dòng)畫會(huì)停止，而基于CADisplayLink實(shí)現(xiàn)的動(dòng)畫則不會(huì)停止，因而可以實(shí)現(xiàn)類似網(wǎng)易云音樂從播放頁側(cè)滑時(shí)hold住專輯封面圖旋轉(zhuǎn)的效果。

　　八一八魔性的pop

　　1、實(shí)用的宏

　　#define POP_ARRAY_COUNT（x） sizeof（x） / sizeof（x［0］） #define FB_PROPERTY_GET（stype， property， ctype） \ - （ctype）property { \ return （（stype *）_state）-》property; \ } #define FB_PROPERTY_SET（stype， property， mutator， ctype， 。。.） \ - （void）mutator （ctype）value { \ if （value == （（stype *）_state）-》property） \ return; \ （（stype *）_state）-》property = value; \ __VA_ARGS__ \ } #define FB_PROPERTY_SET_OBJ_COPY（stype， property， mutator， ctype， 。。.） \ - （void）mutator （ctype）value { \ if （value == （（stype *）_state）-》property） \ return; \ （（stype *）_state）-》property = ［value copy］; \ __VA_ARGS__ \ }

　　2、判定值的數(shù)據(jù)類型

　　pop定義了支持的值的數(shù)據(jù)類型

　　const POPValueType kPOPAnimatableSupportTypes［10］ = {kPOPValueInteger， kPOPValueFloat， kPOPValuePoint， kPOPValueSize， kPOPValueRect， kPOPValueEdgeInsets， kPOPValueColor， kPOPValueSCNVector3， kPOPValueSCNVector4};

　　通過@encode指令，將給定類型編碼的內(nèi)部字符串與objcType對(duì)比，得到值的數(shù)據(jù)類型

　　static bool FBCompareTypeEncoding（const char *objctype， POPValueType type） { switch （type） { case kPOPValueFloat： return （strcmp（objctype， @encode（float）） == 0 || strcmp（objctype， @encode（double）） == 0 ）; case kPOPValuePoint： return （strcmp（objctype， @encode（CGPoint）） == 0 #if ！TARGET_OS_IPHONE || strcmp（objctype， @encode（NSPoint）） == 0 #endif ）; case kPOPValueSize： return （strcmp（objctype， @encode（CGSize）） == 0 #if ！TARGET_OS_IPHONE || strcmp（objctype， @encode（NSSize）） == 0 #endif ）; case kPOPValueRect： return （strcmp（objctype， @encode（CGRect）） == 0 #if ！TARGET_OS_IPHONE || strcmp（objctype， @encode（NSRect）） == 0 #endif ）; case kPOPValueEdgeInsets： #if TARGET_OS_IPHONE return strcmp（objctype， @encode（UIEdgeInsets）） == 0; #else return false; #endif case kPOPValueAffineTransform： return strcmp（objctype， @encode（CGAffineTransform）） == 0; case kPOPValueTransform： return strcmp（objctype， @encode（CATransform3D）） == 0; case kPOPValueRange： return strcmp（objctype， @encode（CFRange）） == 0 || strcmp（objctype， @encode （NSRange）） == 0; case kPOPValueInteger： return （strcmp（objctype， @encode（int）） == 0 || strcmp（objctype， @encode（unsigned int）） == 0 || strcmp（objctype， @encode（short）） == 0 || strcmp（objctype， @encode（unsigned short）） == 0 || strcmp（objctype， @encode（long）） == 0 || strcmp（objctype， @encode（unsigned long）） == 0 || strcmp（objctype， @encode（long long）） == 0 || strcmp（objctype， @encode（unsigned long long）） == 0 ）; case kPOPValueSCNVector3： #if SCENEKIT_SDK_AVAILABLE return strcmp（objctype， @encode（SCNVector3）） == 0; #else return false; #endif case kPOPValueSCNVector4： #if SCENEKIT_SDK_AVAILABLE return strcmp（objctype， @encode（SCNVector4）） == 0; #else return false; #endif default： return false; } }

　　3、將值的數(shù)據(jù)類型標(biāo)準(zhǔn)化為Vector

　　舉個(gè)CGRect類型的例子：

　　case kPOPValueRect： vec = Vector：：new_cg_rect（［value CGRectValue］）; Vector *Vector：：new_cg_rect（const CGRect &r） { Vector *v = new Vector（4）; v-》_values［0］ = r.origin.x; v-》_values［1］ = r.origin.y; v-》_values［2］ = r.size.width; v-》_values［3］ = r.size.height; return v; }

　　通過Vector的兩個(gè)參數(shù)size_t _count;、CGFloat *_values;將給定的類型抽象出來，實(shí)現(xiàn)解耦。此外還有一個(gè)好處，當(dāng)創(chuàng)建屬性動(dòng)畫為kPOPLayerBounds，但toValue屬性賦值的是一個(gè)NSNumber，得益于_values是數(shù)組指針，并不會(huì)引發(fā)數(shù)組越界導(dǎo)致的crash，只是動(dòng)畫效果不可預(yù)期。

　　4、基于NSRunLoop的動(dòng)畫更新機(jī)制

　　- （void）_scheduleProcessPendingList { // see WebKit for magic numbers， eg http://trac.webkit.org/changeset/166540 static const CFIndex CATransactionCommitRunLoopOrder = 2000000; static const CFIndex POPAnimationApplyRunLoopOrder = CATransactionCommitRunLoopOrder - 1; // lock OSSpinLockLock（&_lock）; if （！_pendingListObserver） { __weak POPAnimator *weakSelf = self; _pendingListObserver = CFRunLoopObserverCreateWithHandler（kCFAllocatorDefault， kCFRunLoopBeforeWaiting | kCFRunLoopExit， false， POPAnimationApplyRunLoopOrder， ^（CFRunLoopObserverRef observer， CFRunLoopActivity activity） { ［weakSelf _processPendingList］; }）; if （_pendingListObserver） { CFRunLoopAddObserver（CFRunLoopGetMain（）， _pendingListObserver， kCFRunLoopCommonModes）; } } // unlock OSSpinLockUnlock（&_lock）; }

　　在主線程RunLoop中添加觀察者，監(jiān)聽了kCFAllocatorDefault、kCFRunLoopBeforeWaiting、kCFRunLoopExit事件，在收到回調(diào)的時(shí)候，處理_pendingList里的動(dòng)畫。

　　5、更新動(dòng)畫的回調(diào)數(shù)組

　　static POPStaticAnimatablePropertyState _staticStates［］ = { /* CALayer */ {kPOPLayerBackgroundColor， ^（CALayer *obj， CGFloat values［］） { POPCGColorGetRGBAComponents（obj.backgroundColor， values）; }， ^（CALayer *obj， const CGFloat values［］） { CGColorRef color = POPCGColorRGBACreate（values）; ［obj setBackgroundColor:color］; CGColorRelease（color）; }， kPOPThresholdColor }， {kPOPLayerBounds， ^（CALayer *obj， CGFloat values［］） { values_from_rect（values， ［obj bounds］）; }， ^（CALayer *obj， const CGFloat values［］） { ［obj setBounds:values_to_rect（values）］; }， kPOPThresholdPoint }， 。。.

　　封裝不同的動(dòng)畫行為，實(shí)現(xiàn)類似模板模式，只需統(tǒng)一調(diào)用，即可更新動(dòng)畫

　　// write value write（obj， currentVec-》data（））;

　　6、動(dòng)畫插值的動(dòng)態(tài)實(shí)現(xiàn)

　　switch （type） { case kPOPAnimationSpring： advanced = advance（time， dt， obj）; break; case kPOPAnimationDecay： advanced = advance（time， dt， obj）; break; case kPOPAnimationBasic： { advanced = advance（time， dt， obj）; computedProgress = true; break; } case kPOPAnimationCustom： { customFinished = ［self _advance:obj currentTime:time elapsedTime:dt］ ？ false ： true; advanced = true; break; } default： break; }

　　可以看出總共有四種動(dòng)畫插值的算法，以kPOPAnimationBasic為例：

　　bool advance（CFTimeInterval time， CFTimeInterval dt， id obj） { // default timing function if （！timingFunction） { （（POPBasicAnimation *）self）.timingFunction = ［CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionDefault］; } // solve for normalized time， aka progresss ［0， 1］ CGFloat p = 1.0f; if （duration 》 0.0f） { // cap local time to duration CFTimeInterval t = MIN（time - startTime， duration） / duration; p = POPTimingFunctionSolve（timingControlPoints， t， SOLVE_EPS（duration））; timeProgress = t; } else { timeProgress = 1.; } // interpolate and advance interpolate（valueType， valueCount， fromVec-》data（）， toVec-》data（）， currentVec-》data（）， p）; progress = p; clampCurrentValue（）; return true; }

　　依照給定的timingFunction，使用POPTimingFunctionSolve計(jì)算貝塞爾曲線的變化率，再通過混合計(jì)算#define MIX（a， b， f） （（a） + （f） * （（b） - （a））），最終得到動(dòng)畫的插值。

　　小結(jié)

　　pop中還有很多有意思的地方，譬如TransformationMatrix里的矩陣操作，這里就暫且不挖WebCore底層了。簡而言之，無論性能（c++混編）、易用、容錯(cuò)，pop都有著作為引擎該有的特性，而它所暴露的和Core Animation相似的接口也讓人極易上手！