UIView关联Xib文件并可用AutoLayout

UIView关联Xib文件并可用AutoLayout

看了很多教程基本都是复制粘贴，未测试就发出来的，自己测试了一个可以用的写出来

下面的内容可以看可以不看，说说看到的几个复制粘贴出来的文章，导致的问题

• 通过frame的方式，添加子View到self上，无法实现当前xib内部subView对父视图的自适应
• 通过将当前xib里面的最外层view，连接一个IBOutlet的方式，也无法实现自适应

运行环境

• iOS7.0以上

开发环境

• Xcode7.2.1 (7.3是个大坑逼，不信你试试自动补全)

解决办法

1. 创建自定义View

   File -> New -> File

   选择iOS分类下的Source下面的Cocoa Touch Class, 点击Next

   Class输入自定义的View的类名例如CustomView, Subclass of 输入 UIView, 此时下方的Also create XIB file是灰色的无法勾选 (其余的选项自己看吧), 点击Next

   勾选下方的Targets 对应到当前项目(如果未勾选), Create

2. 创建Xib文件

   File -> New -> File

   选择iOS分类下的User Interface下面的View, 点击Next

   Save As中输入Xib的名字，跟上面的类名一致, 后缀为xib, 例如CustomView.xib (后缀可以不输入)

   勾选下方的Targets 对应到当前项目(如果未勾选), Create

3. 关联Xib和CustomView类

进入CustomView.xib中, 点击左侧的 File's Owner 选择右边的 Custom Class 输入 CustomView

4. 自定义CustomView的初始化方法

CustomView.h

  #import 

  @interface CustomView : UIView

  @end

CustomView.m

  #import "CustomView.h"

  @implementation CustomView
  
  - (instancetype)initWithCoder:(NSCoder *)aDecoder
  {
    if (self = [super initWithCoder:aDecoder]) {
          
      // 先添加View
      UIView *view = [[NSBundle mainBundle] loadNibNamed:NSStringFromClass(self.class) owner:self options:nil].firstObject;
      [self addSubview:view];
              
      // 再添加约束
      view.translatesAutoresizingMaskIntoConstraints = NO;
      self.translatesAutoresizingMaskIntoConstraints = NO;
      [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeLeft multiplier:1.0 constant:0]];
      [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeRight multiplier:1.0 constant:0]];
      [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTop multiplier:1.0 constant:0]];
      [self addConstraint:[NSLayoutConstraint constraintWithItem:view attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0]];
    }
  return self;
}

添加完之后

5. 进入Main.storyboard中添加当前自定义的CustomView

6. 去自定义的Xib中添加几个视图，测试一波

   上面5中如果在sb中改变上图的CustomView的背景色，是不起作用的，因为在CustomView.xib中被覆盖成默认的whiteColor了

7. OK测试我们的运行结果

---

Over 搞定 UIView + XIB + AutoLayout

如果写的不对或者有问题的地方，欢迎大家在评论处指正，相互交流

最后附上自己写的Demo MSBaseCustomView

Demo里面的MSBaseCustomView，可以直接被继承使用