UI布局

作者: iOS白水 | 来源:发表于2019-07-27 11:14 被阅读0次

一、基础概念

/*
屏幕布局是基于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

相关文章

  • 仿网易新闻首页UI布局

    title : 仿网易新闻首页UI布局category : UI 仿网易新闻首页UI布局 标签(空格分隔): UI...

  • 最好用的 iOS 快速布局UI库

    最好用的 iOS 快速布局UI库 最好用的 iOS 快速布局UI库

  • android中布局设置位置无效

    问题 Android中的UI布局开发中,多使用xml开发布局样式,对于部分UI布局的重用,我们可以使用includ...

  • iOS页面的布局方式

    iOS有三种基本的界面布局的方法,分别是手写UI,xib和storyboard。手写UI是最早进行UI界面布局的方...

  • 几种常见的css布局方式

    四种方式 element-ui布局容器(el-container) element-ui布局(el-row、el-...

  • iOS的绝对布局(二)

    概括iOS绝对布局也就是我们开发最初使用的UI布局了。优点: 使用方式很简单,可以搭建任何布局,UI控件都是绝对的...

  • SystemUI 下拉框自定义(AN 9.0)

    1 dump 出ui 布局 以sound 为例找出其ui布局节点如下: 2 从代码找出相关布局元素 很明显包名为S...

  • Android学习日记

    Day 11 Title 1:UI布局之帧布局、表格布局 android:layout_gravity=""//当...

  • UI布局

    一、基础概念 1.1 SCALE 缩放设计基于 375 1.2 image 1.3同一层布局要么用masonry...

  • UI布局

    iOS 获取状态栏、导航栏、tabBar高度https://www.jianshu.com/p/507c89d45...

网友评论

      本文标题:UI布局

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