iOS 适配/ autoLayout基本知识

适配
历史
iPhone3GS、iPhone4\4s:没有屏幕适配最早开发里面的程序全部都是写死的
iPad 旋转出来之后 Autoresizing问世
iPhone5\5c\5s
兼容各种不同的情况
系统适配 ios版本适配ios6 7 8 9
屏幕适配 iPhone3.5 4.0 4.7 5.5 iPad 7.9 9.7
开发面向点去开发
5s = 320 * 480
6 = 375 * 667
6p = 414 * 736
autoResizing
必须关闭autolayout、sizeclass才能使用Autoresizing
在以前如果屏幕旋转会重写 willRotateToInterfaceOrientation 在设置一边frame
布局:
图形界面布局
外面的4 根线,实心线代表距离是控件摆放固定的位置,注意一般都是选中2 根线
内部的2 根线,横竖线表示宽度是否成比例拉伸. 当时选择的设备宽度为320,你运行在375的设备上,你设置成80就会按比例拉伸在375的设备上
局限性:解决父子控件的关系,不能解决兄弟控件的关系

代码中布局:一定在添加控件之前设置好Autoresizing
@property(nonatomic) UIViewAutoresizing autoresizingMask;
UIViewAutoresizing
UIViewAutoresizingNone 什么都没有
UIViewAutoresizingFlexibleLeftMargin —> 左边不固定,右边固定,间距随屏幕大小拉伸
UIViewAutoresizingFlexibleRightMargin —> 右边不固定,左边固定,间距随屏幕大小拉伸
UIViewAutoresizingFlexibleTopMargin —> 上边不固定,下边固定,间距随屏幕大小拉伸
UIViewAutoresizingFlexibleBottomMargin —> 下边不固定,上边固定,间距随屏幕大小拉伸
UIViewAutoresizingFlexibleWidth —> 宽度跟随父控件的宽度自动成比例拉伸
UIViewAutoresizingFlexibleHeight —> 高度跟随父控件的高度自动成比例拉伸
发现如果设置间距固定就选择相反方向的枚举属性,左边固定就用 UIViewAutoresizingFlexibleTopMargin,他的意思是右边不固定,这样左边就固定

autolayout
xcode4(6.0)出现 autolayout 但不是很火,到xcode5(ios7.0)的时候才被广泛关注
参照:参照物,相对于那个控件设置约束
约束:参照那个控件的一些约束
图形界面布局
设置:align - Add New Alignment Constrains —> (对齐方式)

Horizontal Center in Container —> 水平居中
Vertical Center in Container —> 垂直居中
设置:pin - add New Constrains —> (确定大小、尺寸)
上面4根线的作用设置距离父控件上下左右距离多少
下面width、height 设置控件自己的大小
托线设置约束
父子之间控件
Leading Space to Container Margin —> Leading Space to Container 距离父控件左边的间距
Trailing Space to Container Margin == Trailing Space to Container —> 距离父控件右边边的间距
Bottom Space to Container
Bottom Space to Container —> 距离父控件下边的间距

Center Horizontally in Container —> 与父控件水平居中
Center Vertical in Container —> 与父控件垂直居中
兄弟之间控件
Horizontal Spacing —> 相对于兄弟水平间距
Vertical Spacing —> 相对于兄弟竖直间距

Top —> 相对于兄弟上边距
Center Vertically —> 相对于兄弟垂直中心对齐
Baseline —> 文字距UI控件顶部的偏移量
Bottom —> 相对于兄弟下边距

Leading \ Left —> 相对于兄弟左边距
Center Horizontally —> 相对于兄弟水平中心对齐
Trailing \ Right —> 相对于兄弟右边距

Equal Widths —> 相对于兄弟宽度
Equal Heights —> 相对于兄弟高度
Aspect Ratio —>

