https://github.com/jinjiantong/JHChainableAnimations
動(dòng)畫怎么了臊诊?
雖然CAAnimations和UIView的動(dòng)畫功能已經(jīng)十分強(qiáng)大了烁峭,但它們還是在將多組動(dòng)畫串連在一起這個(gè)問題上捉襟見肘,尤其是在改變關(guān)鍵點(diǎn)(anchor points字面意思錨點(diǎn))的時(shí)候。
此外,復(fù)雜的動(dòng)畫可讀性差。
假如我要將myView使用彈簧效果向右移動(dòng)五十個(gè)像素响迂,在移動(dòng)完成時(shí),使用淡入改變myView的背景色:
老方法
[UIViewanimateWithDuration:1.0
delay:0.0
usingSpringWithDamping:0.8
initialSpringVelocity:1.0
options:0 animations:^{CGPointnewPosition = self.myView.frame.origin;
newPosition.x +=50;
self.myView.frame.origin = newPosition;
}completion:^(BOOLfinished) {
[UIViewanimateWithDuration:0.5
delay:0.0
options:UIViewAnimationOptionCurveEaseInanimations:^{
self.myView.backgroundColor= [UIColorpurpleColor];
}completion:nil];
}];
真是夠了细疚。蔗彤。。使用JHChainableAnimations僅僅只要一行代碼疯兼。
新方法(JHChainableAnimationsH欢簟!U蚍馈)
self.myView.moveX(50).spring.thenAfter(1.0).makeBackground([UIColorpurpleColor]).easeIn.animate(0.5);
目前已經(jīng)存在不少的相當(dāng)不錯(cuò)的動(dòng)畫庫(kù)啦鸣,例如:RBBAnimation,DCAnimationKit, 和PMTween。但它們?cè)阪溞蛣?dòng)畫和讀寫代碼的簡(jiǎn)便性上沒有好的表現(xiàn)来氧。
用法
復(fù)制JHChainableAnimations里面的文件添加到你的項(xiàng)目诫给,或?qū)⑾旅娴膬?nèi)容添加到你的Podfile
pod 'JHChainableAnimations', '~> 1.3.0'
然后import下面的頭文件
#import"JHChainableAnimations.h"
這是UIView的分類香拉,所以鏈型動(dòng)畫可以在所有導(dǎo)入了上面頭文件的UIView及其子類上使用。
動(dòng)畫
moveX(x)這類鏈接屬性必須放在view和animate(t)方法間中狂。
以下例子展示了怎樣將一個(gè)對(duì)象尺寸放大兩倍的1秒動(dòng)畫凫碌。
View.makeScale(2.0).animate(1.0);
如果你想在縮放同時(shí)移動(dòng)view,添加另外一個(gè)鏈接屬性胃榕。順序不重要盛险。
View.makeScale(2.0).moveXY(100,50).animate(1.0);//等同于view.moveXY(100,50).makeScale(2.0).animate(1.0);
查看所有的鏈性屬性點(diǎn)擊here
鏈接動(dòng)畫
使用thenAfter(t)函數(shù)來分隔動(dòng)畫函數(shù)實(shí)現(xiàn)連接動(dòng)畫。
以下例子展示了怎么在一個(gè)對(duì)象完成了0.5秒的縮放動(dòng)畫之后完成1秒的移動(dòng)動(dòng)畫勋又。(暫時(shí)還沒有寫demo來試過苦掘,可能具體的動(dòng)畫效果不是這樣)
View.makeScale(2.0).thenAfter(0.5).moveXY(100,50).animate(1.0);
動(dòng)畫效果
想要添加動(dòng)畫效果,在你想要應(yīng)用動(dòng)畫效果的鏈性屬性后調(diào)用效果方法楔壤。
以下例子展示了一個(gè)彈簧效果的的縮放鹤啡。
View.makeScale(2.0).spring.animate(1.0);
如果給同一的鏈性屬性添加相同的動(dòng)畫,第二個(gè)將會(huì)關(guān)閉第一個(gè)蹲嚣。
View.makeScale(2.0).bounce.spring.animate(1.0);//等同于view.makeScale(2.0).spring.animate(1.0);
查看所有的動(dòng)畫效果點(diǎn)擊here
延遲
調(diào)用wait(t)或delay(t)鏈性屬性來
以下例子展示了如何延遲0.5秒執(zhí)行移動(dòng)視圖通話递瑰。
View.moveXY(100,50).wait(0.5).animate(1.0);//等同于view.moveXY(100,50).delay(0.5).animate(1.0);
完成
給UIView的animationCompletion屬性賦值或者調(diào)用animateWithCompletion(t,completion)函數(shù)可在動(dòng)畫完成后運(yùn)行需要的代碼。
View.makeX(0).animateWithCompletion(1.0,JHAnimationCompletion(){
NSLog(@"Animation
Done");
});
等同于:
View.animationCompletion =
JHAnimationCompletion(){
NSLog()@"Animation
Done";
}
View.makeX(1).animate(1.0);
等同于:
View.makeX(0).animate(1.0).animationCompletion
= JHAnimationCompletion() {
Nslog(@"Animation
Done");
}
貝賽爾曲線
你也可以UIBezierPath來設(shè)置view的動(dòng)畫隙畜。調(diào)用bezierPahtForAnimation方法抖部,得到一個(gè)以視圖為位置為起點(diǎn)的貝賽爾曲線。給它添加點(diǎn)议惰、曲線慎颗、直線然后在一個(gè)鏈性屬性上使用。
UIBezierPath*path = [view bezierPathForAnimation];
[path
addLineToPoint:CGPintMake(24,400)];
[paht
addLineToPoint:CGPintMake(300,500)];
View.moveOnPath(path).animate(1.0);
動(dòng)畫效果無法用在貝賽爾曲線路徑上言询。
語意(Semantics不知道怎么翻譯好)
我加入了一個(gè)叫做seconds僅僅是用來展示的鏈性屬性哗总。不管怎樣,給代碼添加一點(diǎn)可讀性(如果你喜歡的話)倍试。
View.makeScale(2.0).thenAfter(0.5).secends.moveX(20).animate(1.0);//view.makeScale(2.0).thenAfter(0.5).moveX(20).animate;
自動(dòng)布局
變形
使用變形類的鏈性屬性。對(duì)于被自動(dòng)布局約束的視圖蛋哭,這些是不錯(cuò)的县习。你不會(huì)與其他鏈性屬性混淆。
viewWithConstraints.transformX(50).transformScale(2).animate(1.0);
動(dòng)畫約束
具有代表性的frames設(shè)置和自動(dòng)布局填充不應(yīng)該混淆谆趾,所以在使用makeConstraint和moveConstraint鏈性屬性的時(shí)候要小心(不要嘗試去縮放視圖躁愿,當(dāng)它具有高寬約束的時(shí)候)。這些屬性應(yīng)該只用于顏色沪蓬、透明度彤钟、圓角鏈性屬性因?yàn)樗鼈儾换赜绊憟D層的位置,因此不回影響約束跷叉。
這些僅僅是為動(dòng)畫約束方便添加的語法結(jié)構(gòu)逸雹。以下代碼將設(shè)置topConstraint的constant為50营搅,隱蔽的驅(qū)動(dòng)動(dòng)畫圖層。
// You have a reference to some
constraint for myView
self.topConstraint = [NSLayoutConstraint...];
...
self.myView.makeConstraint(self.topConstraint,50).animate(1.0);
這種代碼也不能添加動(dòng)畫效果梆砸。
swift中使用
在swift中使用JHChainableAnimaton有一點(diǎn)點(diǎn)的不同转质。每個(gè)鏈性屬性必須在哪名字和參數(shù)之間添加()
// swift code
view.makeScale()(2.0).spring().animate()(1.0);
// is the same as
//
view.makeScale(2.0).spring.animate(1.0);
//
in Objective-C
查看更多https://github.com/jinjiantong/JHChainableAnimations