UIStackView & Auto Layout changes(一)

Getting started

学习iOS9 by Tutorials笔记


打开VacationSpots-Starter,运行有些cell的nameLabel和locationLabel内容不居中,如下图红色框住的。

1.点击第一行London Cell,观察下,最后面3个button没有适配屏幕宽度,把屏幕旋转下就更明显了

2.点击Hide button能把下方的内容隐藏起来,可是下面还留了一片空白。

3.有些地方可以提升的,就是WHAT TO SEE部分在WHY VISIT下面

4.在landscape在情况下,下面的button太靠近底部边缘。

指出了程序的问题。我们将要修改好它们。

打开Main.storyboard,查看Spot Info View Controller


观察到上面的控件有背景色,是方便我也等下用stack view修改。它们会在运行的时候清除颜色

for view in backgroundColoredViews {

    view.backgroundColor =UIColor.clearColor()

}

Your first stack view

首先修改上面问题中的第一个,stack view可以保持button间的间距,stack view可以使他们按指定的方式分布,选择3个button


然后在点击嵌入stack view


然后变成这样了:


以前和这几个button相关的约束都被清除了,以前是这样子的


现在:


现在要给stack view添加约束,如下图


然后变成这样:


查看stack view的属性


现在Distribution是Fill,他会把stack view里面的内容填满stack view,我们把它改成:


下面是关于iOS9 AutoLayout的一些新特新

Layout anchors(布局锚)

在iOS9之前,加入有两个label。分别叫做叫做topLabel和bottomLabel。你想设置topLabel底部距离bottomLabel顶部的距离为8,代码要这样写:

letconstraint =NSLayoutConstraint('

item: topLabel,

attribute: .Bottom,

relatedBy: .Equal,

toItem: bottomLabel,

attribute: .Top,

multiplier:1,

constant:8

)

而在新特新的情况下,你只需这样写:

let constraint = topLabel.bottomAnchor.constraintEqualToAnchor(bottomLabel.topAnchor, constant:8)

Non-equal constraints

添加不相等的约束,在iOS9之前,你需要这样做


而现在:NSLayoutAnchor有下面的方法方便我们添加这种约束:


Including a multiplier

按之前的方法创建的约束需要填很多参数:

NSLayoutAnchor的子类NSLayoutDimension,有下面这些方法给我们用:


Layout guides

把Layout guide看成是矩形区域在你的view的层次上

Fixing the alignment bug


在awakeFromNib里。

说下这几步做了什么。

1.生产UILayoutGuide,并把它加入到cell的contentView中

2.把layoutGuide的top设置成nameLabel的top

3.把layoutGuide的�bottom设置成locationNameLabel的bottom

4.把layoutGuide的centerY设置成contentView的centerY

5.激活这些约束


Handling the truncation

看上面的效果,发现下面的label被截断了。这是因为要同时满足新加的约束和在storyboard中得约束的原因。因为距离上面的约束是15


把上面的约束删除就会报错:


而实际上,我们不删除它。


运行


(完)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容