http://www.raywenderlich.com/113768/adaptive-layout-tutorial-in-ios-9-getting-started

iOS布局和屏幕适配的一点总结

曾经,iOS开发是不需要考虑屏幕适配问题的,因为只有一种屏幕尺寸。而现在已经有了4种屏幕,4,5,6,6P,因此屏幕适配也成了iOS开发中必须考虑的问题。并且,这4种屏幕的宽高比全部都不一样,所以简单的按比例缩放并不能解决问题。我们最近做的一个APP也处理了屏幕适配,本文简单总结一下
根据屏幕类型判断
我不知道有没有更好的办法,我们的做法是根据设备类型,写一些if...else,或者switch语句
判断机型可以使用screen的height(不能使用width,因为4和5的width是一样的,都是320),也可以使用API里的宏,都差不多。我个人感觉,if...else似乎是不可避免的,虽然有auto layout,但是有一些大的布局改动,或者字体大小,不用判断似乎是无法解决的
比如说,为了达到最佳显示效果,我们在大的屏幕上使用CollectionView,而在4S上使用TableView,用自动布局应该是没有办法做到的。或者根据屏幕的大小,切换字体大小,好像也只能通过if...else来实现
根据屏幕类型适配,代码类似:
Objc代码 收藏代码
if(screenType == LosScreenType6P){
layout.minimumInteritemSpacing = 30;
}else if(screenType == LosScreenType5){
layout.minimumInteritemSpacing = 5;
}else{
layout.minimumInteritemSpacing = 15;
}

frame计算
我们也用了比较多的“硬计算”,比如对于UICollectionView里的每个cell的width,我们是这么处理的:
Objc代码 收藏代码
CGRect rect = [[UIScreen mainScreen] bounds];
screenWidth = rect.size.width;
cellWidth = (screenWidth - 30) / 3;
cellHeight = cellWidth * 0.8 + 50;

Objc代码 收藏代码
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath
{
return CGSizeMake(cellWidth, cellHeight);
}

我们规定CollectionView里每行有3个单元格,整个section的左右间距是10,列间距是5,因此计算出 (width - 30) / 3就是每个单元格的宽度,单元格的高度也是经过计算写死的
我不太确定这种方式好不好,不过对于这个页面是好使的。类似这种基于屏幕尺寸做计算的方法,APP里在几个页面都有用到
Masonry
Masonry是我们实现屏幕适配的重要手段之一,本质上是界面约束的语法糖。基本上,我们的做法是:大的页面关系,用计算完成;每个小块里面的相对位置关系,用Masonry来做。在有些场景下,Masonry有非常大的优势。比如说:
1、设置某个View的宽高比
Objc代码 收藏代码
[thumbImageView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(@0);
make.left.equalTo(@0);
make.width.equalTo(self);
make.height.equalTo(thumbImageView.mas_width).multipliedBy(0.8);
}];

此View的宽度与父View同宽,高度是宽度的0.8
2、设置居中,设置相对边距
Objc代码 收藏代码
[authorName mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerY.equalTo(avatarImageView);
make.left.equalTo(avatarImageView.mas_right).offset(5);
make.right.equalTo(@-5);
}];

垂直方向与另一个View对齐,左边距离上一个元素的右边5,右边距离父View右边5
类似这种布局,用frame来写会复杂很多,如果再考虑屏幕适配,需要非常多代码。这类的需求,Masonry堪称神器。不过使用中发现,用Masonry布局的View,我们通常会init,或者initWithFrame:CGRectZero。这个View直到经过Masonry处理以后,它的origin和size才能确定,如果在此之前就用到它的origin和size,就会有问题
整体替换UIView
对于适配后变化不大的页面,把if...else写在UIView里,但是有个别页面,完全要根据设备显示不同的View。这种情况比较适合在Controller里做判断,然后load不同的View

