IOS UI基礎06，iosui06

IOS UI基礎06，iosui06

• Autoresizing

  • 1.Autoresizing四周的四根線的作用:

    • 只要勾選上某一根, 那麼當前控制項距離父控制項的距離就是固定的, 當前是多少, 以後永遠都是多少

  • 2.Autoresizing中間兩條線的作用:

    • 只要勾選上水平方向的線, 那麼當前控制項的寬度就會隨著父控制項的寬度等比展開
    • 只要勾選上垂直方向的線, 那麼當前控制項的高度就會隨著父控制項的高度等比展開

  • 3.無論是將子控制項固定在父控制項的某一個位置 還是讓子控制項隨著父控制項的寬高的變化而變化

  • 4 都是父子關係,所以Autoresizing只能約束父子控制項之間的關係, 不能約束兄弟控制項之間的關係

  • 屬性

     @property(nonatomic) UIViewAutoresizing autoresizingMask; // simple resize. default is UIViewAutoresizingNone// 設定子控制項的autoresizing 注意: 代碼中的上下左右和Storyboard中的是相反的 Storyboard中勾選上左邊, 就代表當前控制項和父控制項的左邊的距離是固定的 而在代碼中如果寫上FlexibleLeftMargin, 就代表當前控制項和父控制項的左邊是可展開的 換句話說就是: 如果設定了FlexibleLeftMargin, 就代表著右邊是固定的 UIViewAutoresizingFlexibleLeftMargin // 左邊可以伸縮 UIViewAutoresizingFlexibleRightMargin // 右邊可以伸縮 UIViewAutoresizingFlexibleTopMargin // 頂部可以伸縮 UIViewAutoresizingFlexibleBottomMargin // 底部可以伸縮 // 以下兩個和Storyboard中的是一樣的 UIViewAutoresizingFlexibleWidth // 寬度可以伸縮 UIViewAutoresizingFlexibleHeight // 高度可以伸縮

• Autolayout

  • 1.約束

    每在Storyboard中添加一個設定(autolayout的設定), 就代表添加一個約束

  • 2.錯誤(紅色箭頭)

    如果看到Storyboard中有紅色的箭頭, 代資料表條件約束有錯誤注意: 約束有錯誤, 不代表運行會錯誤, 約束有錯誤同樣可以運行注意: 紅色箭頭是程式員必須解決的

    • 3.為什麼會有約束錯誤?
      • 3.1缺少約束
        • autolayout的本質和frame差不多
        • 如果通過frame來設定一個控制項, 必須設定這個控制項的x/y/w/h, 控制項才能按照我們的需求顯示
        • 如果是通過autolayout來設定一個控制項, 也必須設定這個控制項的x/y/w/h, 控制項才能按照我們的需求顯示
        • 也就是說, 如果說x/y/w/h只要有一個沒有設定都會報錯, 就是缺少約束
      • 3.2約束衝突
        • 約束可以重複添加
        • 例如先約束寬度等於100, 又添加一個約束, 約束寬度等200, 那麼就會報錯

  • 4.注意

    • 距離頂部有20 == 相當於設定了Y
    • 距離左邊有20 == 相當於設定了x

  • 5.警告

    • 如果看到Storyboard中有黃色的箭頭, 就是警告
    • 代表著當前控制項預覽的位置或者尺寸和我們約束的位置尺寸不一樣
    • 注意:黃金警告並不會影響我們運行
    • 注意:黃色箭頭, 程式員可以忽略

    #warning 注意點: 如果通過代碼來設定Autolayout約束, 那麼必須先禁用Autoresizing    redView.translatesAutoresizingMaskIntoConstraints = NO;     Item == first item     attribute == first item需要設定的約束類型     relatedBy == Relatio(等於)     toItem ==  Second item     attribute == Second item的約束類型     multiplier == 乘以     constant == 加上多少    // 2.1寬度    NSLayoutConstraint *width = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:kNilOptions multiplier:1.0 constant:100.0];    // 將約束添加給自己    [redView addConstraint:width];