Hold Shift To select multiple —> 按住Shift可以选择多个
Hold Option for alternates —> 按住Option可以替换(不好用)
代码设置约束
约束添加到who上
如果这个约束只与自己有关,那么添加到自己身上
如果这个约束自己与父控件有关,那么添加到父控件上
如果这个约束自己与其他控件有关系,那么添加到他们公共父辈的控件上
NslayoutConstraint *constraint = [NSlayoutConstraint constraintWithItem:view1 attribute:attr1 relatedBy:relation toItem:view2 attribute: attr2 multiplier:multiplier constant:c];
view1 : 要约束的view
attr1 : 那个属性(x, y, width, height)
NSLayoutAttributeLeft —> 左
NSLayoutAttributeRight —> 右
NSLayoutAttributeTop —> 上
NSLayoutAttributeBottom —> 下
NSLayoutAttributeLeading —> 左
NSLayoutAttributeTrailing —> 右
NSLayoutAttributeWidth —> 宽度
NSLayoutAttributeHeight —> 高度
NSLayoutAttributeCenterX —> 中心点X
NSLayoutAttributeCenterY —> 中心点Y
NSLayoutAttributeBaseline —> 基本线
NSLayoutAttributeLastBaseline —> 同 NSLayoutAttributeBaseline
NSLayoutAttributeFirstBaseline —> 第一条基本线
iOS8 新增约束
NSLayoutAttributeLeftMargin —> 左边距
NSLayoutAttributeRightMargin —> 右边距
NSLayoutAttributeTopMargin —> 上边距
NSLayoutAttributeBottomMargin —> 下边距
NSLayoutAttributeLeadingMargin —> 左边距
NSLayoutAttributeTrailingMargin —> 右边距
NSLayoutAttributeCenterXWithinMargins —> 中心X边距
NSLayoutAttributeCenterYWithinMargins —> 中心Y边距

NSLayoutAttributeNotAnAttribute —> 没有边距
relation : 约束关系
NSLayoutRelationLessThanOrEqual <=
NSLayoutRelationEqual ==
NSLayoutRelationGreaterThanOrEqual >=
view2 : 参照的view
attr2 : 参照的属性(x, y, width, height)
multiplier : 倍数关系
c : 额外的值, 在倍数之外的值

view1.attr1 relation(= / < / >) view2.attr2 * multiplier(倍数) + c
注意:1.一定先有父控件,再添加约束,否则会报错误.
// 使用约束一定要设置这个值,禁止系统把AutoresizingMask的一些设置转换成Autolayout
2. self.view1.translatesAutoresizingMaskIntoConstraints = NO;

Visual Format Language —> VFL 可视化格式语言

代码
H:[控件(width)]—margin[控件(width)]
H:[控件(>[email protected])]
V:[控件(height)]-margin-[控件(==控件)]
H:|-margin-[控件(width)]-margin-[控件(width)]-margin-|

width : 宽度
height : 高度
margin : 间距
H : 水平
V : 竖直

NSArray *array = [NSLayoutConstraint constraintsWithVisualFormat:VFL options:options metrics:metrics views:views];
[self.view1 addConstraints:array];
VFL : VFL语句
options : 设置这个约束的方向的一些控件对齐方式,一般不填, 如果填写就填 kNilOptions
*********************** 以后补充其属性什么意思 *******************************
views : NSDictionaryOfVariableBindings(控件变量名) —> VFL中控件对应的真实控件变量
metrics NSDictionaryOfVariableBindings(变量名): —> VFL动态值

Masonry 一个基于autolayout的第三方布局框架,大大简化了autolayout的代码
// 一定要添加到 # “Masonry”
// 所有地方都不用加前缀mas_
#define MAS_SHORTHAND
// mas_equalTo基本数据类型不需要包装(@100), 可以直接100
#define MAS_SHORTHAND_GLOBALS
写法
mas_ 开头
mas_makeConstraints:
make 创建约束器
mas_remakeConstraints: 重新创建约束,把以前的约束删掉,重新创建约束
mas_UpdateConstraints: 修改约束,覆盖以前的一些约束
尺寸:
make.size.mas_equalTo(sizeValue).multipliedBy.offset(Value);
make.width.mas_equalTo(Value);
make.height.mas_equalTo(Value);

边界:
make.left.mas_equalTo(Value);
make.right.mas_equalTo(Value);
make.leading.mas_equalTo(Value);
make.trailing.mas_equalTo(Value);
make.height.mas_equalTo(Value);
make.edges.mas_equalTo(Value).insets(UIEdgeInsetsMakeValue);

中心点:
make.center.mas_equalTo(centerValue);
make.centerY.mas_equalTo(Value);
make.centerX.mas_equalTo(Value);

另一种写法,不需要包装
make.centerX.equalTo(centerX);

规律: make.属性.equalTo/mas_equalTo(参照属性).multipliedBy.offset(值)
文字描述: 约束属性 = 参照属性 * 值 + 偏移值
动画:必须执行 layoutIfNeeded 刷新界面

一般1个控件是4个约束就能确定自己的大小与位置,如果设置多个约束会冲突
如果出现黄(警告)、红(错误)问题约束肯定有问题,所以必须设置完约束之后没有问题算约束成功

时间: 2024-12-23 19:26:39

iOS 适配/ autoLayout基本知识的相关文章

iOS适配:Masonry介绍与使用实践:快速上手Autolayout

