Masonry使用注意篇

Masonry使用注意篇

簡要less

自動佈局最重要的是約束:UI元素間關係的數學表達式。約束包括尺寸、由優先級和閾值管理的相對位置。它們是添加劑,可能致使約束衝突 、約束不足形成佈局沒法肯定 。這兩種狀況都會產生異常。ide

使用前:AutoLayout關於更新的幾個方法的區別

  • setNeedsLayout:告知頁面須要更新,可是不會馬上開始更新。執行後會馬上調用layoutSubviews。
  • layoutIfNeeded:告知頁面佈局馬上更新。因此通常都會和setNeedsLayout一塊兒使用。若是但願馬上生成新的frame須要調用此方法,利用這點通常佈局動畫能夠在更新佈局後直接使用這個方法讓動畫生效。
  • layoutSubviews:系統重寫佈局
  • setNeedsUpdateConstraints:告知須要更新約束,可是不會馬上開始
  • updateConstraintsIfNeeded:告知馬上更新約束
  • updateConstraints:系統更新約束

使用

1. 基本使用佈局

  • mas_makeConstraints:添加約束
  • mas_updateConstraints:更新約束、亦可添加新約束
  • mas_remakeConstraints:重置以前的約束動畫

  • multipler屬性表示約束值爲約束對象的乘因數, dividedBy屬性表示約束值爲約束對象的除因數,可用於設置view的寬高比ui

    // 進行屏幕的適配的時候,每每須要根據屏幕寬度來適配一個相應的高度,在此推薦使用以下約束的方式來進行控件的適配
    [self.topView addSubview:self.topInnerView];
    [self.topInnerView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.height.equalTo(self.topView.mas_height).dividedBy(3);
        make.width.and.height.lessThanOrEqualTo(self.topView);
        make.width.and.height.equalTo(self.topView).with.priorityLow();
        make.center.equalTo(self.topView);
    }];
  • priorityLow()設置約束優先級
  • #define MAS_SHORTHAND_GLOBALS使用全局宏定義,可使equalTo等效於mas_equalTo
  • #define MAS_SHORTHAND使用全局宏定義, 能夠在調用masonry方法的時候不使用mas_前綴
// 這裏注意到一個地方,就是當使用了這個全局宏定義以後,發現能夠有個類`NSArray+MASAdditions.h`,看了以後發現能夠
self.buttonViews = @[ raiseButton, lowerButton, centerButton ];
// 以後能夠在updateConstraints 方法中
- (void)updateConstraints {
   [self.buttonViews updateConstraints:^(MASConstraintMaker *make) {
        make.baseline.equalTo(self.mas_centerY).with.offset(self.offset);
    }];
    [super updateConstraints];  
}
  • 動態修改視圖約束:
    // 建立視圖約束
    [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
          self.animatableConstraint = make.edges.equalTo(superview).insets(paddingInsets).priorityLow();
    ]];
    // 更改約束 (另外一處方法中)
    UIEdgeInsets paddingInsets = UIEdgeInsetsMake(padding, padding, padding, padding);
    self.animatableConstraint.insets = paddingInsets;
    [self layoutIfNeeded];
  • debug模式:
    // 對某個view添加key值
    greenView.mas_key = @"greenView";
    // 或者以下順序
    MASAttachKeys(greenView, redView, blueView, superview);
    // 一樣的對每條約束亦能夠添加key
    make.height.greaterThanOrEqualTo(@5000).key(@"ConstantConstraint");
  • preferredMaxLayoutWidth: 多行label的約束問題
// 已經確認好了位置
// 在layoutSubviews中確認label的preferredMaxLayoutWidth值
- (void)layoutSubviews {
    [super layoutSubviews];
    // 你必須在 [super layoutSubviews] 調用以後,longLabel的frame有值以後設置preferredMaxLayoutWidth
    self.longLabel.preferredMaxLayoutWidth = self.frame.size.width-100;
    // 設置preferredLayoutWidth後,須要從新佈局
    [super layoutSubviews];
}
  • scrollView使用約束的問題:原理經過一個contentView來約束scrollView的contentSize大小,也就是說以子控件的約束條件,來控制父視圖的大小
