Auto Layout
文章平均质量分 72
yamingwu
这个作者很懒,什么都没留下…
展开
-
iOS 自动布局 Auto Layout 入门 02 使用自动布局
在上一节中,我们使用autosizing+代码的方法使三个view按我们的需求显示在应用程序中,这一节,我们使用Auto Layout来实现同样的功能。原创 2015-03-08 14:01:08 · 886 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 06 详情页面 (c) 对左侧标签进行排版
前面两节我们解决了歌手名label和按钮的布局问题,接下来我们对界面中的一列标签进行自动布局。对label进行排版选中5个label选择Align\Right Edges:为这些label添加位置约束:Release Year标签到左边界的距离为0Notes标签到顶部的垂直间距为64每个label之间的垂直间距为14选择resolve auto la原创 2015-03-13 21:26:47 · 970 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 06 详情页面 (a) 歌手名称Label
这一节开始,我们做一个更复杂的程序。我们需要为音乐播放程序构建一个详情页面,这个页面用于显示歌手的名字和专辑的一些详细信息:创建一个名为ArtistDetail的single view应用程序,disable size classes。如下图示是,将空间拖到view中,不用太关心这些空间的位置,大概差不多就行,后面我们会一步一步的让它们看起来好看的。歌手名Label我们原创 2015-03-12 20:45:10 · 1181 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 06 详情页面 (b) 按钮的布局
上一节我们完成了对歌手名称label的布局设置,这一节我们对最下方的三个按钮的布局进行配置。首先选中三个按钮,设置Size to Fit Content,让这三个按钮拥有合适的大小:为了方便查看按钮的大小,我们为按钮设置一个背景色并设置如下图所示的约束:在预览窗口,旋转界面为横屏,可以看到三个按钮的布局可以接受:如果三个按钮宽度一致,看起来会更好看一些, 接原创 2015-03-12 23:53:01 · 1245 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 04 约束的动态效果
前面几节使用的约束都是通过Interface Builder添加的,这一节我们来看看运行时约束是怎么样的。首先我们删除没有背景色的那个按钮添加以下方法到ViewController.m中:- (IBAction)buttonTapped:(UIButton *)sender{ if ([[sender titleForState:UIControlStateNorma原创 2015-03-10 22:30:13 · 883 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 05 相册 (中)
这一节,我们为绿色view添加label和image view。添加UILabel为label添加约束,让其于绿色view下边界的间距为20:再通过Align菜单设置水平居中:完成后,label的约束如下图所示:添加UIImageView添加UIImageView到绿色view中,使用pin菜单,设置UIImageView和绿色view的之间原创 2015-03-11 22:45:29 · 969 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 05 相册 (上)
通过前面几节,我们已经了解了什么是约束,以及约束是如何工作的。这一节开始,我们使用自动布局来做一个相册应用程序。这个程序在水平和垂直模式都可以显示4副图片,效果如下:屏幕被分为4个区域,每个区域由一个Image view和一个Label组成。创建一个名为Gallery的single view应用程序。打开Main.storyboard,disable Size Classes。添加原创 2015-03-11 21:26:23 · 1829 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 03 进一步学习使用约束
这一节,我们来仔细看看约束是怎么工作的。原创 2015-03-10 21:49:16 · 1022 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 05 相册 (下)
这一节,我们添加其余3个头像到界面中。首先,我们将绿色view拖向屏幕的左上角,这将导致约束出现问题,我们使用‘Resolve Auto Layout Issues’的Update Constraints选项,通过更新约束的方法解决拖动导致的约束问题。之前我们使用的是‘Update Frames',‘Update Frames’的作用是通过移动和改变view的大小来满足约束。这里,我们希望的是原创 2015-03-11 23:12:32 · 1255 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 01 背景介绍
如果你在考虑如何让我们的app在手机处于水平和垂直的情况下都保持很好的布局?如何让我们的程序很好的同时支持iPhone和iPad?请使用自动布局-Auto Layout!这一节,我们通过Autosizing来实现一个可以使用横屏和竖屏的布局,看看问题在哪里。原创 2015-03-07 21:30:30 · 1040 阅读 · 0 评论 -
iOS 自动布局 Auto Layout 入门 06 详情页面 (d) 对右侧标签进行排版
接下来,我们对详情页中间右侧的控件进行排版。首先将右侧这些空间拖动到合适的位置:在label之间添加水平间距约束:只有水平间距约束是不够的,还需要为这三个label添加y轴方向的约束,这里我们使用Editor菜单的Align\Baselines约束,分别为每行的两个label添加约束:接下来,我们通过编码的方式,为album value label添加内容,原创 2015-03-13 22:30:08 · 1168 阅读 · 0 评论