alignment约束有9个可添加的类型必威手机官网:,

有关机关布局入眼有二种格局

2.view的布局地方,鲜明于它与superview及其余view的涉嫌。

布局动画

动画是UI体验的最首要片段,改动布局今后的动画片也丰硕主要。提起动画,Core Animation又立功了..自从CA出现之后,全体的动画片效果都格外cheap,在auto layout中状态也和collection view里同样,不会细小略(能够参见WWDC 二零一二Session笔记——219 Advanced Collection Views and Building Custom Layouts),只要求把layoutIfNeeded放到animation block中就可以~

1 [UIView animateWithDuration:0.5 animations:^{
2     [view layoutIfNeeded];
3 }];

   

AutoLayout是什么?

运用一句Apple的合法概念的话

AutoLayout是一种基于约束的,描述性的布局种类。 Auto Layout Is a Constraint-Based, Descriptive Layout System.

关键词:

  • 听大人说约束 - 和过去定义frame的职位和尺寸差别,AutoLayout的岗位鲜明是以所谓相对地点的牢笼来定义的,比如x坐标为superView的骨干,y坐标为荧屏底边上方10像素等
  • 陈述性 - 约束的概念和一一view的关系接纳类似自然语言大概可视化语言(稍后会涉及)的主意来张开描述
  • 布局种类 - 即字面意思,用来顶住界面包车型客车逐个要素的地点。

总的说来,AutoLayout为开拓者提供了一种分裂于守旧对于UI成分位置钦点的布局方法。从前,不论是在IB里拖放,依旧在代码中写,每一个UIView都会有谈得来的frame属性,来定义其在当前视图中的地点和尺寸。使用AutoLayout的话,就成为了接纳约束原则来定义view的岗位和尺寸。那样的最大益处是一口气化解了分化分辨率和荧屏尺寸下view的适配难点,别的也简化了旋转时view的职位的概念,原本在底层之上10像素居中的view,不论在转悠荧屏或是改造设备(三星平板大概黑莓5也许现在只怕出现的mini 苹果平板)的时候,始终还在底层之上10像素居中的地点,不会发生变化。 计算

动用约束规范来陈述布局,view的frame会依靠那几个约束来开展测算 Describe the layout with constraints, and frames are calculated automatically.


@"AllHightNull":[[NSNumberalloc]initWithInt:lhightNull]};

1.2 Autolayout

iphone6,iphone6 plus出来后很四个人就最初关注Autolayout了,再不要就不能够适配了!在xib上行使Autolayout是非常惠及的,直接在分界面上拖拖拉拉就足以做到机关布局了,苹果也慰勉选用xib实行付出。但大相当多开辟者还是习惯使用纯代码进行UI编写的。

纯代码编写的低价:看起来牛逼啊,运行啊美术专门的学问啊他们一向看不懂啊,那样价值就反映了啊。否则使用xib的话大家不就成了水墨画了呢,直接拖拽,以为都没技艺含量(作者要幸亏瞎逼逼,哈哈)。好处实在是举行成效高,代码轻便复用,在五个人协作项目管理更有利。

笔者个人正是纯代码编写的,全体就找了用代码来行使Autolayout的例证

  • Visual format language那是合法的纯代码格局采用Autolayout,但是看起来就很难用啊,看上边这段代码,笔者首先眼看到就不想用了。要是什么人想询问一下的话推荐一篇Autolayout及VFL经验分享

