自动布局第二篇

作者: 人魔七七 | 来源:发表于2017-12-01 16:58 被阅读181次

例子一:几个View之间以及距离父视图相等

效果图 红线的地方设置相等

主要有三个方法,主要讲述第一个简单的方法,还是UIStackView的使用,我们知道有一个space属性可以设置间距,我们让三个image之间的space加上UIStackView左右的间距相等不就可以了。

怎么计算呢由于我们知道image的宽度,把父视图的View减去image*3然后除以4不就可以了?

直接从SB拖拽image宽度约束

这个是image的宽度约束可以直接从SB拖拽得到,然后设置UIStackView space属性。注意你在控制器里的viewDidLayoutSubviews会得到最后的frame

写在viewDidLayoutSubviews中

但是还缺少最后一步你发现整个StackView位置不居中,因为根据自动布局的布局engine来说这个过程是延迟的,不能马上看到效果,此时你需要强制更新布局[self.view layoutIfNeeded];

下面说下另外两个方法的思路。

第二种方法类似一个虚拟的View放到间距中间设置虚拟的View相等就可以了,UILayoutGuide用这个代替View吧,这是苹果的用来做虚拟占位用的。

第三种方法可以用Masonry 的一个方法可以直接设置等间距效果,可以去看下文档就了解了。

例子二:cell自适应高度。由于iOS11已经出现,不讲述8.0以下的方案。对于高度缓存什么的可以自己做,这里只说思路。

cell自适应

实现思路第一步Label设置高度,下面详情设置Label的preferredMaxLayoutWidth 这个要自己计算下,设置行数为0,第二步设置详情Label的 内容的ContentHugging以及ContentCompression优先级比较高,这样防止被压缩,内容也可以紧紧的抱住。第三步骤就是其他控件的正常设置。

注意一个问题:preferredMaxLayoutWidth设置有问题的话,两个Label之间间距会有问题,文字越多间距越大,所以要正确设置preferredMaxLayoutWidth。

接下来就是tableView 的设置

8.0以后可以用这个对于性能自己优化比如cache 一切可以cache的东西

代码地址:https://github.com/renmoqiqi/AutolayoutDemo

相关文章

  • 自动布局第二篇

    例子一:几个View之间以及距离父视图相等 主要有三个方法,主要讲述第一个简单的方法,还是UIStackView的...

  • Auto Layout中Stack View的使用

    这是关于自动布局的第二篇文章。<< Auto Layout的使用 上一篇文章介绍了如何使用Auto Layout,...

  • iOS开发之 自动布局

    iOS开发之自动布局AutoLayout 目录: 1 iOS自动布局简介2 iOS自动布局AutoLayout(代...

  • 【OC梳理】自动布局

    自动布局基础篇 关于自动布局的基本使用,参考网上的文章即可,如:iOS开发-自动布局篇:史上最牛的自动布局教学! ...

  • iOS 布局方案

    布局方案 绝对布局 自动布局

  • 初见FLEX

    FLEX布局 一种新的布局方式,flex布局 flex布局与方向无关 flex布局可以实现空间自动分配、自动对齐。...

  • 通过storyboard来自动布局ScrollView(不依靠代

    在做自动布局之前首先大家都知道一个自动布局,自动布局在我理解就是为了适配任何的屏幕。每一个控件的自动布局都是为了确...

  • iOS原生布局简介

    自动布局核心公式 自动布局构造函数 自动布局类函数 VFL可视化格式语言 H 水平方向 V 垂直方向 | 边界 [...

  • Flex——告别CSS布局

    Flex 布局可以实现空间自动分配、自动对齐Flex 适用于简单的线性布局,复杂布局使用 Grid 布局注意:设为...

  • 最轻巧的自动布局--ZXPAutoLayout框架

    最轻巧的自动布局--ZXPAutoLayout框架 最轻巧的自动布局--ZXPAutoLayout框架

网友评论

    本文标题:自动布局第二篇

    本文链接:https://www.haomeiwen.com/subject/rmuwbxtx.html