淘先锋技术网
首页
1
2
3
4
5
6
7
【AutoLayout案例05-横竖屏效果 Objective-C语言】
一、接下来,看看这个
我们一看这个效果,就知道需求了吧
需求是,无论在横屏、竖屏下:
1)首先,是不是有四个View啊
无论在横屏、竖屏、下,都有这么四个View吧
这四个View的高和宽,是什么,
相等的吧
这四个View的高和宽,是相等的
那么,既然这四个View的高和宽,是相等的,也就是说,我们只要确定了一个View的高和宽,让其他三个、和它一样,是不是就OK了
然后,接下来,第一个View中,有一个图片
然后,接下来,第一个View中,有一个图片,高和宽都是100
有一个图片框,高和宽都是100
并且,这个图片框,在第一个View中,水平、垂直、居中显示
并且,第一个View中,还有一个Label,这个Label是紧贴底部显示
左、右、紧贴两边,然后高度是设置一个高度,紧贴底部显示
是不是基本就这么一个效果
来,咱们一起来做一下
二、实现这个案例
1.新建一个项目
把这个名称,改成案例6
好,我们再新建一个项目
Name:008案例6适配
1)第一步:打开Main.storyboard
2)第二步:拖一个UIView过来
我们除了刚才那个有点儿特殊,是一个图片以外,我们其他的是不是都是在一个四方块儿里头做啊
拽一个什么,UIView过来
设置这个UIView的背景色
设置为蓝色
设置这个UIView,来、来、来、写约束了
这个UIView,距我们,哪里,注意看屏幕
第一个View,距左边、距上边,都是0,0
第一个View,距左边、距上边,都是0,0
把这个勾去掉
把两个竖线选上
数值改成0,
把下拉菜单打开,看一下,选择View
数值改成0
好,这个是不是搞定了,点击增加
这个蓝色View,距离左边、距离上边,这个X和Y是不是确定了
这个蓝色View的高和宽、是不是还没确定
如何确定这个蓝色View的高和宽呢
看,这么来确定蓝色View的高和宽
1)我们设置第一个控件的右边,和中线对齐,
第一个控件的左边,紧贴控制器左边,右边和中线对齐
第一个控件的右边,和中线对齐
也就意味着,第一个控件的宽度,就是控制器的一半儿吧
那么,第一个控件的底边,和我们这个控制器的水平的中线对齐,证明它高度,是不是我们控制器高度的一半儿,
是高度的一半儿,所以说,垂直的中线,应该是,
所以说,我们,要想让这个View的宽度,等于控制器的一半儿,
你要让这个View的高度,等于控制器的一半儿
1)首先,要设置这个View,垂直居中,水平居中,对齐吧,
2)然后,设置完这个以后,再把那个,再改一下,不是这个控件的中点,和它的那个中线对齐,而是它的右边,和中线对齐
右边线,对
明白思路了吗
来,注意看,选中这个View
1)我首先,设置这个View,在父容器中,水平,在父容器中,水平对齐,水平居中,在父容器中,水平居中
2)在父容器中,垂直居中
点击增加
好,这样的话,这个View,是不是在我们的父容器中,水平居中、垂直居中了
那么,哪个是水平居中呢,注意看看