随着iPhone的手机版本越来越多, 那么对于我们广大的开发者来说就是很悲催,之前一直使用代码里面layout的约束来适配, 现在推荐一个第三方Masonry,上手块,操作简单,只能一个字形容他 “爽”~~~ 进入正题: 1 MagicNumber -> autoresizingMask -> autolayout 以上是纯手写代码所经历的关于页面布局的三个时期 在iphone1-iphone3gs时代 window的size固定为(320,480) 我们只需要简单计算一下相对位置就好了 在i

IOS不用AutoLayout也能实现自动布局的类----MyLinearLayout横空出世

下载地址: https://github.com/youngsoft/MyLinearLayout       众所周知,对于IOS开发者来说,随着手机屏幕的尺寸在增多,不可避免的也需要考虑适配的问题了.这个问题在IOS6以前我们可以通过autoresizingMask和frame进行组合来解决视图伸缩.旋转的适配,但是这个方案不彻底还是需要编写很多的代码来完成:而在IOS6以后推出了AutoLayout的解决方案,这个方案的实现和可操作性太过于复杂和繁琐不仅编写的代码特别多,就是在XIB上进行

iOS基础——通过案例学知识之LaunchScreen、APPIcon、StatusBar、UIScrollView、UIPageControl

iOS基础--通过案例学知识之LaunchScreen.APPIcon.StatusBar.UIScrollView.UIPageControl 今天要实现的案例效果图 一.LaunchScreen 1.设置程序的LaunchScreen 在项目配置文件中配置启动页,并且在LaunchScreen.storyboard中进行布局 2.设置LaunchScreen时间 //单位:秒 [NSThread sleepForTimeInterval:1.5f]; 二.APPIcon 1.命名规则:iOS

iOS 8 AutoLayout与Size Class自悟(转载)

iOS 8 AutoLayout与Size Class自悟 Size classiOS 8 AutoLayout 前言 iOS8 和iPhone6发布已经过去蛮久了,广大的果粉终于迎来了大屏iPhone,再也不用纠结为大屏买三星舍苹果了…但是对于iOS开发人员来说,迎来了和 Android开发开发一样的问题—>各种屏幕的适配(是不是可以要求加工资的节奏).对于适配,网传各种有关Size Class的论点,前段时间太忙,一直没去研究,套用+总的话,苹果在适配方面提供的方法做的比安卓好太多了.自己实

屏幕适配/autoLayout autoresizingMask

#pragma mark-- 屏幕适配/autoLayout autoresizingMask 1> 发展历程 代码计算frame -> autoreszing(父控件和子控件的关系) -> autolayout(任何控件都可以产生关系) -> sizeclass 2> sizeclass * 仅仅是对屏幕进行了分类, 真正排布UI元素还得使用autolayout * 不再有横竖屏的概念, 只有屏幕尺寸的概念 * 不再有具体尺寸的概念, 只有抽象尺寸的概念 * 把宽度和高度各

IOS 教程以及基础知识

http://wenku.baidu.com/course/view/1ce3571252d380eb62946d8c http://iphone.apkbus.com/ www.itcast.cn //博客 http://blog.csdn.net/cutesource/article/details/7715593 // ios虚拟开发环境搭建 http://www.cnblogs.com/mjios/ //ios 博客 http://www.9ria.com/subject/summary

Masonry记录——iOS适配

Masonry是iOS适配的第三方库,比较好用的一个,本人用的也不多,简单了解一些常用的方法,自己学习中,记录下来共勉. Masonry下载地址:https://github.com/SnapKit/Masonry 示例一:View居中处理 不管什么情况下,view都处于居中状态 __weak typeof(self) weakSelf = self; UIView * view = [UIView new]; view.backgroundColor = [UIColor redColor];

iOS 8 AutoLayOut入门

http://blog.csdn.net/asdfg13697116596/article/details/42562565 iOS 8 AutoLayOut入门自从iOS6带来Auto Layout这个特性以来,用户界面的布局便变得简单起来.iOS8更是做的更好本文主要针对初学者分享一下自己最近学习AutoLayout的心得体会.Let’s Start!首先,什么是AutoLayout?简单来说,就是自动布局,当你旋转屏幕或者缩放你的UI来适应不同大小的屏幕等,程序的视图看起来依然很nice,

iOS开发多线程基础知识 NSOperation

-------NSOperation简介---- 1.NSOperation的作用 ·配合使用NSOperation和NSOperationQueue也能实现多线程编程 2.NSOperation和NSOperationQueue实现多线程的具体步骤 ·先将需要执行的操作封装到一个NSOperation对象中 ·然后将NSOperation对象添加到NSOperationQueue中 ·系统会自动将NSOperation中封装的操作放到一条新线程中执行 ---------NSOperation的