UIView关联Xib文件并可用AutoLayout
看了很多教程基本都是复制粘贴,未测试就发出来的,自己测试了一个可以用的写出来
下面的内容可以看可以不看,说说看到的几个复制粘贴出来的文章,导致的问题
- 通过
frame
的方式,添加子View
到self
上,无法实现当前xib
内部subView
对父视图的自适应 - 通过将当前
xib
里面的最外层view
,连接一个IBOutlet
的方式,也无法实现自适应
运行环境
- iOS7.0以上
开发环境
- Xcode7.2.1 (7.3是个大坑逼,不信你试试自动补全)
解决办法
-
创建自定义View
File -> New -> File
选择iOS分类下的Source下面的Cocoa Touch Class, 点击Next
Class输入自定义的View的类名例如
CustomView
, Subclass of 输入 UIView, 此时下方的Also create XIB file是灰色的无法勾选 (其余的选项自己看吧), 点击Next勾选下方的Targets 对应到当前项目(如果未勾选), Create
-
创建Xib文件
File -> New -> File
选择iOS分类下的User Interface下面的View, 点击Next
Save As中输入Xib的名字,跟上面的类名一致, 后缀为xib, 例如
CustomView.xib
(后缀可以不输入)勾选下方的Targets 对应到当前项目(如果未勾选), Create
关联Xib和CustomView类
进入CustomView.xib中, 点击左侧的 File's Owner
选择右边的 Custom Class
输入 CustomView
- 自定义CustomView的初始化方法
CustomView.h
#import <UIKit/UIKit.h>
@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;
}
添加完之后
- 进入
Main.storyboard
中添加当前自定义的CustomView
-
去自定义的Xib中添加几个视图,测试一波
上面5中如果在sb中改变上图的CustomView的背景色,是不起作用的,因为在CustomView.xib中被覆盖成默认的whiteColor了
- OK测试我们的运行结果
Over 搞定 UIView
+ XIB
+ AutoLayout
如果写的不对或者有问题的地方,欢迎大家在评论处指正,相互交流
最后附上自己写的Demo MSBaseCustomView
Demo里面的MSBaseCustomView,可以直接被继承使用