NSDictionary *dict1 = NSDictionaryOfVariableBindings(_boxV,_headerL,_imageV,_backBtn,_doneBtn);NSDictionary *metrics = @{@"hPadding":@5,@"vPadding":@5,@"imageEdge":@150.0};NSString *vfl = @"|-hPadding-[_boxV]-hPadding-|";NSString *vfl0 = @"V:|-25-[_boxV]";NSString *vfl3 = @"V:|-vPadding-[_headerL]-vPadding-[_imageV(imageEdge)]-vPadding-[_backBtn]-vPadding-|";

  • Masonry那是叁个第三方的丰硕好用的开源框架,Masonry让用代码写Autolayout成为大概,何况非常有力,清晰好用,具体育赛事例能够到github上下载demo看看Masonry。 博客介绍masonry

}else{

AutoLayout和Autoresizing Mask的区别

Autoresizing Mask是我们的故交了…若是你以前一贯是代码写UI的话,你料定写过UIViewAutoresizingFlexibleWidth之类的枚举;假若你以前用IB比较多的话,一定留意到过各类view的size inspector中都有叁个革命线条的Autoresizing的提示器和对应的卡通缩放的暗中提示图,那便是Autoresizing Mask。在iOS6此前,关于荧屏旋转的适配和摩托罗拉,华为平板显示器的机关适配,基本都以由Autoresizing Mask来完毕的。不过随着大家对iOS app的渴求越来越高,以及曾经以及之后或许出现的有余显示屏和分辨率的道具来讲,Autoresizing Mask显得略微落后和愚拙了。AutoLayout能够达成具备原先Autoresizing Mask能产生的干活,同期还是能够独当一面一些原来不能成功的任务,当中囊括:

  • AutoLayout能够内定大肆五个view的对峙地点,而没有须要像Autoresizing Mask那样须求八个view在骨血的view hierarchy中。
  • AutoLayout不必得钦赐相等关系的束缚,它能够钦赐非相等约束(大于大概小于等);而Autoresizing Mask所能做的布局只好是特出条件的。
  • AutoLayout能够钦命约束的优先级,总结frame时将先行根据满意优先级高的标准化举行测算。

总结

Autoresizing Mask是AutoLayout的子集,任何可以用Autoresizing Mask完成的工作都可以用AutoLayout完成。AutoLayout还具备一些Autoresizing Mask不具备的优良特性,以帮助我们更方便地构建界面。

AutoLayout基本选取格局

[self.viewaddConstraints:[NSLayoutConstraintconstraintsWithVisualFormat:vfl2options:0metrics:metricsviews:dict]];

1.1 Autoresizing

这种措施多数在iphone6,iphone6 plus没出去前就丰盛了,因为显示屏宽度都以定点的,就不时多少个地点需求用到明白布局,使用Autoresizing Mask基本上能知足大多数必要。IOS自动布局之Autoresizing

三.xib下的autolayout

手动使用API增加约束

手动使用API增添约束

一.xib分界面中选用开关增加

- opts本人点去头文件看。有个别意况会用,等下有例子。

添加

在创设约束之后,须求将其加多到功能的view上。UIView(当然NSView也一律)参加了二个新的实例方法:

  • -(void)addConstraint:(NSLayoutConstraint *)constraint;

用来将封锁增添到view。在增多时独一要留神的是增加的对象view要依据以下准绳:

  • 对于多少个同层级view之间的约束关系,增添到她们的父view上

 

  • 对于四个不等层级view之间的封锁关系,增多到他俩日前的一块父view上

 

  • 对于有等级次序关系的多个view之间的牢笼关系,增添到档期的顺序较高的父view上

 

Interface Builder

那部分互连网海南大学学量的科目,都以说的那几个

//编辑并投入分界面限制

1.不辜负权利的骑墙派说法:apple的设施进而多了,你的选用应该都利用al。(并且用sb)

AutoLayout基本使用办法

刷新

能够经过-setNeedsUpdateConstraints和-layoutIfNeeded八个章程来刷新约束的变动,使UIView重新布局。那和CoreGraphic的-setNeedsDisplay一套东西是一律的~

PIN,是应用最广大的牢笼,当中能够安装某多少个View的大幅度和可观,某一个view到父View四周的偏离,某三个view到周边相邻别的View的相距。设置某多少个View宽度或许中度一致,恐怕依照比例分红,

上面4个分别是view相对于superview的左、右、上、下的区间

AutoLayout是什么?

行使一句Apple的合法概念的话

AutoLayout是一种基于约束的,描述性的布局系统。 Auto Layout Is a Constraint-Based, Descriptive Layout System.

关键词:

  • 依据约束 - 和未来定义frame的地方和尺寸分歧,AutoLayout的岗位明确是以所谓相对地方的牢笼来定义的,举例x坐标为superView的中坚,y坐标为显示器底边上方10像素等
  • 陈说性 - 约束的定义和种种view的关联接纳类似自然语言只怕可视化语言(稍后会涉嫌)的艺术来张开描述
  • 布局种类 - 即字面意思,用来担当分界面的各类要素的任务。

简单的说,AutoLayout为开拓者提供了一种分裂于古板对于UI成分地方钦点的布局方法。以前,不论是在IB里拖放,依然在代码中写,每种UIView都会有和煦的frame属性,来定义其在当前视图中的地点和尺寸。使用AutoLayout的话,就改为了利用约束标准来定义view的职位和尺寸。那样的最大好处是一口气消除了差异分辨率和荧屏尺寸下view的适配难题,别的也简化了旋转时view的任务的定义,原本在底部之上10像素居中的view,不论在打转显示屏或是改换设备(苹果平板也许红米5恐怕现在可能出现的mini 苹果平板)的时候,始终还在底层之上10像素居中的地点,不会发生变化。 计算

使用约束条件来描述布局,view的frame会依据这些约束来进行计算 Describe the layout with constraints, and frames are calculated automatically.

至于AutoLayout,最先从iOS6从头引进使用。

地点多少个都要选中四个View时才足以用,也正是说他不是针对某二个view的布局,而是多少个兄弟view关系的浮现,分别能够设置leading、trailing、top、buttom、CenterX、CenterY、Baselines多种。

对此页面相当少,的家常应用。xib/sb加al。拖拖拽拽。娱乐中就足以做到UI的做事。al的确给于了众多造福。

Interface Builder

这一部分英特网海高校量的教程,都是说的这一个

首要功效是选拔约束,对视图实行相对布局,以适应不一样屏尺的改造。

中间最下边包车型地铁五个分级是Horizontally:垂直居中对齐;Vertically:水平居中对起;能够安装二个参数,正是偏移量,能够设置为正数或负数,正数是水平向右,负数是水平向左

al的大旨观点是

刷新

能够透过-setNeedsUpdateConstraints和-layoutIfNeeded七个艺术来刷新约束的更换,使UIView重新布局。那和CoreGraphic的-setNeedsDisplay一套东西是毫发不爽的~

创建

iOS6中新踏入了贰个类:NSLayoutConstraint,二个形如那样的束缚

  • item1.attribute = multiplier ? item2.attribute + constant

对应的代码为

1 [NSLayoutConstraint constraintWithItem:button
2                              attribute:NSLayoutAttributeBottom
3                              relatedBy:NSLayoutRelationEqua
4                                 toItem:superview
5                              attribute:NSLayoutAttributeBottom
6                             multiplier:1.0
7                               constant:-padding]

那对应的自律是“button的最底层(y) = superview的最底层 -10”。

attribute:NSLayoutAttributeCenterX//约束的值

lineBreakMode:NSLineBreakByWordWrapping];

