Autolayout優秀的第三方開源庫

end5 9年前發布 | 71K 次閱讀 iOS開發移動開發 AutoLayout

最近項目開始用純代碼布局整個UI框架, 對于前一段很長時間都是xib+storyboard狂拖控件約束的我來說,每天寫的代碼量劇增…對于sb好還是純代碼好的爭論,可以參考下巧大大的分析.
說到UI適配布局,一般有兩種方法:

frame,利用[UIScreen mainScreen].bounds.size.width/height,一個一個的算出對應frame,結果肯定是OK的,只是過程異常的痛苦,尤其像我這種語文老師教的數學的小學生.囧.
autolayout,相信肯定是主流布局,而且對于UI設計師給我的效果圖,也是很方便我們直接拿來進行約束設值,無須其他任何計算.

這里主要介紹手寫autolayout約束,由于系統提供的api寫起來又臭又長,推薦一個不錯的第三方.
OC版本對應的是Masonry,Swift版本對應的是SnapKit.當然還有其他優秀的autolayout相關第三方,會在結尾給出,感興趣的朋友可以去研究下,LZ主要用Masonry(大愛這種鏈式語法)^_^!

Masonry

Github地址是:Masonry
具體用法github上已經講的很清楚了,可以下載Demo看看栗子的實現,總結一下我在使用過程中了解.

mas_makeConstraints使用最多,做初始約束,只負責新增約束
mas_updateConstraints針對make中的約束做更新,一般不添加新約束,只是對于原約束數值的修改.
mas_remakeConstraints清除之前所有的約束,采用里面設置的最新約束,常用于動畫之后新位置的約束設定
優先級高.priorityHigh,優先級低.priorityLow,通常用于根據條件判斷來設定優先響應哪種約束
multipliedBy(x)= *x,dividedBy(x)= /x

make.edges.mas_equalTo(UIEdgeInsetsMake(10, 10, 10, 10));
// edges就是相當于top-left-bottom-right
// top和left里的offset為正數
// 那么為什么bottom和right里的offset是負數呢? 因為這里計算的是絕對的數值 計算的bottom需要小于sv的底部高度 所以要-10 同理用于right
// 有意思的地方是and和with 其實這兩個函數什么事情都沒做,可以省略的
/* 等價于
 make.top.equalTo(weakSelf.sv).with.offset(10);
 make.left.equalTo(weakSelf.sv).with.offset(10);
 make.bottom.equalTo(weakSelf.sv).with.offset(-10);
 make.right.equalTo(weakSelf.sv).with.offset(-10);
 */

UIScrollView是一個有點特殊的view,對于在里面放其他view,最好的做法是先放一個containerView設置edges相等,然后在此view上添加subview.
模仿系統的UITabBarController的底部View,可以設定個數和間隔:

  - (void)simulateSystemTabBarWithButtonCount:(NSInteger)count withSpace:(CGFloat)space {
    [self.view showPlaceHolder];
    self.view.backgroundColor = [UIColor grayColor];
    NSMutableArray *viewArray = [NSMutableArray arrayWithCapacity:10];

    for (int i = 0; i < count; i++) {
        UIView *view = [UIView new];
        view.backgroundColor = [UIColor colorWithHue:( arc4random() % 256 / 256.0 )
                                          saturation:( arc4random() % 128 / 256.0 ) + 0.5
                                          brightness:( arc4random() % 128 / 256.0 ) + 0.5
                                               alpha:1];;
        [view showPlaceHolder];
        [self.view addSubview:view];
        [viewArray addObject:view];
    }
    UIView *lastView = viewArray.lastObject;
    for (int i = 0; i < count; i++) {
        UIView *view = (UIView *)viewArray[i];
        [view mas_makeConstraints:^(MASConstraintMaker *make) {
            make.bottom.equalTo(view.superview);
            make.height.equalTo(@49);
            make.width.equalTo(lastView);
            if (i == 0) {
                make.left.mas_equalTo(view.superview).offset(space);
            } else {
                UIView *frontView = (UIView *)viewArray[i-1];
                make.left.equalTo(frontView.mas_right).offset(space);
                (i == viewArray.count - 1) ? make.right.mas_equalTo(view.superview).offset(-space) : nil;
            }
        }];
    }
}

以count = 4 和 space =0 為例子

實現動畫時,更新約束后調用layoutIfNeeded
最后,再次強調真的非常好用!!!

SnapKit

Github地址:SnapKit
PS:目前只支持swift1.2版本,在最新的xcode7-swift2.0中會報錯,我在推特上問了作者,他說最近略忙,暫時沒空…囧…有興趣的朋友可以自己改下讓它支持2.0然后pull…我?還在研究中.
這個就不過多舉例了,基本就是跟Masonry一樣,而且我在后面的Demo基本都是用了Snapkit來寫(xcode7上我是拖控件…沒辦法,誰讓還不支持2.0)
舉個栗子->最常見的上下兩個button: