浅谈autolayout

2023-12-21 12:58
文章标签 浅谈 autolayout

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

本人录制技术视频地址:https://edu.csdn.net/lecturer/1899 欢迎观看。

Autolayout是基于约束的,描述性的布局系统。


关键词:

  • 基于约束 - 和以往定义frame的位置和尺寸不同,AutoLayout的位置确定是以所谓相对位置的约束来定义的,比如x坐标为superView的中心,y坐标为屏幕底部上方10像素等
  • 描述性 - 约束的定义和各个view的关系使用接近自然语言或者可视化语言(稍后会提到)的方法来进行描述
  • 布局系统 - 即字面意思,用来负责界面的各个元素的位置。


总而言之,AutoLayout为开发者提供了一种不同于传统对于UI元素位置指定的布局方法。以前,不论是在IB里拖放,还是在代码中写,每个UIView都会有自己的frame属性,来定义其在当前视图中的位置和尺寸。使用AutoLayout的话,就变为了使用约束条件来定义view的位置和尺寸。这样的最大好处是一举解决了不同分辨率和屏幕尺寸下view的适配问题,另外也简化了旋转时view的位置的定义,原来在底部之上10像素居中的view,不论在旋转屏幕或是更换设备(iPad或者iPhone5或者以后可能出现的mini iPad)的时候,始终还在底部之上10像素居中的位置,不会发生变化。 总结:使用约束条件来描述布局,view的frame会依据这些约束来进行计算。


本文将从三个方面对autolayout的使用进行说明:

1. 基于xib或者storyboard的自动布局;2. 用VFL代码的自动布局;3. 用第三方类库的代码实现的自动布局。


Demo:

1. 在控制器View底部添加两个View,1个蓝色,1个红色;

2. 两个View宽度,高度永远相等;

3. 举例父控件左边,右边,下边间距和两个View之间的间距相等,且均为20px。

运行效果图:

竖屏:


横屏:



基于xib或者storyboard的自动布局


1. 蓝色View添加的约束如下(距离父控件的左边,下边均为20px,自己的高度为50px):


2. 蓝色View添加的约束如下(距离父控件的右边,下边均为20,距离蓝色View的右边距离也为20)


3. 添加两者之间的相对约束



按住Control键,并且从红色View拖拽鼠标到蓝色View,会弹出如上界面,然后分别选择"Equal Widths" 和 "Equal Heights", 这样就能保证他们宽高永远一致了。

如果你像在代码中改变约束的值,也可以通过拖线的形式来实现。 比如:我想在程序中动态的修改两个View的高度,使他们的高度变成100。




然后添加以下代码即可:
self.viewHeight.constant = 100;

上面的代码执行完毕,蓝色和红色的View高度均变为100了,因为他们是相互约束的。

用VFL(Visual format language)代码的自动布局。Apple的工程师很有爱,发明了这种哭笑不得的象形文字。感觉它就是种解析方式。

UIView *blueView = [[UIView alloc] init];blueView.backgroundColor = [UIColor blueColor];blueView.translatesAutoresizingMaskIntoConstraints = NO;[self.view addSubview:blueView];UIView *redView = [[UIView alloc] init];redView.backgroundColor = [UIColor redColor];redView.translatesAutoresizingMaskIntoConstraints = NO;[self.view addSubview:redView];// 占位所用NSDictionary *metrics = @{@"margin":@20};//NSDictionary *views = @{@"blueView":blueView,@"redView":redView};// 下面的写法等价于上面的写法NSDictionary *views = NSDictionaryOfVariableBindings(redView,blueView);NSArray *constraint1 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-margin-[blueView(==redView)]-margin-[redView]-margin-|" options:NSLayoutFormatAlignAllTop | NSLayoutFormatAlignAllBottom metrics:metrics views:views];[self.view addConstraints:constraint1];// 小括号里面的参数(水平方向定宽度,垂直方向定高度)NSArray *constraint2 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[blueView(==40)]-margin-|" options:0 metrics:metrics views:views];[self.view addConstraints:constraint2];

