iOS屏幕适配

作者: Ljson | 来源:发表于2015-06-11 11:48 被阅读18287次

    一、iOS屏幕适配发展历程

    设备 适配技术
    4及以前(iPad未出 直接用代码计算
    有了iPad autoResizing
    有不同屏幕的iPhone后 autoLayout
    有更多不同屏幕的iPhone后 sizeClass

    二、各个技术的特性

    1、 直接用代码计算

    由于屏幕的大小都一样,只有横竖屏的情况,可以直接计算

    2、 autoResizing

    适合于控件与其父控件的关系

    各属性的解释

    属性 解释
    UIViewAutoresizingNone 不会随父视图的改变而改变
    UIViewAutoresizingFlexibleLeftMargin 自动调整view与父视图左边距,以保证右边距不变
    UIViewAutoresizingFlexibleWidth 自动调整view的宽度,保证左边距和右边距不变
    UIViewAutoresizingFlexibleRightMargin 自动调整view与父视图右边距,以保证左边距不变
    UIViewAutoresizingFlexibleTopMargin 自动调整view与父视图上边距,以保证下边距不变
    UIViewAutoresizingFlexibleHeight 自动调整view的高度,以保证上边距和下边距不变
    UIViewAutoresizingFlexibleBottomMargin 自动调整view与父视图的下边距,以保证上边距不变
    • view的autoresizesSubviews属性为yes时(默认为yes),autoresizing才会生效。
    • 从XCODE6开始,Storyboard&Xib默认是自动布局,因此我们需要手动调整,才能使用autoresizing。
    • autoresizing可以组合使用,如:
      UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleBottomMargin
    3、autoLayout

    帮我们确定在不同设备、不同(父view)环境下,同一个可视单元所应具有合适的位置和尺寸(任何两个视图的关系都可以确定)

    1. autoLayout的用法:

    • 直接建立约束条件
      [self.view addConstraint: [NSLayoutConstraint
      constraintWithItem:blueView
      attribute:NSLayoutAttributeLeft
      relatedBy:NSLayoutRelationEqual
      toItem:redView
      attribute:NSLayoutAttributeLeft
      multiplier:1
      constant:0]];
      这样虽然代码量比较大,但是是绝对可行的办法,也是使用autoLayout最根本的办法之一。
    • 使用VFL语言
      - (void)viewDidLoad {
      [super viewDidLoad];
      UIButton *button=[[UIButton alloc]init];
      [button setTitle:@"点击一下" forState:UIControlStateNormal];
      button.translatesAutoresizingMaskIntoConstraints=NO;
      [button setBackgroundColor:[UIColor blackColor]];
      [self.view addSubview:button];
      NSArray *constraints1=[NSLayoutConstraint
      constraintsWithVisualFormat:@"H:|-[button]-|"
      options:0
      metrics:nil
      views:NSDictionaryOfVariableBindings(button)];
      NSArray *constraints2=[NSLayoutConstraint
      constraintsWithVisualFormat:@"V:|-20-[button(==30)]"
      options:0
      metrics:nil
      views:NSDictionaryOfVariableBindings(button)];
      [self.view addConstraints:constraints1];
      [self.view addConstraints:constraints2];
      }
    • 使用使用第三方库,如:MasonryUIView+AutoLayout……
    2. autoLayout的好处:
    • 你基本上可以不用考虑3.5寸和4寸以及即将上市的x.x寸屏幕不同分辨率的问题,你终于可以不用在viewDidLoad方法里判断不同分辨率下,不同控件应该放在哪里,或者针对不同分辨率写不同的storyboard和xib;
    • 你可以抛弃那些根据不同文字来计算tableViewCell、UILabel高度的代码了,因为autolayout会帮你自动计算好;
    • 如果你的布局在横屏竖屏下变化不是特别大,你不用再为横着竖着写两套代码或者写两个storyboard/xib了;
    4、sizeClass

    在iOS8中,新增了Size Classes特性,它是对当前所有iOS设备尺寸的一个抽象。那我们就只把屏幕的宽和高分别分成三种情况:Compact:紧凑、Regular:宽松、Any:任意。

    这样宽和高三三一整合,一共9中情况。如下图所示,针对每一种情况。我们可以在每种情况下设置不同的布局(包括控件的约束,甚至是控件是否显示)

    sizeClass.png
    ** 对sizeClass的理解:**
    sizeClass的实质是将iOS屏幕分成了不同的抽象概念,这些不同的抽象组合,对应着不同的设备屏幕。所以,利用sizeClass可以针对同一套UI,来适配所有的屏幕。注意:这些所有的适配,都是利用autoLayout来实现的,sizeClass只是负责提供不同的屏幕尺寸。

    相关文章

      网友评论

      • hhgvg:请问下 一个控件的位置和大小在不同设备上显示 是按照什么办法显示呢
      • 7ca187f13ad1:简单明了
      • 91阿生: @纯属玩笑 这玩意很有意思
      • Ljson: @ @ruikye 你可以在给一个cell设置内容之后,调用layoutsubviews,他会根据你添加的约束,布局子控件,这个时候,cell就有了一个高度。
        leftwater:@Ljson layoutsubviews中刷新数据?
      • 07a2c6c7f194:uicollectionview中的cell高度可以用autolayout自动计算高度么?
        Erbash:@leftwater 可能是瀑布流
        leftwater:@ruikye collection cell高度都是写死的吧 不然多列展示多影响美观了?
      • 奔奔奔跑:sizeclass不太会,现在在维护项目,新功能可能会需要吧

      本文标题:iOS屏幕适配

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