【iOS开采】多屏尺的自发性适配 AutoLayout (纯代码格局),iosautolayout

至于AutoLayout,最先从iOS6方始引进使用。

  重要作用是应用约束,对视图实行相对布局,以适应不一致屏尺的调换。   英特网海高校方的资料都在介绍xib和storyboard,如何接纳AutoLayout,说纯代码应用AutoLayout实行UI布局的更加少。对于自身这些习贯了代码UI布局的人,写个备忘:  

 

Alignment类型的牢笼增添

各类constraint增加后都以足以编制的。选中有个别constraint后拉开左侧栏选inspector。能够修改数值。(那些数值是view间的偏移量)和预先级。

轻易出现的谬误

因为涉及约束难题,因而约束模型下的享有比一点都不小大概出现的标题这里都会冒出,具体来讲满含两种:

  • Ambiguous Layout 布局不可能鲜明
  • Unsatisfiable Constraints 不可能满意约束

布局无法明显指的是提交的自律原则不可能独一确定一种布局,也即约束原则欠缺,不恐怕得到独一的布局结果。这种情景相似增添一些至关重要的牢笼依旧调治优先级能够消除。不能满意约束的标题源于是有约束原则相互争论,因而不能同期满意,供给删掉一些约束。三种错误在产出时均会招致布局的不安定和谬误,Ambiguous能够被容忍何况采取一种有效布局呈以往UI上,Unsatisfiable的话会不大概获得UI布局并报错。 对于无法明确的布局,能够透过调解时停顿程序,在debugger中输入

  • po [[UIWindow keyWindow] _autolayoutTrace]

