iOS - XIB之AutoLayout添加约束

XIB——AutoLayout添加约束

仿QQ登录界面:

说明:以下各图背景红色只是方便看清楚;

1.创建工程:创建xib文件

2.打开xib文件:

(1).创建头像:

拖控件:uiimageview——》放到任意位置——》点击Align键,Pin键;如下图:

此时:就可以对控件任意约束了:

说明:由于时间原因,没介绍的以后慢慢自己琢磨;

Align键:Horizontally: 垂直居中对齐; Vertically:水平居中对其;

Pin键:

Add New Constraints:表示这个控件距离上下左右的间距;

Constrain to margins: 以AutoMargins的位置作为起点进行约束,一般选中即可;

Width:就是该控件的宽度;

Height:就是该控件的高度;

注意:上下左右的间距和控件的宽度、高度配合使用,尽量不要冲突; 例如:375的屏幕宽度,你不能距离左边200,距离右边200,还要控件宽度100,肯定不行;笔者建议就是:给了距离左边的间距,同时给出空间宽度即可,适用于lable,textfile等控件,不考虑它到底距离右边多少;如果给了距离左右的间距,就不要给宽度了,适用于button之类的控件;

下面:开始添加imageview的约束:

1》.垂直居中:点击align——》选中Horizontally——》点击Add 1 constraint:

2》.给大小: 130 * 130, 距离上边缘 20;

注意:给上下左右的大小时:先点击红色虚线的部分,让他变成实线;

给宽度、高度时先打勾选中,再给大小;

最后点击:Add 3 constraint:

3》.点击 Resolve Auto Layout Issues——》点击 Update Frames;

4》.其他处理:

在右侧可以添加图片,修改背景等属性

运行:5和6s效果图:

修改成圆角:

点击右上角:两个圈的那个——》在.m文件创建属性关联;

关联:

选中控件(uiimageview)——》右键:

选中New Prferencing Outlet后面的小圆圈,拖到.m文件的@interface与@end中:

给属性命名qqImg,并点击Connect关联:

最后修改边角:

_qqImg.layer.cornerRadius = 65;

运行:

最终效果图:6s和5:

时间: 2024-10-12 12:38:58

iOS - XIB之AutoLayout添加约束的相关文章

iOS 用xib给scrollView添加约束

之前习惯了使用纯代码布局,最近使用xib给scrollView添加约束时遇到了一些问题,查阅资料后总结一下. 1.在xib中添加一个滚动视图UIScrollView,上下左右约束都为0 2.在滚动视图上添加一个UIView,如果是水平方向滚动,设置UIView垂直居中.如果是竖直方向滚动,设置UIView水平居中.如果水平方向和竖直方向都需要滚动则不需要设置.设置UIView上下左右约束都为0. 3.如果是水平方向滚动,设置UIView的宽度.如果是竖直方向滚动,设置UIView的高度.如果水平

iOS动态管理AutoLayout的约束NSLayoutConstraint

除了使用Storyboard之外,也可以使用使用代码的方式,动态的向指定的UIView,添加约束. 例如有两个UILabel:someLabel,otherLabel 首先用代码实例化,两个控件 self.someLabel = [[UILabel alloc]initWithFrame:CGRectZero]; self.someLabel.translatesAutoresizingMaskIntoConstraints = NO; [self.view addSubview:self.in

XIB——AutoLayout添加约束

仿QQ登录界面: 说明:以下各图背景红色只是方便看清楚: 1.创建工程:创建xib文件,不会,可看上上上篇:初识xib: 2.打开xib文件: (1).创建头像: 拖控件:uiimageview-->放到任意位置-->点击Align键,Pin键:如下图: 此时:就可以对控件任意约束了: 说明:由于时间原因,没介绍的以后慢慢自己琢磨: Align键:Horizontally: 垂直居中对齐: Vertically:水平居中对其: Pin键: Add New Constraints:表示这个控件距

Xib中UIScrollView添加约束步骤

要往scrollView里面添加子控件--从向往下排 0.设置scrollView的上下左右约束距离控制器view边距为零(确定frame的大小) 1.要往scrollView添加一个内容View 2.约束内容的View左上右边距离父控件为0 3.约束死内容的View的高度 4.约束内容View在ScrollView的水平居中(垂直滑动) 5.添加控件--从上往下排 6.去掉内容View的约束死的那个高度的约束 7.约束内容View距离底部最后一个控件View的间距

纯代码添加约束,autolayout 适配

IOS AutoLayout 代码约束—VFL 2014-12-22 22:19:43http://my.oschina.net/carson6931-Carson6931-点击数:2148 IOS 提供了两种添加约束的方法 第一种: +(instancetype)constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1 relatedBy:(NSLayoutRelation)relation toItem:(id)view2

xib添加约束

一.添加xib 1.当控制器已经创建下单独创建xib(为控制器单独创建xib) 1.单独创建xib,名字要和控制器名字一样. 2.设置xib的控制器类为当前控制器. 3.给当前控制器view拖线为当前xib. 4.如下图: 二.设置约束 1.label 1.label添加约束可以只设置x,y就可以定位label. 2.在xib或storyBoard中换行的快捷键option+回车.

ios xib和代码的frame布局 iOSXib布局后代码修改约束的值

如何修改autolayout 约束的值? 1 2 3 4 5 6 目前我已知的方法有5种 1.修改frame(有时候可能会不起作用,但可以做动画) 2.修改约束的float值 3.使用VisualFormat 语言 4.使用 constraintWithItem,按倍率改变   如  2x+1=Y  5.移除约束(remove at runtime),添加新的约束 前面的文章已经讲到如何使用storyboard 创建约束了,但是在实际的开发中我们经常需要适配不同的屏幕尺寸和系统版本,这时我们就

ios快速添加约束(storyboard中)

这篇文章是告诉新手如何快速的在storyboard中添加约束: 我们在storyboard中有一些按钮,可以添加约束. 但是最直观.最方便.最快捷的添加约束的方法,在我看来就是使用ctl键: 选中控件,按下ctl,将其拖动到约束的另外一个对象-可能是自己,可能是父视图,可能是兄弟视图. .弹出的框里我们就可以选择我们需要添加的约束,1次添加1个,不多也不少. 快来试试吧,拥抱autolayout!

怎样使用AutoLayOut为UIScrollView添加约束

1.在ViewController中拖入1个UIScrollView,并为其添加约束 约束为上下左右四边与superview对齐 2.在scrollview中,拖入1个UIView,为了便于区分将其设为橙色. 3.为view添加约束 约束为上下左右四边与superview对齐 添加完这些约束后,我们发现出现了错误,不要理会 4.为view添加宽度约束,本例中,想达到的效果是scrollView可以竖向滚动,不要横向滚动, 因此,可以将view的宽度约束为与scrollView相同 5.接下来为v