• VFL

      // 1.禁止紅色View的Autgoresizing  blueVeiw.translatesAutoresizingMaskIntoConstraints = NO;  redVeiw.translatesAutoresizingMaskIntoConstraints = NO;  // 2.利用VFL添加約束  /*   VisualFormat: VFL語句   options: 對齊等   metrics: VFL語句中使用到的一些變數   views: VFL語句中使用到的一些控制項   */  // 3.1設定藍色  // 3.1.1水平方向  NSArray *blueHCos = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[blueVeiw]-20-|" options:kNilOptions metrics:nil views:@{@"blueVeiw":blueVeiw}];  [self.view addConstraints:blueHCos];  // 3.1.2垂直方向  NSArray *blueVCos = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[blueVeiw(==50)]" options:kNilOptions metrics:nil views:@{@"blueVeiw":blueVeiw}];   [self.view addConstraints:blueVCos];

• Masonry架構

  ```objc

   //define this constant if you want to use Masonry without the 'mas_' prefixdefine MAS_SHORTHAND// 只要添加這個宏,就可以去掉Masonry架構中對象訪問對象屬性前面的mas_屬性, 和方法前的mas_首碼// 例如添加前的寫法 make.left.equalTo(self.view.mas_left).with.offset(20);// 例如添加後的寫法make.left.equalTo(self.view.left).with.offset(20);//define this constant if you want to enable auto-boxing for default syntaxdefine MAS_SHORTHAND_GLOBALS// 只要添加上這個宏, 給equalTo傳遞參數的時候, 就可以直接傳遞基礎資料型別 (Elementary Data Type) ,系統會自動封裝// 如果沒有添加上面這個宏, 那麼給equalTo傳遞參數的時候, 必須傳遞對象// 如果要傳遞基礎資料型別 (Elementary Data Type)必須使用mas_equalTo// 只需要在匯入Masonry.h之前, 添加上一上兩個宏, 就可以簡化代碼UIView *blueVeiw = [[UIView alloc] init];blueVeiw.backgroundColor = [UIColor blueColor];[self.view addSubview:blueVeiw];self.blueVeiw = blueVeiw;UIView *redVeiw = [[UIView alloc] init];redVeiw.backgroundColor = [UIColor redColor];[self.view addSubview:redVeiw];// 2.禁止紅色View的Autgoresizing blueVeiw.translatesAutoresizingMaskIntoConstraints = NO; redVeiw.translatesAutoresizingMaskIntoConstraints = NO;// 3.添加藍色的約束 [blueVeiw makeConstraints:^(MASConstraintMaker *make) {  make.left.equalTo(self.view.left).offset(20);  make.right.equalTo(self.view.right).offset(-20);  make.top.equalTo(self.view.top).offset(20);  make.height.equalTo(50);}];// 4.添加紅色的約束 [redVeiw makeConstraints:^(MASConstraintMaker *make) {  make.top.equalTo(blueVeiw.bottom).offset(20);  make.height.equalTo(blueVeiw.height);  make.right.equalTo(blueVeiw.right);  make.width.equalTo(blueVeiw.width).multipliedBy(0.5);

  }];

  //注意: 在Storyboard中約束是可以重複添加的, 通過Masonry添加約束也是可以重複的, 要注意重複添加導致的錯誤和衝突// 使用makeConstraints, 每次都會添加新的約束, 也就是會導致重複添加// [self.blueVeiw makeConstraints:^(MASConstraintMaker *make) {// make.height.equalTo(100);    }];// 要更新約束使用updateConstraints// updateConstraints特點: 如果沒有設定過, 就添加一個新的 // 如果已經設定過了, 就更新以前設定的那一個 [self.blueVeiw updateConstraints:^(MASConstraintMaker *make) {  make.height.equalTo(100); }];

// 清空約束 remakeConstraints[self.blueVeiw remakeConstraints:^(MASConstraintMaker *make) {    }];