如何在 iOS 9 中创建 Stack View
作者：Arthur Knopper， 原文链接 ，原文日期：2015-09-14
译者：小铁匠Linus；校对： numbbbbb ；定稿： 小锅
在 iOS 9 之前，即使是创建相对简单的用户界面(User Interface)，也需要在使用自动布局(Auto Layout)时添加大量的约束(Constraint)。在 iOS 9 中，苹果官方引进了 Stack View，它会为每个新增的子视图自动添加自动布局的约束。在本教程中，我们会创建一个包含三个子视图的纵向 Stack View。本教程使用 Xcode 7 和 iOS 9 实现。
打开 Xcode 并创建 Single View Application，product name 填写 IO9StackViewTutorial ，然后填好 Organization Name 和 Organization Identifier，Language 选择 Swift，Devices 选择 iPhone，具体设置如下图。
进入 Storyboard ，从界面右下角的 Object Library 里拖一个 Label 控件到主视图的上部。双击该 Label 并设置 title 为 “Swift”。从 Object Library 再拖一个 Image View，并放在 Label 下面。点击 下载 这张图片，把它添加到工程。选中 Image View 点击 Attribute Inspector。在 Image View 区域的 Image 字段选择 Apple_Swift_Logo.png，同时在 View 区域的 Mode 字段选择 Aspect Fit，具体如下图。
最后，再拖一个 Button，并放在 Image View 下面。双击该 Button 并设置 title 为 “Start Coding”。Storyboard 如下图所示。
按住 Ctrl 键并选择主视图里的三个控件，点击 Storyboard 右下角的 Stack View 按钮，如下图。
此时，Stack View 已经创建好了，唯一要做的事情就是设置自动布局约束(Auto Layout Constraints)。点选 Stack View 后点击 Pin 按钮，并设置 top constraint 为 50，点击”Add 1 Constraint”，如下图。
点击 Align menu 按钮，并选择”Horizontally in Container”，点击”Add 1 Constraint”，如下图。
按上面的步骤操作后，可能需要更新 frame，点击”Resolve Auto Layout Issues”按钮，然后再点击”Update Frames”，如下图。
可以在 Stack View 里改变子视图之间的间距(spacing)。选择 Stack View 然后切换到 Attribute Inspector 选项卡，修改 Spacing 的值为 20，如下图。
编译并运行工程。在模拟器里旋转设备，可以看到 Stack View 能很好地适应不同方向。
你可以在 Github 下载 IO9StackViewTutorial 工程的源代码。
正文到此结束
热门推荐
相关文章
近期评论
-
文章和留言都翻到11页了 没有OOM
-
-
朋友，翻页到11页，及以后，会出现OOM，无法访问
-
-
搞个gitee的项目
-
-
版本号是多少，你可以下载哪个代码仓库，jdk选1.8 直接跑就行
-
-
-
Loading...
![[HBLOG]公众号](https://www.liuhaihua.cn/img/qrcode_gzh.jpg)
