使用XIB配合NSLayoutConstraint进行页面布局

将这个混乱的时代拉回正轨~~
一直一直都在使用Masnory进行页面排布的我,为了自己的知识面开阔更多,进而来学习使用一下XIB。
后来,我觉得XIB真的蛮爽的...
但是为什么我最后放弃了呢?
因为...需求和产品老是要我改页面布局,我很痛苦,然后...继续使用Masnory吧。

偶尔看到,说XIB配合NSLayoutConstraint可以修改部分约束,我觉得很靠谱,然后来使用一下。

首先呢,我们先设置我们的UI需要的控件
一个简单地XIB控件

使用XIB配合NSLayoutConstraint进行页面布局_第1张图片
一个简单的XIB页面.png

设置完这个之后,我们开始设置约束。

使用XIB配合NSLayoutConstraint进行页面布局_第2张图片
设置约束.png

我们来看一下效果是这样子的

使用XIB配合NSLayoutConstraint进行页面布局_第3张图片
xib页面展示.png

剩下的,我们进行约束修改

使用XIB配合NSLayoutConstraint进行页面布局_第4张图片
修改一条线的约束.png

这个使我们刚才修改的约束

使用XIB配合NSLayoutConstraint进行页面布局_第5张图片
刚才修改的约束.png

然后再代码里面修改如下信息

- (void)awakeFromNib {
    [super awakeFromNib];
    /**修改约束*/
    self.fontLabelLeftLayout.constant = 0.0f;
    [self setNeedsUpdateConstraints];//需要的 时候更新
    [self updateConstraintsIfNeeded];//强制更新
    // Initialization code
}

最后的效果如下

使用XIB配合NSLayoutConstraint进行页面布局_第6张图片
最终效果.png

需要源代码的请查阅
里面有很多好玩的小东西,可以借鉴和参考

你可能感兴趣的:(使用XIB配合NSLayoutConstraint进行页面布局)