autolayout - sizeClass - Masonry - 4

上一篇實作的是單一的textView的Masonry橫豎屏适配實作，如果在textView上方添加一個固定的button并且也要保持橫豎屏的适配，那該如何？

答案是：用最好的offset屬性！

#import "Masonry.h"
#import "LBProtoFirstViewController.h"

@interface LBProtoFirstViewController ()

@property (nonatomic, strong) UITextView* textView;

@end

@implementation LBProtoFirstViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    UIView* superView = self.view;
    
    UIButton* button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setTitle:@"Invoke ActionSheet" forState:UIControlStateNormal];
    [button setBackgroundColor:[UIColor blueColor]];
    [button setTranslatesAutoresizingMaskIntoConstraints:NO];
    [superView addSubview:button];
    
    self.textView = [UITextView new];
    self.textView.textColor = [UIColor redColor];
    self.textView.font = [UIFont systemFontOfSize:22];
    self.textView.backgroundColor = [UIColor greenColor];
    self.textView.translatesAutoresizingMaskIntoConstraints = NO;
    self.textView.text = @"Even with such a simple example the code needed is quite verbose and quickly !";
    [superView addSubview:self.textView];
    
    CGFloat pitch = 50.0;
    
    [button mas_makeConstraints:^(MASConstraintMaker* make){
    
        make.centerX.mas_equalTo(superView.mas_centerX);
        make.top.equalTo(superView).with.offset(pitch);
        make.bottom.equalTo(button.mas_top).with.offset(-pitch);
        
        make.left.equalTo(superView).with.offset(30);
        make.right.equalTo(superView).with.offset(-30);
        
        make.width.equalTo(self.textView);
    }];
    
    
    [self.textView mas_makeConstraints:^(MASConstraintMaker* make){
  
        make.centerX.mas_equalTo(superView.mas_centerX);
        make.top.equalTo(button.mas_bottom).with.offset(pitch);
        make.bottom.equalTo(superView.mas_bottom).with.offset(-80);
        
        make.width.mas_equalTo(button);
        
    }];
    
}

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
    [super willRotateToInterfaceOrientation:toInterfaceOrientation duration:duration];
}

- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation
{
    [super didRotateFromInterfaceOrientation:fromInterfaceOrientation];
    
}

@end
           

甚至可以更加簡約，因為重複的限制壓根沒有意義（而且重複的限制一旦出錯，就會全錯）

CGFloat pitch = 50.0;
    
    [button mas_makeConstraints:^(MASConstraintMaker* make){
    
        make.centerX.mas_equalTo(superView.mas_centerX);
        make.top.equalTo(superView).with.offset(pitch);
        make.bottom.equalTo(self.textView.mas_top).with.offset(pitch);
        
        make.left.equalTo(superView).with.offset(30);
        make.right.equalTo(superView).with.offset(-30);
        
        make.width.equalTo(self.textView);
    }];
    
    
    [self.textView mas_makeConstraints:^(MASConstraintMaker* make){
  
        make.centerX.mas_equalTo(superView.mas_centerX);
        make.bottom.equalTo(superView.mas_bottom).with.offset(-80);
        
    }];
           

因為上面一個button已經将大多數的限制條件确定，下面的隻是一種無用的重複。

但是注意到一點，兩者之間的距離是一個定值（如果豎屏還可以接受，但是橫屏就間隔太遠了），在螢幕方向的方法裡面：

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
    [super willRotateToInterfaceOrientation:toInterfaceOrientation duration:duration];
    
    CGFloat pitch = 50.0;
    
    BOOL isLandScape = NO;
    UIDeviceOrientation oritation  = [UIDevice currentDevice].orientation;
    isLandScape = ((oritation == UIDeviceOrientationLandscapeLeft) || (oritation == UIDeviceOrientationLandscapeRight));
    
    if (isLandScape)
    {
        //橫屏
        [self.button mas_updateConstraints:^(MASConstraintMaker* make){
            
            make.bottom.equalTo(self.textView.mas_top).with.offset(-pitch);
            
        }];
    }
    else  
    {  
        //豎屏
        [self.button mas_updateConstraints:^(MASConstraintMaker* make){
            
            make.bottom.equalTo(self.textView.mas_top).with.offset(-2*pitch);
            
        }];
    }
}
           

就很好地呈現了自适配了哈！