来检查是或不是存在Ambiguous Layout以及存在的地点,来帮忙增多条件。别的还会有局地检查办法,来查看view的牢笼和自律状态:

  • [view constraintsAffectingLayoutForOrientation/Axis: NSLayoutConstraintOrientationHorizontal/Vertical]
  • [view hasAmbiguousLayout]
    • [view exerciseAmbiguityInLayout]

布局动画

动画片是UI体验的第一部分,更换布局今后的卡通片也不行关键。提及动画,Core Animation又立功了..自从CA出现现在,全体的卡通效果都万分cheap,在auto layout中状态也和collection view里一样,相当的粗略(能够参见WWDC 2012 Session笔记——219 Advanced Collection Views and Building Custom Layouts),只须要把layoutIfNeeded放到animation block中就可以~

1 [UIView animateWithDuration:0.5 animations:^{
2     [view layoutIfNeeded];
3 }];

 

 

第五步将建立好的VFL约束语句参加到父View中贯彻约束。那与系统方法类似。

3.Mac os的行使。以后都做iOS了。mac app的窗口,会有高低变化。al比较适合。

创建

iOS6中新加盟了二个类:NSLayoutConstraint,叁个形如这样的束缚

  • item1.attribute = multiplier ? item2.attribute + constant

对应的代码为

1 [NSLayoutConstraint constraintWithItem:button
2                              attribute:NSLayoutAttributeBottom
3                              relatedBy:NSLayoutRelationEqua
4                                 toItem:superview
5                              attribute:NSLayoutAttributeBottom
6                             multiplier:1.0
7                               constant:-padding]

那对应的约束是“button的尾部(y) = superview的底层 -10”。

轻易并发的不当

因为涉及约束难点,因而约束模型下的持有非常的大大概现身的标题这里都会出现,具体来讲包涵二种:

  • Ambiguous Layout 布局不能够分明
  • Unsatisfiable Constraints 无法满意约束

布局不能分明指的是提交的羁绊规范不可能独一显明一种布局,也即约束原则不足,不可能获得独一的布局结果。这种景观一般增加一些必备的约束照旧调治优先级能够消除。不可能满足约束的标题源于是有约束规范相互争持,因而非常的小概相同的时候满意,须要删掉一些封锁。二种错误在现身时均会招致布局的不平稳和谬误,Ambiguous能够被容忍而且选择一种有效布局呈以往UI上,Unsatisfiable的话会无法得到UI布局并报错。 对于不能鲜明的布局,能够经过调节和测量检验时停顿程序,在debugger中输入

  • po [[UIWindow keyWindow] _autolayoutTrace]

来检查是不是存在Ambiguous Layout以及存在的职位,来救助增添标准。其他还或许有局地反省办法,来查阅view的约束和封锁状态:

  • [view constraintsAffectingLayoutForOrientation/Axis: NSLayoutConstraintOrientationHorizontal/Vertical]
  • [view hasAmbiguousLayout]
    • [view exerciseAmbiguityInLayout]

[m_addrViewsetTranslatesAutoresizingMaskIntoConstraints:NO];

NSString *vfl3 = @"V:|-vPadding-[_headerL]-vPadding-[_imageV(imageEdge)]-vPadding-[_backBtn]-vPadding-|";

  ----------------------------------------- 英特网有关小说:

1、AutoLayout(自动布局)入门    推荐 2、Autolayout及VFL经验分享      此文包罗有三个demo(火速访谈下载) 推荐 3、iOS 6 Auto Layout NSLayoutConstraint 分界面布局   不是有相爱的人在悄然手动些这个看似脚本的字符: 今后引入二个开源库给我们github: [email protected]: 

AutoLayout (纯代码情势),iosautolayout 关于AutoLayout,最初从iOS6从头引进使用。 主要职能是选择约束,对视图...