看到上面的写法,真是一眼难尽啊!!!
H:|-margin-[blueView(==redView)]-margin-[redView]-margin-|
像这样的写法,可读性真是太差了。大家可作为了解,本人就不解释了。

用第三方类库的代码实现的自动布局

这里,我介绍两款:
一个是UIView+AutoLayout, 它是一个UIView的分类。下载地址:https://github.com/smileyborg/UIView-AutoLayout

代码实现:
[self.redView autoSetDimension:ALDimensionHeight toSize:50];[self.redView autoPinEdgeToSuperviewEdge:ALEdgeLeft withInset:20];[self.redView autoPinEdgeToSuperviewEdge:ALEdgeBottom withInset:20];[self.blueView autoMatchDimension:ALDimensionHeight toDimension:ALDimensionHeight ofView:self.redView];[self.blueView autoPinEdgeToSuperviewEdge:ALEdgeRight withInset:20];[self.blueView autoPinEdgeToSuperviewEdge:ALEdgeBottom withInset:20];[self.blueView autoPinEdge:ALEdgeLeft toEdge:ALEdgeRight ofView:self.redView withOffset:20];[self.blueView autoMatchDimension:ALDimensionWidth toDimension:ALDimensionWidth ofView:self.redView];

对比VFL,可读性真是好多了。

另一个是 Masonry, 更加的面向对象了,而且很多都是用block实现的。 下载地址:https://github.com/SnapKit/Masonry

代码实现:
__weak typeof(self) ws = self;UIView *sv1 = [[UIView alloc] init];sv1.backgroundColor = [UIColor redColor];[self.view addSubview:sv1];UIView *sv2 = [[UIView alloc] init];sv2.backgroundColor = [UIColor blueColor];[self.view addSubview:sv2];CGFloat padding = 20;[sv1 mas_makeConstraints:^(MASConstraintMaker *make) {make.bottom.mas_equalTo(ws.view.mas_bottom).with.offset(-padding);make.left.mas_equalTo(ws.view.mas_left).with.offset(padding);make.right.mas_equalTo(sv2.mas_left).with.offset(-padding);make.height.mas_equalTo(50);}];[sv2 mas_makeConstraints:^(MASConstraintMaker *make) {make.bottom.mas_equalTo(ws.view.mas_bottom).with.offset(-padding);make.right.mas_equalTo(ws.view.mas_right).with.offset(-padding);make.height.mas_equalTo(sv1.mas_height);make.width.mas_equalTo(sv1.mas_width);}];



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



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

相关文章

浅谈主机加固,六种有效的主机加固方法

在数字化时代,数据的价值不言而喻,但随之而来的安全威胁也日益严峻。从勒索病毒到内部泄露,企业的数据安全面临着前所未有的挑战。为了应对这些挑战,一种全新的主机加固解决方案应运而生。 MCK主机加固解决方案,采用先进的安全容器中间件技术,构建起一套内核级的纵深立体防护体系。这一体系突破了传统安全防护的局限,即使在管理员权限被恶意利用的情况下,也能确保服务器的安全稳定运行。 普适主机加固措施:

浅谈PHP5中垃圾回收算法(Garbage Collection)的演化

前言 PHP是一门托管型语言,在PHP编程中程序员不需要手工处理内存资源的分配与释放(使用C编写PHP或Zend扩展除外),这就意味着PHP本身实现了垃圾回收机制(Garbage Collection)。现在如果去PHP官方网站(php.net)可以看到,目前PHP5的两个分支版本PHP5.2和PHP5.3是分别更新的,这是因为许多项目仍然使用5.2版本的PHP,而5.3版本对5.2并不是完

浅谈java向上转型和乡下转型