// 1. 控制scrollView大小(顯示區域)
[self.scrollView makeConstraints:^(MASConstraintMaker *make) {
     make.edges.equalTo(self.view);
}];
// 2. 添加一個contentView到scrollView,而且添加好約束條件
[contentView makeConstraints:^(MASConstraintMaker *make) {
     make.edges.equalTo(self.scrollView);
     // 注意到此處的寬度約束條件,這個寬度的約束條件是比添加項
     make.width.equalTo(self.scrollView);
}];
// 3. 對contentView的子控件作好約束,達到能夠控制contentView的大小
  • 新方法:2個或2個以上的控件等間隔排序
/**
 *  多個控件固定間隔的等間隔排列,變化的是控件的長度或者寬度值
 *
 *  @param axisType        軸線方向
 *  @param fixedSpacing    間隔大小
 *  @param leadSpacing     頭部間隔
 *  @param tailSpacing     尾部間隔
 */
- (void)mas_distributeViewsAlongAxis:(MASAxisType)axisType 
                    withFixedSpacing:(CGFloat)fixedSpacing l
                          eadSpacing:(CGFloat)leadSpacing 
                         tailSpacing:(CGFloat)tailSpacing;

/**
 *  多個固定大小的控件的等間隔排列,變化的是間隔的空隙
 *
 *  @param axisType        軸線方向
 *  @param fixedItemLength 每一個控件的固定長度或者寬度值
 *  @param leadSpacing     頭部間隔
 *  @param tailSpacing     尾部間隔
 */
- (void)mas_distributeViewsAlongAxis:(MASAxisType)axisType 
                 withFixedItemLength:(CGFloat)fixedItemLength 
                         leadSpacing:(CGFloat)leadSpacing 
                         tailSpacing:(CGFloat)tailSpacing;

使用方法很簡單,由於它是NSArray的類擴展:spa

//  建立水平排列圖標 arr中放置了2個或連個以上的初始化後的控件
//  alongAxis 軸線方向   固定間隔     頭部間隔      尾部間隔
[arr mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedSpacing:20 leadSpacing:5 tailSpacing:5];
[arr makeConstraints:^(MASConstraintMaker *make) {
       make.top.equalTo(@60);
       make.height.equalTo(@60);
}];

2. 注意事項debug

  • 約束視圖對象只有在被addSubview以後,才能給視圖添加約束
  • 當你的全部約束都在 updateConstraints 內調用的時候,你就須要在此調用此方法,由於 updateConstraints方法是須要觸發的
// 調用在view 內部,而不是viewcontroller
+ (BOOL)requiresConstraintBasedLayout {
    return YES;
}

/**
 *  蘋果推薦 約束 增長和修改 放在此方法種
 */
- (void)updateConstraints {
    [self.growingButton updateConstraints:^(MASConstraintMaker *make) {
        make.center.equalTo(self);
        make.width.equalTo(@(self.buttonSize.width)).priorityLow();
        make.height.equalTo(@(self.buttonSize.height)).priorityLow();
        make.width.lessThanOrEqualTo(self);
        make.height.lessThanOrEqualTo(self);
    }];
    //最後記得回調super方法
    [super updateConstraints];
}
  • 若是想要約束變換以後實現動畫效果,則須要執行以下操做
    // 通知須要更新約束,可是不當即執行
    [self setNeedsUpdateConstraints];
    // 當即更新約束,以執行動態變換
    // update constraints now so we can animate the change
    [self updateConstraintsIfNeeded];
    // 執行動畫效果, 設置動畫時間
    [UIView animateWithDuration:0.4 animations:^{
       [self layoutIfNeeded];
    }];
相關文章
相關標籤/搜索