英特网海大学量的质感都在介绍xib和storyboard,如何使用AutoLayout,说纯代码应用AutoLayout进行UI布局的更加少。对于自个儿这几个习于旧贯了代码UI布局的人,写个备忘:

其三步组织布局时索要选择的常量,也结合三个字典。那几个常量首要就是有些间隔距离,偏移量等数码。

形象化的精晓,"|"是用来分明view上、下、左、右关系的。

Visual Format Language 可视格式语言

UIKit团队此番一定有爱,推断他们友善也以为新加封锁的API名字太长了,由此他们注脚了一种新的办法来陈诉约束原则,十三分有意思。这种语言是对视觉描述的一种浮泛,大概进度看起来是如此的: accept按键在cancel按键左边暗中认可间距处   

最终动用VFL(Visual Format Language)描述变成那样:

1 [NSLayoutConstraint constraintsWithVisualFormat:@\"[cancelButton]-[acceptButton]"
2                                         options:0
3                                         metrics:nil
4                                           views:viewsDictionary];

中间viewsDictionary是绑定了view的名字和指标的字典,对于那么些例子能够用以下措施获得相应的字典:

1 UIButton *cancelButton = ...
2 UIButton *acceptButton = ...
3 viewsDictionary = NSDictionaryOfVariableBindings(cancelButton,acceptButton);

变化的字典为

{ acceptButton = ""; cancelButton = ""; } 

自然,不嫌累的话本身手写也未尝不可。现在字典啊数组啊写法相对简化了众多了,因此也不复杂。关于Objective-C的新语法,能够参照笔者在此之前的一篇WWDC 二零一一笔记:WWDC 2013 Session笔记——405 Modern Objective-C。 在view名字前边加多括号以及连接处的数字能够授予表达式更加多意义,以下实行一些比如:

  • [cancelButton(72)]-12-[acceptButton(50)]
    • 撤除按键宽72point,accept开关宽50point,它们之间间隔12point
  • [wideView(>[email protected])]
    • wideView宽度大于等于60point,该约束原则优先级为700(优先级最大值为一千,优先级越高的约束越先被满足)
  • V:[redBox][yellowBox(==redBox)]
    • 竖直布局,先是一个redBox,其下方紧接三个大幅度等于redBox宽度的yellowBox
  • H:|-[Find]-[FindNext]-[FindField(>=20)]-|
    • 水平布局,Find距离父view左边缘暗中认可间隔宽度,之后是FindNext距离Find间隔暗中同意宽度;再然后是上升的幅度非常的大于20的FindField,它和FindNext以及父view左边缘的间距都是暗中同意宽度。(竖线'|‘ 表示superview的边缘)

 

[self.viewaddConstraints:[NSLayoutConstraintconstraintsWithVisualFormat:vfl3options:0metrics:metricsviews:dict]];

CGSize titleS = [title sizeWithFont:[_headerL font]

有个别代码

单一代码UI经常布局后,增多autolayout就足以了,调解十一分便宜那是一段水平居中,垂直并列的4个按钮 布局代码 setTranslatesAutoresizingMaskIntoConstraints  是为no,开启AutoLayou.

    //-----autoLayout

    [_btn_1 setTranslatesAutoresizingMaskIntoConstraints:NO];

    [_btn_2 setTranslatesAutoresizingMaskIntoConstraints:NO];

    [_btn_3 setTranslatesAutoresizingMaskIntoConstraints:NO];

    [_btn_4 setTranslatesAutoresizingMaskIntoConstraints:NO];

    

    CGSize winSize = [[iHappySDKSingle shareSingle] getScreenSize];

    CGFloat tpo = _btn_1.frame.origin.y;

    CGFloat hpod = _btn_1.frame.origin.x;

    CGFloat btnH = _btn_1.frame.size.height;

    CGFloat vpod = winSize.width*0.15-btnH;

    

    NSNumber* tp = [NSNumber numberWithFloat:tpo];

    NSNumber* hd = [NSNumber numberWithFloat:hpod];

    NSNumber* vd = [NSNumber numberWithFloat:vpod];

    NSNumber* bh = [NSNumber numberWithFloat:btnH];

    NSNumber* btm = [NSNumber numberWithFloat:vpod*2];

    

    NSDictionary *dict1 = NSDictionaryOfVariableBindings(_btn_1,_btn_2,_btn_3,_btn_4);

    NSDictionary *metrics [email protected]{@"hPadding":hd,@"vPadding":vd,@"top":tp,@"btm":btm,@"btnHeight":bh};

    NSString *vfl1 = @"|-hPadding-[_btn_1]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl1

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl2 = @"|-hPadding-[_btn_2]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl2

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl3 = @"|-hPadding-[_btn_3]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl3

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl4 = @"|-hPadding-[_btn_4]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl4

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl5 = @"V:|-(<=top)-[_btn_1(btnHeight)]-vPadding-[_btn_2(btnHeight)]-vPadding-[_btn_3(btnHeight)]-vPadding-[_btn_4(btnHeight)]-(>=btm)-|";

    if (_btn_1.hidden) {

        vfl5 = @"V:|-(<=top)-[_btn_2(btnHeight)]-vPadding-[_btn_3(btnHeight)]-vPadding-[_btn_4(btnHeight)]-(>=btm)-|";

    }

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl5

  options:0

  metrics:metrics

views:dict1]];

  纯净代码UI平常布局后,扩充一个函数,进行自动布局 水平居中布局:NSLayoutAttributeCenterX 垂直居中布局:NSLayoutAttributeCenterY 以及背后的布局切换动画。

