AutoLayout详解

2024-05-14 02:08
文章标签 详解 autolayout

本文主要是介绍AutoLayout详解,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在一些群里看到很多朋友还是停留在Frame布局的痛苦时代,今天小编在这里和你讲述一下苹果推荐的布局方式AutoLayout.

AutoLayout是什么?

Autolayout是一种布局技术,专门用来布局UI界面的。用来取代Frame布局在遇见屏幕尺寸多重多样的不足
Autolayout自iOS6开始引入,由于Xcode4的不给力,当时并没有得到很大的推广
在iOS7(Xcode5)开始,Autolayout的开发效率得到很大的提升
苹果官方也推荐开发者尽量使用Autolayout来布局UI界面
Autolayout能轻松的解决屏幕适配的问题

AutoLayout很难?

起初我也觉得它很难,各种约束不知道怎么添加,也挺抽象的,不过现在这方面的资料也是很多了,还有大牛编写了一些用代码自动布局的第三方库。这里小编将讲述的是在storyboard中设置约束,希望能让你们有所收获!

AutoLayout从何下手?
首先创建一个空的工程,这里过于简单,就不加以描述了。这里写图片描述

自从Xcode6之后 你会发现storyboard中任何一个ViewController的View非常大,跟任何一个iPhone iPad的尺寸都不一样 ,这些都是 假象 假象 假象(重要的事情说三遍),但是如果你在view上放了一个label,然后不设置任何约束的话,可能你会惊讶,为什么我明明把label放在了view的中间,为什么运行出来的结果是不一样的呢?至于这个问题的回答,你们自己去领悟吧。
我们回顾一下以前用Frame布局的时候,需要些什么元素:
(x,y,width,height)这里的4个元素缺了一个都不行。那么同样,使用AutoLayout布局,同样也需要确定一个view的X,Y,W,H 。少一个都不行(此处不讨论带有内建高度的控件)。

Demo1.某个view距离父view上下左右的距离都是30
这里写图片描述

请注意我这里把Constrain to margins 的勾给去掉了,如果不去掉的话,它会在手机上自带有左右边距。另外我这里把距离上面的, 也就是Top LayoutGuide的约束改成了距离控制器的View,为什么?
因为Top LayoutGuide是晚于View加载的,如果参考这个会造成进入页面会卡一下 ,尽量不要直接参考上面 Top LayoutGuide 则没事,同样上面的Bottom LayoutGuide也改了。
加完约束你会发现貌似并没有什么效果?
不是的,屏幕中出现的黄色的线条 这是IB在提升我们你所添加的约束。接下来运行试试

这里写图片描述

Demo2.某个View距离在父View的左侧30 上30 宽高为 50 ,50
这里写图片描述

注意这里我对第二个view添加约束的时候,选择了上,左,然后固定宽,高。还有就是autolayout的核心就是参照,既然我们想让第二个view在父view的左30,上30,那么我们约束的时候选择的参照物是父view,在这个例子中,参照的是蓝色的那个父view。

运行结果:
这里写图片描述

Demo3 某个View距离在父View的左侧30,与demo2中紫色View 下边20 宽高和Demo2中的宽高一样
这里写图片描述

这里给大家说点其他的,如果在storyboard中某个view的子view太多的话,我们可以给它起一个别名,然后我们如果是想对两个view进行等宽和等高约束的话,选中两个view,然后勾选等宽,等高的约束即可

运行结果:
这里写图片描述

Demo4 假设某个View距离父View右上角30 ,30 宽高比 2:1 宽100
这里写图片描述

这个例子中可以看出我们可以修改已经添加好的约束值。比如这里默认的比例出来的是15:8,并不是我们想要的2:1,我们就可以对约束值进行修改。

运行结果:
这里写图片描述

好了,各位看官看到这里估计就会觉得原来autoLayout也并没有想象中的那么难了,当然这里的例子也是比较单一的,而且还没有添加任何动画。不过,有了这些基础才能够更快的吸收难一点的呀。如果有任何疑问,欢迎联系!