AutoLayout适配的更多相关文章

  1. 利用AutoLayout适配滚动视图和表视图

    1.新增一个contentView,设置为与滑动视图的父视图等高等宽. 2.利用代码 if(_MyTestTableView.frame.size.height != _MyTestTableView ...

  2. 适配----Autolayout

    AutLayout 相对布局,根据参照视图的位置 来定义自己的位置.通过约束视图和视图之间的关系来分配屏幕上的位置,通常与VFL语言配合使用 VFL(visual format language)视觉 ...

  3. iOS - AutoLayout

    前言 NS_CLASS_AVAILABLE_IOS(6_0) @interface NSLayoutConstraint : NSObject @available(iOS 6.0, *) publi ...

  4. 初识 AutoLayout

    一.使用"公式": 1.frame: 原点以及自身的位置来确定自身的位置 2.autoLayout: 根据参照视图的位置  来定义自己的位置 3.autoLayout: 相对布局  ...

  5. 用launchscreen.storyboard适配启动图方法(二)

    背景 之前有写一篇实现方式比较简单的随笔用launchscreen.storyboard适配启动图方法,顺便在评论区提了一下用autolayout适配启动图的思路,现把思路和流程记录下来. 思路 整体 ...

  6. Shou 团队诚意满满的招募 Swifter

    一.团队介绍 团队产品 VPlayer 播放器靠自增长 3 年内获得全球 4000 万用户,开发的 Vitamio 组件更是获得微博.UC.金山等知名企业授权使用.—— 团队再次起航,经历一年多我们已 ...

  7. IOS页面自动布局 之 NSLayoutConstraint基础篇

    使用AutoLayout之前需要知道以下两点: 1.必须设置 translatesAutoresizingMaskIntoConstraints为NO. 2.如果是viewControl则AutoLa ...

  8. 新闻头条应用源码ios版

    <ignore_js_op>      源码下载:http://code.662p.com/view/13343.html     作者ymcao,源码TopNewsIOS,新闻头条IOS ...

  9. iOS技术

    iOS技术 OC:分类(好处,和延展的区别) 分类: 在不修改原有的类的基础上增加新的方法  一个庞大的类可以分模块开发 一个庞大的类可以由多个人来编写,更有利于团队合作 分类是对原有类的一种扩展,在 ...

随机推荐

  1. Unity3d 读取网络xml

    Unity3d 读取网络xml Unity3d 读取网络xml,这个xml文件需要不包含BOM信息,可以用UltraEdit打开xml文件,并且另存为的时候,选择不包含BOM的utf-8格式存储!

  2. Git初体验

    http://www.cnblogs.com/yejiurui/archive/2013/07/29/3223153.html

  3. 24篇Delphi文件操作文章

    http://www.cnblogs.com/keyvip/category/268043.html

  4. JPA学习笔记

    一.JPA基础1.1 JPA基础JPA: java persistence api 支持XML.JDK5.0注解俩种元数据的形式,是SUN公司引入的JPA ORM规范 元数据:对象和表之间的映射关系 ...

  5. The Cow Lexicon(dp)

    Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 7290   Accepted: 3409 Description Few k ...

  6. bzoj3275

    容易想到是最小割(最大权独立集)然后每个数拆成两个点,不能同时选的之间连边跑最小割,最后答案=总数-mincut/2 因为这样建图将流量变成了原来的两倍 当然这道题更好的建图方法是分成奇数和偶数两个集 ...

  7. Linux Shell编程(5)——shell特殊字符(下)

    {}代码块[花括号]. 这个结构也是一组命令代码块,事实上,它是匿名的函数.然而与一个函数所不同的,在代码块里的变量仍然能被脚本后面的代码访问. bash$ { local a;      a=123 ...

  8. 201512读书分享——读《做自己的No.1》“哪一天”是永远不会到来的

    在看这本书的同时,最近也看了一部电影叫做<令人怦然心动的人生整理魔法>,讲一个女孩子平常不善收理,然后房间和人生乱七八糟,她总想着“等哪一天有空了就收拾”.但是,最终一句话打醒了——“哪一 ...

  9. getElementById返回的是什么?串讲HTML DOM

    1. getElementById()返回的是什么? 这个函数使用的最普遍,但是你有没有深入探究下,这个函数究竟返回的是什么么?我们来一起看看. var mydivEle = document.get ...

  10. 数学概念——F 概率(经典问题)birthday paradox

    F - 概率(经典问题) Time Limit:2000MS     Memory Limit:32768KB     64bit IO Format:%lld & %llu Submit S ...