美文网首页
iPhone X,iPhone XS,iPhone XR,iPH

iPhone X,iPhone XS,iPhone XR,iPH

作者: 那一处风景ljz | 来源:发表于2018-12-28 18:23 被阅读33次
    尺寸对照

    具体原理性的东西就多说了,因为iPhoneX系列都一样,本文只说明一下具体怎么做,要适配屏幕,首先得让他以正确的姿势启动,如果你使用的是LaunchScreen.storyboard,就不需要考虑这个了,但如果你使用的是LaunchImag,就需要提供正确的启动图。需要注意的是XR使用的@2x的图。


    启动图尺寸 机型 命名

    640 × 960 iPhone4s Default@2x

    640 × 1136 iPhone5s Default-568h@2x

    750 × 1334 iPhone Default-667h@2x

    1242 × 2208 iPhonePlus Default-736h@3x

    1125 × 2436 iPhoneX, XS Default-812h@3x

    828 x 1792 iPhoneXR Default-896h@2x
    1242 x 2688 iPhoneXS Max Default-896h@3x


    本文提到的这四款手机都有一个共同的特点,就是“齐刘海”+底部触摸条

    针对这种样式的屏幕,我们处理方法是一样,几个宏直接搞定(至于怎么判断是不是iPhone X系列,这里也不多说了)

    #define kNavBarHeight              (iphoneX ? 88.0 : 64.0)
    #define kBottomBarHeight        (iphoneX ? 34.0 : 0)
    #define kContentHeight             (kScreenHeight - kNavBarHeight-kBottomBarHeight)
    

    针对继承自UIScrollView的,需要处理一下内边距

    第一步:关闭自动调整内边距

    if (@available(iOS 11.0, *)) {
            [UIScrollView appearance].contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever;
    }
    

    第二步:在使用的地方手动设置内边距(千万别全局设置,容易出事)

    self.scrollView.contentInset = UIEdgeInsetsMake(0, 0, kBottomBarHeight, 0);
    

    这样设置以后,底下的触摸区域就能正常显示内容了,而且当UIScrollView滑到最底部的时候,不会被遮住。

    除此之外,有些比较大的控件,产品会要求按照屏幕比例进行调整,小屏幕的显示的小一点,大屏幕的显示大一点,这个也是两个宏搞定

    #define kScaleH                   (kScreenHeight/667.0)
    #define kScaleW                  (kScreenWidth/375.0)
    

    解释一下为什么除的667和375,因为UI给的设计图示按照667 * 375的屏幕给的,如果你们的UI小姐姐给的设计图是按照iPhone5s的尺寸设计的,分母就要换成568和320。

    一些常用的常亮进行通用宏定义

    #define N_StatusBarHeight [[UIApplication sharedApplication]statusBarFrame].size.height//20.0
    #define N_NavBarHeight 44.0
    #define N_TopBarHeight (N_StatusBarHeight + N_NavBarHeight)
    #define N_TabBarHeight 56.0
    #define N_ContenHeight (DeviceHeight - N_StatusBarHeight - N_NavBarHeight - N_TabBarHeight)
    #define N_ContenHeight_Tab (DeviceHeight - N_StatusBarHeight - N_NavBarHeight)
    #define BottomPlayViewHeight 51
    

    写分类,或者直接使用集成实现导航栏和tabbar存在时候的布局

    - (UIView *)fullScreenView{
        UIView *view = [[UIView alloc]initWithFrame:CGRectMake(0, 0, MainScreenWidth, MainScreenHeight)];
        [self.view addSubview:view];
        return view;
    }
    - (UIView *)safetyAreaView{
        UIView *view = [[UIView alloc]initWithFrame:CGRectMake(0, StatusBarHeight+self.navHeight,MainScreenWidth, MainScreenHeight-StatusBarHeight-self.navHeight-TabBarHeight)];
        [self.view addSubview:view];
        return view;
    }
    - (UIView *)commonBachgroundView{
        UIView *view = [[UIView alloc]initWithFrame:CGRectMake(0, StatusBarHeight+self.navHeight,MainScreenWidth, MainScreenHeight-StatusBarHeight-self.navHeight)];
        [self.view addSubview:view];
        return view;
    }
    - (UIView *)hasTabBarView{
        UIView *view = [[UIView alloc]initWithFrame:CGRectMake(0, 0, MainScreenWidth, MainScreenHeight-StatusBarHeight-TabBarHeight)];
        [self.view addSubview:view];
        return view;
    }
    

    附:历代iPhone的分辨率和逻辑尺寸图解(点击查看原图可放大)


    历代iPhone的分辨率和逻辑尺寸.png

    参考来源:https://blog.csdn.net/lg767201403/article/details/82683445

    相关文章

      网友评论

          本文标题:iPhone X,iPhone XS,iPhone XR,iPH

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