iOS StoryBoard + xib

IOS代码添加约束

2016-12-07  本文已影响1806人  MadeLife

前言

作为一个刚入门的IOS开发人员,最开始的时候是在XIB上拖动去画界面。随着业务的需求增长,我们会发现这种方式的布局已经不能满足我们的要求。为解决这种情况,我们会去用代码去写布局。在这一过程中,我自己是经历了两步。第一次是在写布局时自己去计算控件的位置,包括控件的x、y、width、height。这种处理方法在最开始的时候,还是可以去接受的,但是后来在处理一些居中布局以及UILbel的宽度等于内容的宽度的情况下,这种方法会显得很繁琐、很愚蠢。为此我转到了第二步-使用NSLayoutConstraint去写布局,这个过程中自己学到了很多,在后续的过程中遇到布局的问题也就小case了。

因为现在的iPhone手机屏幕已经越来越多,所以在写布局时,一定要写响应式的布局,在所有的屏幕上的显示要趋于一致。

NSLayouyConstraint

在提到代码响应式布局时,就不得不提到NSLayoutContraint,通过对控件添加一个或几个约束,就能得到我们想要的结果。xib的布局也是使用这个给各种控件添加约束。

在给控件添加约束的过程中,主要是这个方法[NSLayoutConstraint constraintWithItem:需要添加约束的控件 attribute:需要约束的属性 elatedBy:和参照控件属性的关系 toItem:参照的控件 attribute:参照控件的属性 multiplier:比例 constant:固定数值]

针对上面的这个方法的作用有一个表达式可以很好描述:

需要添加约束的控件.需要约束的属性 =  参照控件.参照属性 * 比例 + 固定数值

参数说明

attribute

attribute:控件的属性,包括上(NSLayoutAttributeTop)下(NSLayoutAttributeBottom)左(NSLayoutAttributeLeft)右(NSLayoutAttributeRight)边距、宽度(NSLayoutAttributeWidth)、高度(NSLayoutAttributeHeight)、水平(NSLayoutAttributeCenterX)和垂直(NSLayoutAttributeCenterY)对其等, 详细的说明可以去参照NSLayoutAttribute这个枚举类型

elateBy

elateBy: 需要约束控件属性和参照控件属性之间的关系,包括小于等于(NSLayoutRelationLessThanOrEqual)、等于(NSLayoutRelationEqual)和大于等于(NSLayoutRelationGreaterThanOrEqual)

multiplier

multiplier: 参照控件属性的比例,是一个浮点型的数值

constant

constant: 在比例基础上增加一个固定的数值

下面提供两个约束的例子

//self.customTitleLabel 和self.customTitleView垂直方向保持居中对齐
[NSLayoutConstraint constraintWithItem:self.customTitleLabel
                             attribute:NSLayoutAttributeCenterY
                             relatedBy:NSLayoutRelationEqual
                                toItem:self.customTitleView
                             attribute:NSLayoutAttributeCenterY
                            multiplier:1.0f
                              constant:0.0f].active = YES;

//self.customTitleImageView 紧跟着 self.customTitleLabel右侧显示
[NSLayoutConstraint constraintWithItem:self.customTitleImageView
                             attribute:NSLayoutAttributeLeft
                             relatedBy:NSLayoutRelationEqual
                                toItem:self.customTitleLabel
                             attribute:NSLayoutAttributeRight
                            multiplier:1.0f
                              constant:3.0f].active = YES;

注意:在写完约束之后需要手动去激活,这也就是上面最后把active置成YES的原因。

上一篇 下一篇

猜你喜欢

热点阅读