- (void)setAutoLayoutForKuang:(UIView*)imgv

{

    UIView * view = self;

    [imgv setTranslatesAutoresizingMaskIntoConstraints:NO];

    NSDictionary *dict1 = NSDictionaryOfVariableBindings(imgv);

    NSDictionary *metrics = @{@"width":[NSNumbernumberWithFloat:imgv.frame.size.width],

                              @"height":[NSNumber numberWithFloat:imgv.frame.size.height],

                              @"top":[NSNumber numberWithFloat:imgv.frame.origin.y]

                              };

    NSString *vfl1 = @"[imgv(width)]";

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl1

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl2 = @"V:[imgv(height)]";

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl2

  options:0

  metrics:metrics

views:dict1]];

    [view addConstraint:[NSLayoutConstraint constraintWithItem:imgvattribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:viewattribute:NSLayoutAttributeCenterX multiplier:1 constant:0]];

    [view addConstraint:[NSLayoutConstraint constraintWithItem:imgvattribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:viewattribute:NSLayoutAttributeCenterY multiplier:1 constant:0]];

    //animation

    [UIView animateWithDuration:0.25 animations:^{

        [imgv layoutIfNeeded];

    }];

}

局地代码

单纯代码UI正常布局后,增加autolayout就能够了,调治优良实惠

那是一段水平居中,垂直并列的4个按钮布局代码

setTranslatesAutoresizingMaskIntoConstraints  是为no,开启AutoLayou.

    //-----autoLayout

    [_btn_1 setTranslatesAutoresizingMaskIntoConstraints:NO];

    [_btn_2 setTranslatesAutoresizingMaskIntoConstraints:NO];

    [_btn_3 setTranslatesAutoresizingMaskIntoConstraints:NO];

    [_btn_4 setTranslatesAutoresizingMaskIntoConstraints:NO];

    

    CGSize winSize = [[iHappySDKSingle shareSingle] getScreenSize];

    CGFloat tpo = _btn_1.frame.origin.y;

    CGFloat hpod = _btn_1.frame.origin.x;

    CGFloat btnH = _btn_1.frame.size.height;

    CGFloat vpod = winSize.width*0.15-btnH;

    

    NSNumber* tp = [NSNumber numberWithFloat:tpo];

    NSNumber* hd = [NSNumber numberWithFloat:hpod];

    NSNumber* vd = [NSNumber numberWithFloat:vpod];

    NSNumber* bh = [NSNumber numberWithFloat:btnH];

    NSNumber* btm = [NSNumber numberWithFloat:vpod*2];

    

    NSDictionary *dict1 = NSDictionaryOfVariableBindings(_btn_1,_btn_2,_btn_3,_btn_4);

    NSDictionary *metrics =@{@"hPadding":hd,@"vPadding":vd,@"top":tp,@"btm":btm,@"btnHeight":bh};

    NSString *vfl1 = @"|-hPadding-[_btn_1]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl1

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl2 = @"|-hPadding-[_btn_2]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl2

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl3 = @"|-hPadding-[_btn_3]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl3

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl4 = @"|-hPadding-[_btn_4]-hPadding-|";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl4

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl5 = @"V:|-(<=top)-[_btn_1(btnHeight)]-vPadding-[_btn_2(btnHeight)]-vPadding-[_btn_3(btnHeight)]-vPadding-[_btn_4(btnHeight)]-(>=btm)-|";

    if (_btn_1.hidden) {

        vfl5 = @"V:|-(<=top)-[_btn_2(btnHeight)]-vPadding-[_btn_3(btnHeight)]-vPadding-[_btn_4(btnHeight)]-(>=btm)-|";

    }

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl5

  options:0

  metrics:metrics

