欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

iphoneX布局适配及软件适配iOS 11.0系统的教程

程序员文章站 2023-02-02 10:51:50
一,想必大多开发者将自己的项目跑到iphonex模拟器上后,会出现各种异常,包括界面布局的变化,根据自己遇到的情况主要说下面两点大家肯定需要修改的: (1),启动页不是全屏的,(如图) 解决办法...

一,想必大多开发者将自己的项目跑到iphonex模拟器上后,会出现各种异常,包括界面布局的变化,根据自己遇到的情况主要说下面两点大家肯定需要修改的:

(1),启动页不是全屏的,(如图)

iphoneX布局适配及软件适配iOS 11.0系统的教程

解决办法:

如果使用的是launchimage方式启动图的话,直接在ios8.0 and later 下面portrait打钩,就会出现iphonex的启动图(如图)

iphoneX布局适配及软件适配iOS 11.0系统的教程

将美术做好的图片拖进去就好了,大小是:1125x2436-(375x812)*3

如果使用的是launchscreen.storyboard适配启动图的话,就更简单了,找一张像素合适的图放进去做好适配就可以了(这个地方怎么适配的就不做说明了,如有疑问可以联系我哦)。 经过适配启动图变为:

iphoneX布局适配及软件适配iOS 11.0系统的教程

(2),启动后,软件界面也是不会填充完整的,(如图)

iphoneX布局适配及软件适配iOS 11.0系统的教程

既然启动图的适配已经解决了,那么软件界面自然就会呗填充满了

iphoneX布局适配及软件适配iOS 11.0系统的教程

 

二,我将上图的tabbar和导航条都给隐藏掉,结果就是全屏显示,是不是很爽,然而,这样的做法是不对的,下面就一张图说明所有

iphoneX布局适配及软件适配iOS 11.0系统的教程
只要将标红的地方注意了,并且设计的时候避开这个地方就不会出现什么问题 具体说明:怎么避开上下的危险区域呢,其实苹果官方已经给出了一个新的类,- (void)viewsafeareainsetsdidchange ns_requires_super api_available(ios(11.0), tvos(11.0));

具体代码就是在需要的controller里面写入即可,一般是在基类里面做好处理

 - (void)viewsafeareainsetsdidchange {
    // 补充:顶部的危险区域就是距离刘海10points,(状态栏不隐藏)
    // 也可以不写,系统默认是uiedgeinsetsmake(10, 0, 34, 0);
    [super viewsafeareainsetsdidchange];
    self.additionalsafeareainsets = uiedgeinsetsmake(10, 0, 34, 0);
}

 

三,代码里面到底怎么做呢?

如果将页面滑到最顶部和最底部,会发现上下会留出10和34points的区域,如图:

顶部区域

iphoneX布局适配及软件适配iOS 11.0系统的教程

底部区域

iphoneX布局适配及软件适配iOS 11.0系统的教程

在滑动的过程中满屏的,是不是感觉比较舒服

iphoneX布局适配及软件适配iOS 11.0系统的教程

其实我感觉,官方说的危险区域到底要不要避开呢,这个就比较蛋疼了,如果要避开的话那么在滑动的时候就不应该是满屏跑呀?如果说是不避开,那么在滑到顶部和底部的时候,给我留的空白是干啥的?谁知道可以解释一下,谢谢! 我的做法是上下全留白,不管是在滑动还是在最顶部和最底部,如图底部绿色部分就是危险区域,一直是空白的(我的项目里面是有导航的,所以上面的留白就不展示了在这)。就是这样做会不会有点不美观,大家给给意见,谢谢!

iphoneX布局适配及软件适配iOS 11.0系统的教程

其实,如果在碰到底部有自定义的bar时,就最好按照上面4点的做法,如图实现的三种方式其中的参数具体是:

iphonex下,底部的tabbar高度是83,其中危险区域有34

顶部导航栏的高度还是44,只不过状态栏变为44了

iphoneX布局适配及软件适配iOS 11.0系统的教程
6,我的做法是在基类里面写一个算高度的类:- (cgfloat)calculateheight:(cartonepagesource)source {

    // 针对上图第三张的展示方式,如要改变,就可以在这里变就可以了
    // source : 
    // cartonepagesourcenormal 表示是有底部tabbar的
    // cartonepagesourcedetial 表示没有底部tabbar的
    cgfloat height = 0;
    if (iphonex) {
        height = (source == cartonepagesourcenormal)?(kscreenheight - 88 - 83) : (kscreenheight - 88 - 34);
    }else {
        height = (source == cartonepagesourcenormal)?(kscreenheight - 64 - 49) : (kscreenheight - 64);
    }
    return height;
}

四,ios11适配

具体tableview的contentsize的限制如下,除了self.extendedlayoutincludesopaquebars = no;外其他两个都是系统默认的,其实不写也是不影响布局的,但是,在使用的过程中就会出现问题。
self.edgesforextendedlayout = uirectedgenone;
self.extendedlayoutincludesopaquebars = no;
if (@available(ios 11.0, *)) {                  
    self.tableview.contentinsetadjustmentbehavior = uiscrollviewcontentinsetadjustmentnever;
} else {
    self.automaticallyadjustsscrollviewinsets = no;
}
具体问题:pop会上一页面,界面会从下往上滑动;
利用mjrefresh刷新界面,会出现跳动,
经测试,这两个问题都是因为没写或是将contentinsetadjustmentbehavior设置为了uiscrollviewcontentinsetadjustmentautomatic.

3.在需要的地方设置这三句话,可以在基类里面写好,这样有助复用

self.edgesforextendedlayout = uirectedgenone;
self.extendedlayoutincludesopaquebars = no;
if (@available(ios 11.0, *)) {                  
    self.tableview.contentinsetadjustmentbehavior = uiscrollviewcontentinsetadjustmentnever;
} else {
    self.automaticallyadjustsscrollviewinsets = no;
}