继续Auto Layout - BNR篇。

打开BNRDetailViewController.m文件,重载viewDidLoad方法来创建UIImageView对象。当你想要给通过加载NIB文件创建的视图层级添加约束时,需要重载viewDidLoad方法。如下:

 - (void)viewDidLoad {
[super viewDidLoad]; UIImageView *iv = [[UIImageView alloc] initWithImage:nil];
iv.contentMode = UIViewContentModeScaleAspectFill;
iv.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:iv];
self.imageVeiw = iv;
}

  每个视图都有一个 translatesAutoresizingMaskIntoConstraints 属性,默认为YES,即iOS会自动创建一些约束来匹配视图自动调整。

  Apple推荐使用Visual Format Language(VFL)来程序化创建约束。


VFL:一种用字符串常量来描述约束的方式。

   @"H:|-0-[imageView|-0-" ,其中H:指该约束是针对水平位置的。方括号内的imageView指要约束的视图。符号|表示视图的容器。此字符串表示:imageView离其容器左右边缘的距离为0点。同时,可简化为: @"H:|[imageView|"

   @"V:[dateLabel]-8-[imageView]-8-[tooBar]" ,其指imageView的顶部离dateLabel的距离为8点,imageView的底部离tooBar的距离为8点。可简化为: @"V:[dateLabel]-[imageView]-[tooBar]"

   @"V:[someView(==50)]" ,指视图的高度约束为50点。


  一个约束即NSLayoutConstraint类的对象,可将其添加到一个视图中。

修改viewDidLoad方法,创建imageView水平和垂直方向的约束。如下:

 - (void)viewDidLoad {
[super viewDidLoad]; UIImageView *iv = [[UIImageView alloc] initWithImage:nil];
iv.contentMode = UIViewContentModeScaleAspectFill;
iv.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:iv];
self.imageVeiw = iv; NSDictionary *nameMap = @{@"imageVeiw":self.imageVeiw, @"dateLabel":self.dateLabel, @"toolBar":self.toolBar};
NSArray *horizontalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-0-[imageVeiw]-0-|"
options:
metrics:nil
views:nameMap];
NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[dateLabel]-[imageVeiw]-[toolBar]"
options:
metrics:nil
views:nameMap];
}

NSLayoutConstraint的类方法constraintsWithVisualFormat:options:metrics:views的第四个参数为:视觉格式化字符串中的名字与视图层级中的名字的映射。


添加约束的规则:

1)如果一个约束影响了两个具有相同父视图的view,则约束应添加到父视图中。

2)如果一个约束只影响到一个视图,该约束应添加到其所影响的视图中。

3)如果一个约束影响了两个不具有相同父视图的view,但共享一个ancestor,则该ancestor获得该约束。

4)如果一个约束影响一个视图和其父视图,则该约束添加到父视图中。

  因此,在viewDidLoad方法中,将创建的约束添加到父视图中,添加如下粗体代码:

     NSArray *verticalConstraints = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[dateLabel]-[imageView]-[toolBar]"
options:
metrics:nil
views:nameMap];
[self.view addConstraints:horizontalConstraints];
[self.view addConstraints:verticalConstraints];

  Intrinsic Content Size:指一个视图的大小基于其要显示的内容。

contentCompressionResistancePriority 当其值小于1000时,Auto Layout可能压缩视图。

contentHuggingPriority 当其值小于1000时,Auto Layout可能增加视图的大小。

viewDidLoad方法添加代码如下:

     ......
self.imageVeiw = iv; [self.imageVeiw setContentHuggingPriority: forAxis:UILayoutConstraintAxisVertical];
[self.imageVeiw setContentCompressionResistancePriority: forAxis:UILayoutConstraintAxisVertical];
......

创建基于比率的约束时,不能使用VFL,此时需要用到NSLayoutConstraint类的 constraintWithItem:attribute:relatedBy:toItem:attribute:multiplier:constant: 类方法。其中multiplier属性是创建基于比率约束的关键。

 NSLayoutConstraint *aspectConstraint = [NSLayoutConstraint constraintWithItem:self.imageVeiw
attribute:NSLayoutAttributeWidth
relatedBy:NSLayoutRelationEqual
toItem:self.imageVeiw
attribute:NSLayoutAttributeHeight
multiplier:1.5
constant:0.0];

添加的约束相当于 imageVeiw.width = 1.5 * imageVeiw.height + 0.0 。


  autoresizing masks:约束一个视图和其父视图的关系,但不会影响同级视图间的关系。默认情况下,会基于autoresizing masks,给视图创建和添加约束。但其经常会与用程序代码添加的约束发生冲突。此时,只需将视图的 translatesAutoresizingMaskIntoConstraints 属性设为NO即可。

