AutoLayout 浅析动画
1.AutoLayout相關的幾個易混淆的方法
setNeedsLayout
layoutIfNeeded
layoutSubViews
setNeedsUpdateConstraints
updateConstraitsIfNeed
updateConstraints
子視圖在界面上的顯示大概經過了:更新約束-通過約束依賴關系得到具體的frame-展示到界面。上面幾個是和autolayout相關的方法,有必要大概了解一下這些方法具體是怎么用的以及在什么情況下觸發(fā)。
1.[layoutView setNeedsUpdateConstraints]:告訴layoutView需要更新約束,在下次計算或者更新約束會更新約束 2.[layoutView updateConstraintsIfNeeded]:告訴layoutView立即更新約束, 3.updateConstraints:系統(tǒng)更新約束的實際方法總結上面的3點就是,setNeedsUpdateConstraints確保了在將來某一時刻調用updateConstraintsIfNeeded之后會接著調用updateConstraints,從而達到更新view的約束的目的。但是要注意的是,如果僅僅單獨調用2,不一定能夠保證會調用updateConstraints,因為如果view上的約束是沒有變動的且沒有標記需要update的,這時就不會調用updateConstraints。
4.[layoutView setNeedsLayout]:告訴layoutView頁面需要更新,但不立即執(zhí)行 5.[layoutView layoutIfNeeded]:告訴layoutView頁面布局立即更新 6.layoutSubviews:系統(tǒng)重寫布局的實際方法總結以上3點,setNeedsLayout確保了在將來某個時刻通過調用layoutIfNeeded之后會調用系統(tǒng)的layoutSubviews,從而重寫對view重新布局。同樣的如果單獨調用5,不一定能夠保證調用layoutSubviews。[注:筆者寫了個demo發(fā)現(xiàn),調用setNeedsLayout會直接調用layoutSubviews]。如果想要每次都能立即更新布局,那就要把兩個方法一起用,同樣也適用于1和2。
系統(tǒng)調用layoutSubViews時,就會調用updateConstraintsIfNeeded,通過更新約束,用superView到subView的層次順序,來計算frame,反向確定布局。
stackoverflow上有關于上面幾個方法的深入解答并分享了作者的實用經驗:
- 如果僅想要立即改變約束,調用setNeedsLayout
- 如果改變view的一些屬性(如offsets)可能會導致布局的改變,那么調用setNeedsUpdateConstraints,更多的時候后面需要加setNeedsLayout。
- 如果想要立即改變布局,如會形成新的frame,那么需要在調用layoutIfNeeded。
2.AutoLayout與動畫
###[UIView animateWithDuration]方法
傳統(tǒng)的動畫主要是通過計算frame來進行動畫,在autolayout下,主要是利用約束,動畫的本質實際上是從一種約束狀態(tài)變成另一種約束狀態(tài),從而來達到動畫的目的。
這個例子的Demo在這里。
ViewController.h文件中:
@property (weak, nonatomic) IBOutlet UIView *animateView; @property (weak, nonatomic) IBOutlet NSLayoutConstraint *leftConstraint;通過改變leftConstraint的值來實現(xiàn)具體的平移動畫,具體代碼如下:
self.leftConstraint.constant = 200;[UIView animateWithDuration:2 animations:^{[self.view layoutIfNeeded]; }];對于這類簡單動畫,只需要在animation的block中調用layoutIfNeeded即可,從經驗來看,只要調用這個方法即可。
使用Masonry寫動畫
如果你厭倦了蘋果官方的NSLayoutConstraint的繁雜寫法以及VFL的奇怪語法,那么Masonry是個不錯的選擇。
Masonry的官方介紹,它是一個輕量級的布局框架,擁有自己的描述語法,采用優(yōu)雅的鏈式語法封裝自動布局,更加簡單的添加和更新約束,提供了友好的屬性和Debug功能,支持iOS和Mac,最重要的是大大提高了可讀性。
目前Masonry處于維護狀態(tài)(bugfix),原因是它的開發(fā)人員考慮到越來越多的人會用swift,所以開發(fā)人員更專注開發(fā)其swift版本–SnpaKit。這篇文章仍然用Masonry。
用cocoaPods引用Masonry:
pod 'Masonry'Masonry提供了非常優(yōu)雅的屬性和方法:
屬性:MASViewAttribute
Masonry提供的屬性及其對應的NSLayoutAttribute關系如下:
| view.mas_left | NSLayoutAttributeLeft |
| view.mas_right | NSLayoutAttributeRight |
| view.mas_top | NSLayoutAttributeTop |
| view.mas_bottom | NSLayoutAttributeBottom |
| view.mas_leading | NSLayoutAttributeLeading |
| view.mas_trailing | NSLayoutAttributeTrailing |
| view.mas_width | NSLayoutAttributeWidth |
| view.mas_height | NSLayoutAttributeHeight |
| view.mas_centerX | NSLayoutAttributeCenterX |
| view.mas_centerY | NSLayoutAttributeCenterY |
| view.mas_baseline | NSLayoutAttributeBaseline |
我們可以很方便的獲得到屬性。
常見用法示例(引自官方文檔)
edges
//讓當前view的top bottom left right和view2完全一樣,表現(xiàn)為和view2大小一樣 make.edges.equalTo(view2);// 讓當前view進行這樣的約束:top = superview.top + 5, left = superview.left + 10,bottom = superview.bottom - 15, right = superview.right - 20 make.edges.equalTo(superview).insets(UIEdgeInsetsMake(5, 10, 15, 20))size
//讓當前view的size相對于titleLabel的size要greater than or equal to make.size.greaterThanOrEqualTo(titleLabel)// 讓當前view進行約束:width = superview.width + 100, height = superview.height - 50 make.size.equalTo(superview).sizeOffset(CGSizeMake(100, -50))center
// 當前view的中心點和button1相等 make.center.equalTo(button1)// 當前view約束:centerX = superview.centerX - 5, centerY = superview.centerY + 10 make.center.equalTo(superview).centerOffset(CGPointMake(-5, 10))還可以將屬性連起來寫:
// 左右低對superview對齊,高和otherView對齊 make.left.right.and.bottom.equalTo(superview); //接近于自然語言了 make.top.equalTo(otherView);三個方法
1.mas_makeConstraints
給view添加約束的方法,
[masView mas_makeConstraints:^(MASConstraintMaker *make) {make.leading.equalTo(self.view).offset(20);make.top.equalTo(self.view).offset(200);make.width.offset(80);make.height.offset(80); }]; 2.mas_updateConstraints
更新約束的方法,如果view已經使用了mas_makeConstraints這個方法后,在更新約束時需使用這個方法。
3.mas_remakeConstraints
重新添加約束,它是先將view上的約束全部uninstall掉,然后添加約束。
比較友好的Debug(引自官方文檔)
在添加約束的時候避免不了的會遇到約束錯誤,蘋果原生的報錯真的很不友好,讓人看不懂,如下:
Unable to simultaneously satisfy constraints.....blah blah blah.... ("<NSLayoutConstraint:0x7189ac0 V:[UILabel:0x7186980(>=5000)]>","<NSAutoresizingMaskLayoutConstraint:0x839ea20 h=--& v=--& V:[MASExampleDebuggingView:0x7186560(416)]>","<NSLayoutConstraint:0x7189c70 UILabel:0x7186980.bottom == MASExampleDebuggingView:0x7186560.bottom - 10>","<NSLayoutConstraint:0x7189560 V:|-(1)-[UILabel:0x7186980] (Names: '|':MASExampleDebuggingView:0x7186560 )>" )Will attempt to recover by breaking constraint <NSLayoutConstraint:0x7189ac0 V:[UILabel:0x7186980(>=5000)]>光UILabel:0x7186980可能也會非上一點時間找具體的Label是哪個。
Masonry重寫了NSLayoutConstraint的(NSString *)description的方法,使得一起看起來較為友好了:
Unable to simultaneously satisfy constraints......blah blah blah.... ("<NSAutoresizingMaskLayoutConstraint:0x8887740 MASExampleDebuggingView:superview.height == 416>","<MASLayoutConstraint:ConstantConstraint UILabel:messageLabel.height >= 5000>","<MASLayoutConstraint:BottomConstraint UILabel:messageLabel.bottom == MASExampleDebuggingView:superview.bottom - 10>","<MASLayoutConstraint:ConflictingConstraint[0] UILabel:messageLabel.top == MASExampleDebuggingView:superview.top + 1>" )Will attempt to recover by breaking constraint <MASLayoutConstraint:ConstantConstraint UILabel:messageLabel.height >= 5000>可以具體是UILabel:messageLabel.height出了問題。
具體Demo
在ViewController.m中,先對masView進行約束:
masView = [UIView new]; masView.backgroundColor = [UIColor redColor]; [self.view addSubview:masView]; [masView mas_makeConstraints:^(MASConstraintMaker *make) {make.leading.equalTo(self.view).offset(20);//距離self.view左側20make.top.equalTo(self.view).offset(200);//距離self.view頂部200make.width.offset(80);//寬度80make.height.offset(80);//高度80 }];動畫的實現(xiàn)代碼:
[masView mas_updateConstraints:^(MASConstraintMaker *make) {make.width.and.height.offset(100);make.leading.equalTo(self.view).offset(100); }];[UIView animateWithDuration:3 animations:^{[self.view layoutIfNeeded]; }];先用mas_updateConstraints更新masView的約束,然后調用animateWithDuration方法。
通過用masonry實現(xiàn)的動畫可讀性更高,利于維護,且能實現(xiàn)比較多的動畫效果。
3.實際經驗
實踐出真知,需要通過實際項目來進行實踐驗證。我也總結項目過程中的一些實際經驗:
- 不能有任何一個約束的warning。對于約束的warning是要引起最夠重視的,我們發(fā)現(xiàn)在iOS8下約束的warning沒有引起crash,但是在iOS6上卻crash。這個原因應該是蘋果開發(fā)autolayout的歷史變遷所致。所以當我們發(fā)現(xiàn)約束有warning的時候一定要改正確,項目中保證0warning。
- 復雜頁面的約束出現(xiàn)較多約束錯誤時,可以先清掉所有的約束,重新加約束。有時候發(fā)現(xiàn)約束越改越混亂,不如清掉所有的約束重新理清思路加約束。
- 動畫不一定非要是約束動畫。我們知道autolayout到最終都是轉化為對應的frame,所以frame是關鍵點。當一個視圖(superView)布局好了之后,它的subView實際上仍然可以用傳統(tǒng)的frame進行動畫,不一定非要寫約束。但是這個方法是不倡導的,既然用了約束就該將約束進行到底。
- 犧牲了部分的效率。約束在轉化為具體的frame過程中必然會產生性能上的問題,我們發(fā)現(xiàn)在iPhone4的iOS6上面表現(xiàn)的效果并不是很好,但是隨著硬件的越來越強大,這個性能問題最終會被忽略掉的。
對于一般應用類的app上的動畫效果,使用上述方法已經足夠。方法最夠的簡單,需要理解的是其中的約束思想。文中用到的demo已經上傳到這里。
通過這三篇關于AutoLayout的介紹文章,相信足以解決AutoLayout這個問題了。
創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎勵來咯,堅持創(chuàng)作打卡瓜分現(xiàn)金大獎
總結
以上是生活随笔為你收集整理的AutoLayout 浅析动画的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: spring集成struts2
- 下一篇: 梦到收麦子玉米是什么意思