views:dict1]];

 

单纯性代码UI寻常布局后,扩展多少个函数,举行自动布局

水平居中布局:NSLayoutAttributeCenterX

笔直居中布局:NSLayoutAttributeCenterY

以及背后的布局切换动画。

- (void)setAutoLayoutForKuang:(UIView*)imgv

{

    UIView * view = self;

    [imgv setTranslatesAutoresizingMaskIntoConstraints:NO];

    NSDictionary *dict1 = NSDictionaryOfVariableBindings(imgv);

    NSDictionary *metrics = @{@"width":[NSNumbernumberWithFloat:imgv.frame.size.width],

                              @"height":[NSNumber numberWithFloat:imgv.frame.size.height],

                              @"top":[NSNumber numberWithFloat:imgv.frame.origin.y]

                              };

    NSString *vfl1 = @"[imgv(width)]";

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl1

  options:0

  metrics:metrics

views:dict1]];

    NSString *vfl2 = @"V:[imgv(height)]";

[view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl2

  options:0

  metrics:metrics

views:dict1]];

    [view addConstraint:[NSLayoutConstraint constraintWithItem:imgvattribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:viewattribute:NSLayoutAttributeCenterX multiplier:1 constant:0]];

    [view addConstraint:[NSLayoutConstraint constraintWithItem:imgvattribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:viewattribute:NSLayoutAttributeCenterY multiplier:1 constant:0]];

    //animation

    [UIView animateWithDuration:0.25 animations:^{

        [imgv layoutIfNeeded];

    }];

}

 


英特网有关小说:


1、AutoLayout(自动布局)入门    推荐

2、Autolayout及VFL经验分享      此文包括有三个demo(快速访谈下载) 推荐

3、iOS 6 Auto Layout NSLayoutConstraint 分界面布局

 

不是恋人在发愁手动些那么些类似脚本的字符:

明天援用一个开源库给大家

github:

git@OSC: 

intladdrWidth=300/2;

+ (NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFormatOptions)opts metrics:(NSDictionary *)metrics views:(NSDictionary *)views;

AutoLayout和Autoresizing Mask的区别

Autoresizing Mask是大家的故交了…假如你从前平昔是代码写UI的话,你一定写过UIViewAutoresizingFlexibleWidth之类的枚举;假如您在此以前用IB相当多的话,一定注意到过各样view的size inspector中都有三个铁灰线条的Autoresizing的提醒器和对应的动画缩放的暗中表示图,那正是Autoresizing Mask。在iOS6事先,关于荧屏旋转的适配和小米,平板电脑荧屏的自动适配,基本都是由Autoresizing Mask来产生的。可是随着大家对iOS app的须求进一步高,以及曾经以及之后只怕出现的有余显示器和分辨率的配备来讲,Autoresizing Mask显得略微落后和工巧了。AutoLayout能够成功拥有原先Autoresizing Mask能成功的劳作,同一时间仍是能够够独当一面一些原先无法完毕的任务,个中满含:

  • AutoLayout能够钦赐大肆多少个view的争持地点,而无需像Autoresizing Mask那样需求多个view在骨血的view hierarchy中。
  • AutoLayout不必需钦赐相等关系的约束,它能够钦定非相等约束(大于只怕小于等);而Autoresizing Mask所能做的布局只好是十一分条件的。
  • AutoLayout可以钦赐约束的优先级,计算frame时将优先依照满意优先级高的尺度举行总计。