Auto Layout: Programmatic Constraints - BNR的更多相关文章

  1. iOS Programming Auto Layout: Programmatic Constraints 自动布局:通过编程限制

    iOS Programming  Auto Layout: Programmatic Constraints  1.  However, if your views are created in co ...

  2. Auto Layout Guide----(二)-----Auto Layout Without Constraints

    Auto Layout Without Constraints 没有约束的自动布局 Stack views provide an easy way to leverage the power of A ...

  3. Auto Layout Guide----(一)-----Understanding Auto Layout

    Understanding Auto Layout 理解自动布局 Auto Layout dynamically calculates the size and position of all the ...

  4. Auto Layout Guide----(三)-----Anatomy of a Constraint

    Anatomy of a Constraint 剖析约束 The layout of your view hierarchy is defined as a series of linear equa ...

  5. Auto Layout - BNR

    继续UIImageView - BNR篇. 通过Homepwner TARGETS -> General -> Deployment Info -> Devices中的iPhone改 ...

  6. iOS 8 Auto Layout界面自动布局系列2-使用Xcode的Interface Builder添加布局约束

    http://blog.csdn.net/pucker/article/details/41843511 上一篇文章<iOS 8界面自动布局系列-1>简要介绍了iOS界面布局方式的前世今生 ...

  7. 手写代码自动实现自动布局,即Auto Layout的使用

    手写代码自动实现自动布局,即Auto Layout的使用,有需要的朋友可以参考下. 这里要注意几点: 对子视图的约束,若是基于父视图,要通过父视图去添加约束. 对子视图进行自动布局调整,首先对UIVi ...

  8. Auto Layout

    Auto Layout XCode5+ Auto Layout Concepts 核心的概念是约束. Constraint Basics Constant value Relation Priorit ...

  9. 使用Auto Layout中的VFL(Visual format language)--代码实现自动布局【转】

    本文将通过简单的UI来说明如何用VFL来实现自动布局.在自动布局的时候避免不了使用代码来加以优化以及根据内容来实现不同的UI. 一:API介绍 NSLayoutConstraint API 1 2 3 ...

随机推荐

  1. 什么是DevOps?

    一. 什么是DevOps 是什么? DevOps (英文 Development 和 Operations 的组合)是一组过程.方法与系统的统称,用于促进开发(应用程序 / 软件工程).技术运营和质量 ...

  2. Spring Boot 系列总目录

    一.Spring Boot 系列诞生原因 上学那会主要学的是 Java 和 .Net 两种语言,当时对于语言分类这事儿没什么概念,恰好在2009年毕业那会阴差阳错的先找到了 .Net 的工作,此后就开 ...

  3. Spring Boot(九)Swagger2自动生成接口文档和Mock模拟数据

    一.简介 在当下这个前后端分离的技术趋势下,前端工程师过度依赖后端工程师的接口和数据,给开发带来了两大问题: 问题一.后端接口查看难:要怎么调用?参数怎么传递?有几个参数?参数都代表什么含义? 问题二 ...

  4. React Fiber 数据结构揭秘

    此章节会通过两个 demo 来展示 Stack Reconciler 以及 Fiber Reconciler 的数据结构. 个人博客 首先用代码表示上图节点间的关系.比如 a1 节点下有 b1.b2. ...

  5. 基于SpringMVC+Spring+MyBatis实现秒杀系统【业务逻辑】

    前言 该篇主要实现秒杀业务层,秒杀业务逻辑里主要包括暴露秒杀接口地址.实现秒杀业务逻辑.同时声明了三个业务类:Exposer.SeckillExecution.SeckillResult. Expos ...

  6. 内存管理-MRC与ARC详解

    Objective-C提供了两种内存管理机制MRC(Mannul Reference Counting)和ARC(Automatic Reference Counting),为Objective-C提 ...

  7. Lambda表达式资料整理

    重温委托,匿名方法,Lambda,泛型委托,表达式树   第一:委托 有些教材,博客说到委托都会提到事件,虽然事件是委托的一个实例,但是为了理解起来更简单,今天只谈委托不谈事件.先上一段代码: 下边的 ...

  8. JAVA_内部类

    内部类 什么是内部类? 将一个类A定义在另一个类B里面,里面的那个类A就称为内部类,B则称为外部类 成员内部类:定义在类中方法外的类 定义格式示例: public class Tesdt { publ ...

  9. Java开发笔记(六十五)集合:HashSet和TreeSet

    对于相同类型的一组数据,虽然Java已经提供了数组加以表达,但是数组的结构实在太简单了,第一它无法直接添加新元素,第二它只能按照线性排列,故而数组用于基本的操作倒还凑合,若要用于复杂的处理就无法胜任了 ...

  10. Lucene.Net3.0.3+盘古分词器学习使用

    一.Lucene.Net介绍 Lucene.net是Lucene的.net移植版本,是一个开源的全文检索引擎开发包,即它不是一个完整的全文检索引擎,而是一个全文检索引擎的架构,提供了完整的查询引擎和索 ...