这篇关于AutoLayout详解的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/987454

相关文章

Go语言使用select监听多个channel的示例详解

《Go语言使用select监听多个channel的示例详解》本文将聚焦Go并发中的一个强力工具,select,这篇文章将通过实际案例学习如何优雅地监听多个Channel,实现多任务处理、超时控制和非阻... 目录一、前言:为什么要使用select二、实战目标三、案例代码:监听两个任务结果和超时四、运行示例五

Linux线程同步/互斥过程详解

《Linux线程同步/互斥过程详解》文章讲解多线程并发访问导致竞态条件,需通过互斥锁、原子操作和条件变量实现线程安全与同步,分析死锁条件及避免方法,并介绍RAII封装技术提升资源管理效率... 目录01. 资源共享问题1.1 多线程并发访问1.2 临界区与临界资源1.3 锁的引入02. 多线程案例2.1 为

Python使用Tenacity一行代码实现自动重试详解

《Python使用Tenacity一行代码实现自动重试详解》tenacity是一个专为Python设计的通用重试库,它的核心理念就是用简单、清晰的方式,为任何可能失败的操作添加重试能力,下面我们就来看... 目录一切始于一个简单的 API 调用Tenacity 入门:一行代码实现优雅重试精细控制:让重试按我

Python标准库之数据压缩和存档的应用详解

《Python标准库之数据压缩和存档的应用详解》在数据处理与存储领域,压缩和存档是提升效率的关键技术,Python标准库提供了一套完整的工具链,下面小编就来和大家简单介绍一下吧... 目录一、核心模块架构与设计哲学二、关键模块深度解析1.tarfile:专业级归档工具2.zipfile:跨平台归档首选3.

idea的终端(Terminal)cmd的命令换成linux的命令详解

《idea的终端(Terminal)cmd的命令换成linux的命令详解》本文介绍IDEA配置Git的步骤:安装Git、修改终端设置并重启IDEA,强调顺序,作为个人经验分享,希望提供参考并支持脚本之... 目录一编程、设置前二、前置条件三、android设置四、设置后总结一、php设置前二、前置条件

python中列表应用和扩展性实用详解

《python中列表应用和扩展性实用详解》文章介绍了Python列表的核心特性:有序数据集合,用[]定义,元素类型可不同,支持迭代、循环、切片,可执行增删改查、排序、推导式及嵌套操作,是常用的数据处理... 目录1、列表定义2、格式3、列表是可迭代对象4、列表的常见操作总结1、列表定义是处理一组有序项目的

python使用try函数详解

《python使用try函数详解》Pythontry语句用于异常处理,支持捕获特定/多种异常、else/final子句确保资源释放,结合with语句自动清理,可自定义异常及嵌套结构,灵活应对错误场景... 目录try 函数的基本语法捕获特定异常捕获多个异常使用 else 子句使用 finally 子句捕获所

C++11范围for初始化列表auto decltype详解

《C++11范围for初始化列表autodecltype详解》C++11引入auto类型推导、decltype类型推断、统一列表初始化、范围for循环及智能指针,提升代码简洁性、类型安全与资源管理效... 目录C++11新特性1. 自动类型推导auto1.1 基本语法2. decltype3. 列表初始化3

SQL Server 中的 WITH (NOLOCK) 示例详解

《SQLServer中的WITH(NOLOCK)示例详解》SQLServer中的WITH(NOLOCK)是一种表提示,等同于READUNCOMMITTED隔离级别,允许查询在不获取共享锁的情... 目录SQL Server 中的 WITH (NOLOCK) 详解一、WITH (NOLOCK) 的本质二、工作

springboot自定义注解RateLimiter限流注解技术文档详解

《springboot自定义注解RateLimiter限流注解技术文档详解》文章介绍了限流技术的概念、作用及实现方式,通过SpringAOP拦截方法、缓存存储计数器,结合注解、枚举、异常类等核心组件,... 目录什么是限流系统架构核心组件详解1. 限流注解 (@RateLimiter)2. 限流类型枚举 (