屏幕适配Autoresizing / Autolayout / Mansory / 自定义Frame实现

1. 什么是适配:

     适应、兼容不一样版本不一样尺寸的移动智能设备程序员

     iPhone尺寸:3.五、4.0、4.七、5.5inch布局

     iPad尺寸:7.九、9.7inch,横竖屏适配  spa

 

  2. 点与像素

     非retaina屏:1个点 = 1个像素code

     retain屏:1个点 = 4个像素blog

 

3. 什么是Autolayout

   1>  是一种“自动布局”技术,专门用来布局UI界面的开发

   2> 自iOS 6开始引入,因为Xcode 4的不给力,当时并无获得很大推广微博

   3> 自iOS 7(Xcode 5)开始,Autolayout的开发效率获得很大的提高
   4> 苹果官方也推荐开发者尽可能使用Autolayout来布局UI界面
   5> Autolayout能很轻松地解决屏幕适配的问题

4. Autoresizing

    1> Autoresizing了解效率

         Autoresizing:屏幕适配局限性比较大(如不能布局兄弟控件适配),没Autolayout方便autolayout

         Autoresizing四周的四个线的做用:程序

     

     1.Autoresizing四周的四根线的做用:

        只要勾选上某一根, 那么当前控件距离父控件的距离就是固定的, 当前是多少, 之后永远都是多少

     

     2.Autoresizing中间两条线的做用:

        只要勾选上水平方向的线, 那么当前控件的宽度就会随着父控件的宽度等比拉伸

        只要勾选上垂直方向的线, 那么当前控件的高度就会随着父控件的高度等比拉伸

     

     3.不管是将子控件固定在父控件的某一个位置

        仍是让子控件随着父控件的宽高的变化而变化

     

     都是父子关系, 因此Autoresizing只能约束父子控件之间的关系, 不能约束兄弟控件之间的关系(有局限性相比较Autolayout)

  2> Autoresizing实例一:放四个View到storyboard四个角,适配不一样屏幕尺寸。

           步骤:(1)

   (2)  设置四周View的指定位置便可。

                        

   (3) . 进入preview界面可进行预览视图界面,是否适配成功

                   

5. Autolayout屏幕适配

   1> Autoresizing,在Autolayout以前,有Autoresizing能够做屏幕适配,但局限性较大,有些任务根本没法完成
   2> 相比之下,Autolayout的功能比Autoresizing强大不少
   3> Autolayout的2个核心概念
       3.1 参照
       3.2 约束

    1.约束

        每在Storyboard中添加一个设置(autolayout的设置), 就表明添加一个约束

 

     2.错误(红色箭头)

        若是看到Storyboard中有红色的箭头, 表明约束有错误

        注意: 约束有错误, 不表明运行会错误, 约束有错误一样能够运行

        注意: 红色箭头是程序员必须解决的

 

     3.为何会有约束错误?

        3.1缺乏约束

        3.2约束冲突

     3.1缺乏约束

        >autolayout的本质和frame差很少

        >若是经过frame来设置一个控件, 必须设置这个控件的x/y/w/h, 控件才能按照咱们的需求显示

        >若是是经过autolayout来设置一个控件, 也必须设置这个控件的x/y/w/h, 控件才能按照咱们的需求显示

        >也就是说, 若是说x/y/w/h只要有一个没有设置都会报错, 就是缺乏约束

     3.2约束冲突

        >约束能够重复添加

        >例如先约束宽度等于100, 又添加一个约束, 约束宽度等200, 那么就会报错

     红色:

     距离顶部有20 == 至关于设置了Y

     距离左边有20 == 至关于设置了x

     设置宽度等于100

     设置高度等于100

     

     4.警告

      若是看到Storyboard中有黄色的箭头, 就是警告

     > 表明着当前控件预览的位置或者尺寸和咱们约束的位置尺寸不同

     注意:黄金警告并不会影响咱们运行

     注意:黄色箭头, 程序员能够忽略

 处理屏幕适配:

第一种方式:经过storyboard右下角图案处,点击可进行处理屏幕适配:

1.对齐方法可设置(storyboard右下角可见),

   

二、设置相对位置、宽高等

三、设置控件与全部控件的约束操做(删除与更新等操做于约束)

第二种方式:按住“control”键,能够在控件本身,或者直接拖拽到其余控件上,会弹出对话框,可选择添加约束,来适配

  注意:往左边相对左边,同理向右边相对右边设置约束,向下相对底部,向上相对顶部

将弹出右框:

小案例:以下:

1.实现红色View宽度 = 蓝色宽度一半:

2.微博小案例,正文不等高,父控件随之动态变化

设置约束还有不少方式,非代码方式就处处吧,你们本身摸索就ok了。

下一将,咱们接着讲解Autolayout适配,采用代码方式实现,休息一会再继续,呵呵。

相关文章
相关标签/搜索