总结

Autoresizing Mask是AutoLayout的子集,任何能够用Autoresizing Mask实现的专门的学业都得以用AutoLayout实现。AutoLayout还富有点Autoresizing Mask不享有的地道性子,以赞助大家更便利地塑造分界面。


relatedBy:NSLayoutRelationEqual//约束类型

- format是你的VFL字串,等下讲。

Visual Format Language 可视格式语言

UIKit共青团和少先队这一次一定有爱,估算他们友善也认为新加封锁的API名字太长了,由此他们证明了一种新的秘技来陈说约束原则,十一分有趣。这种语言是对视觉描述的一种浮泛,大约进程看起来是如此的: accept开关在cancel开关侧面暗许间距处   

最后动用VFL(Visual Format Language)描述产生那样:

1 [NSLayoutConstraint constraintsWithVisualFormat:@\"[cancelButton]-[acceptButton]"
2                                         options:0
3                                         metrics:nil
4                                           views:viewsDictionary];

内部viewsDictionary是绑定了view的名字和对象的字典,对于这些例子能够用以下方式取得相应的字典:

1 UIButton *cancelButton = ...
2 UIButton *acceptButton = ...
3 viewsDictionary = NSDictionaryOfVariableBindings(cancelButton,acceptButton);

扭转的字典为

{ acceptButton = ""; cancelButton = ""; } 

自然,不嫌累的话本身手写也未尝不可。未来字典啊数组啊写法相对简化了成都百货上千了,由此也不复杂。关于Objective-C的新语法,能够参照小编此前的一篇WWDC 二〇一一笔记:WWDC 2012 Session笔记——405 Modern Objective-C。 在view名字后边增加括号以及连接处的数字能够给予表明式愈来愈多意义,以下举香港行政局地比喻:

  • [cancelButton(72)]-12-[acceptButton(50)]
    • 收回按钮宽72point,accept按键宽50point,它们中间间距12point
  • [wideView(>=60@700)]
    • wideView宽度大于等于60point,该约束标准优先级为700(优先级最大值为1000,优先级越高的封锁越先被知足)
  • V:[redBox][yellowBox(==redBox)]
    • 竖直布局,先是三个redBox,其下方紧接一个开间等于redBox宽度的yellowBox
  • H:|-[Find]-[FindNext]-[FindField(>=20)]-|
    • 水平布局,Find距离父view左边缘暗许间隔宽度,之后是FindNext距离Find间隔暗许宽度;再然后是升幅相当大于20的Find菲尔德,它和FindNext以及父view侧边缘的距离都以暗许宽度。(竖线'|‘ 表示superview的边缘)

必威手机官网 1

VFL在程序中由帮衬:

 

@"AddrWidthNull":[[NSNumberalloc]initWithInt:laddrWidthNull],

constrainedToSize:CGSizeMake(270.0, CGFLOAT_MAX)

添加

在开创约束之后,供给将其增添到成效的view上。UIView(当然NSView也一致)插足了三个新的实例方法:

  • -(void)addConstraint:(NSLayoutConstraint *)constraint;

用来将约束增加到view。在增加时唯一要小心的是充分的靶子view要遵守以下法则:

  • 对此七个同层级view之间的牢笼关系,增添到她们的父view上

 

  • 对于四个不等层级view之间的束缚关系,增加到他俩近来的联合签名父view上

 

  • 对此有档期的顺序关系的多个view之间的约束关系,增添到等级次序较高的父view上

 

toItem:self.view//约束正视对象

- 它回到一组constraint.

multiplier:1.0f

编码格局中,

//addrView

Width:固定本人宽度

intllogoWidth=286/2;

本文由必威发布于必威-编程,转载请注明出处:alignment约束有9个可添加的类型必威手机官网:,

相关阅读