首先学习每一种知识都需要弄明白这知识是用来干什么使用的 简单理解:当对象被创建时,它可以被传递给这些方法中的任何一个,这意味着它依次被向上转型为每一个接口,由于java中这个设计接口的模式,使得这项工作不需要程序员付出任何特别的努力。 向上转型的作用:1、为了能够向上转型为多个基类型(由此而带来的灵活性) 2、使用接口的第二个原因却是与使用抽象基类相同,防止客户端创建该类的对象,并确保这仅仅

【前端安全】浅谈XSS攻击和防范

定义 XSS是跨站脚本攻击(Cross Site Scripting),为不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆,故将跨站脚本攻击缩写为XSS。 恶意攻击者往Web页面里插入恶意Script代码,当用户浏览该页之时,嵌入其中Web里面的Script代码会被执行,从而达到恶意攻击用户的目的。 分类 大分类小分类原理非存储DOM型① 不需要经过服务器

水处理过滤器运行特性及选择原则浅谈

过滤属于流体的净化过程中不可缺的处理环节,主要用于去除流体中的颗粒物或其他悬浮物。水处理过滤器的原理是利用有孔介质,从流体中去除污染物,使流体达到所需的洁净度水平。         水处理过滤器的滤壁是有一定厚度的,也就是说过滤器材具有深度,以“弯曲通 道”的形式对去除污染物起到了辅助作用。过滤器是除去液体中少量固体颗粒的设备,当流体进入置有一定规格滤网的滤筒后,其杂质被阻挡,而

浅谈NODE的NPM命令和合约测试开发工具HARDHAT

$ npm install yarn -g  # 将模块yarn全局安装 $ npm install moduleName # 安装模块到项目目录下 默认跟加参数 --save 一样 会在package文件的dependencies节点写入依赖。   $ npm install -g moduleName # -g 的意思是将模块安装到全局,具体安装到磁盘哪个位置,要看 npm root -g

浅谈SOC片上系统LoRa-STM32WLE5数据安全防御机制

随着物联网设备的普及,数以亿计的设备正在通过无线网络进行通信,传输大量的敏感数据。这种大规模的设备联网带来了便捷性,但也伴随着巨大的安全风险。SoC片上系统通过将无线通信、处理器、存储和安全机制集成在同一个芯片中,为物联网应用提供了高度集成的解决方案。这种设计大大简化了硬件开发流程,同时提高了设备的整体性能和安全性。SoC不仅能够满足长距离、低功耗的无线通信需求,还能通过先进的加密技术,确保数据在

浅谈RabbitMQ的基石—高级消息队列协议(AMQP)

点击上方蓝色字体,选择“设为星标” 回复”资源“获取更多资源 大数据技术与架构 点击右侧关注,大数据开发领域最强公众号! 大数据真好玩 点击右侧关注,大数据真好玩!     前言 自从去年做了不少流式系统(Flink也好,Spark Streaming也好)对接RabbitMQ的实时作业。之前一直都在Kafka的领域里摸爬滚打,对RabbitMQ只是有浅薄的了解而已。随着自己逐渐把R

iOS浅谈模拟器弹不出键盘的问题

前言:昨天帮一个小伙伴调试程序的时候,在模拟器上发现一个问题,就是点击UITextField之后,弹不出键盘...可能有的朋友要说了,那还不容易,你直接Toggle Software Keyboard(command+k)不就解决了吗,可是试了好几遍就是弹不出键盘,不知道是什么鬼1.首先分析一下command+K为什么没有作用....由于在iOS8.0及以后的模拟器中,Xcode默认是使用电脑键

浅谈params修饰符

C#中,使用params关键字来支持参数数组的使用。params关键字可以把可变数量的相同类型的参数作为单个逻辑参数传递给方法、同样地,如果调用者为调用方法传入强类型数组或者以逗号分隔的参数项列表,params修饰符标记的参数就可以被处理。 为了更加直观,给出下面的例子,例子中,我们分别通过数组方式、参数项列表方式来调用求和函数。可以看到,传入零个参数时,也可以被处理。当以参数项列表方式调用方法时