UI布局

一、基础概念

/*
屏幕布局是基于pt ,不是基于像素 ：  320 (4s 、5s)、375（6s)、414(8p)、
各机型pt 大小备注
 4s:320x480
 5s:320x568
 6:375x667
 6p:414x736
 x :375x812
 xs:375x812
 xs max :414x896
 xr     :414x896

*/

E90C78F8-5D93-4AD2-8F13-C33D66A721B8.png

image.png

1.1 SCALE 缩放设计基于 375

#define SCALE                      (SCREEN_WIDTH/375)
#define RELATIVEVALUE(value)       (value * SCALE)

    NSLog(@"5s :%lf",RELATIVEVALUE(20) + RELATIVEVALUE(80));   //85.333333
    NSLog(@"5s :%lf",RELATIVEVALUE(20+80));                    //88.266667
    NSLog(@"6 :%lf",RELATIVEVALUE(20) + RELATIVEVALUE(80));     //100
    NSLog(@"6 :%lf",RELATIVEVALUE(20+80));                      //100
    NSLog(@"6p :%lf",RELATIVEVALUE(20) + RELATIVEVALUE(80));   //110.400000
    NSLog(@"6p :%lf",RELATIVEVALUE(20+80));                    //108.320000

1.2 image

图片放置的大小 是要通过像素来存放，而不是通过pt。 5s时代 @.png    6s @2x   6p  @3x.

图片local_me : @1x=33*33  @2x = 66*66  @3x = 99*99  

NSLog(@"5 imageSize:%@",NSStringFromCGSize(image.size));//5、6、6p  imageSize:{33, 33}

1.3同一层布局
要么用masonry 要么 用frame。只能二选一。
一外层用frame设置主view大小，里层用masonry布局是可以的。

1.4