有关iOS11和iPhoneX的适配问题

H5页面WebView在iPhoneX的适配 1.  iPhoneX的介绍屏幕尺寸    我们熟知的iPhone系列开发尺寸概要如下:△ iPhone各机型的开发尺寸转化成我们熟知的像素尺寸:△ 每个机型的多维度尺寸倍图其实就是像素尺寸和开发尺寸的倍率关系,但这只是外在的表现。倍图核心的影响因素在于PPI(DPI),了解屏幕密度与各尺寸的关系有助于我们深度理解倍率的概念:《基础知识学起来!为设计师量身打造的DPI指南》iPhone8在本次升级... 阅读详情

http://www.jianshu.com/p/a4e778c2236e


 

一:iOS11 问题

有关iOS11 ,最大的变化就是增加了一个安全区域(safeArea)的概念,iOS11 适配的大部分问题都是由于它引起的。 如果还不太了解概念,推荐阅读 iOS 11 安全区域适配总结这篇文章。

1. tableView 头部视图和尾部视图出现一块留白问题
  • iOS11下tableview默认开启了self-Sizing,也就是自动估高机制。 有两种办法去掉留白:

  • tableView的style:UITableViewStyleGrouped类型,默认tableView开头和结尾是有间距的,不需要这个间距的话,可以通过实现heightForHeaderInSection方法(返回一个较小值:0.1)和viewForHeaderInSection(返回一个view)来去除头部的留白,底部同理。

  • iOS 11上发生tableView顶部有留白,原因是代码中只实现了heightForHeaderInSection方法,而没有实现viewForHeaderInSection方法。iOS 11之后应该是由于开启了估算行高机制引起了bug。添加上viewForHeaderInSection方法后,问题就解决了。或者添加以下代码关闭估算行高,问题也得到解决。

  self.tableView.estimatedRowHeight = 0;
  self.tableView.estimatedSectionHeaderHeight = 0;
  self.tableView.estimatedSectionFooterHeight = 0;
2. NavigationBar 的变化
  • 新增了一种lagreTitle的样式,默认是关闭的,暂时不用管他

  • 集成了 UISearchController,很方便

  • 图层发生了变化:
    如果设置了titleView,titleView原来是直接添加到UINavigationBar上,iOS11后,titleView会加在
    UITAMICAdaptorView上,UITAMICAdaptorView这个图层是添加在UINavigationBarContentView上的,
    UINavigationBarContentView之上才是UINavigationBar。

  • titleView支持autolayout,你可能会发现你的titleView变窄了,你可以通过重写 intrinsicContentSize方法来解决这个问题

  - (CGSize)intrinsicContentSize {
      return UILayoutFittingExpandedSize;
  }
3 .iOS 11 权限问题

iOS11对相册的权限key做了调整,将原来的 NSPhotoLibraryUsageDescription改成了NSPhotoLibraryAddUsageDescription。详见:Cocoa Keys

4. iOS11系统下SVProgessHUD默认的loading文字变灰问题
屏幕快照 2017-10-11 上午11.43.46.png
屏幕快照 2017-10-11 上午11.43.46.png

具体原因还未找到,坐等更新,暂时使用了SVP的自定义样式解决,望有遇到过的大佬不吝指教

  [SVProgressHUD setDefaultStyle:SVProgressHUDStyleCustom];//设置loading样式,默认白底黑字
  [SVProgressHUD setBackgroundColor:HEXCOLOR(0xf9f9f9ff)]; //设置loading底部背景颜色

二: iPhoneX问题

1. 适配iPhoneX的时候上面流海的屏幕仍是黑色,内容没有充满屏幕
  • 这是因为你没有设置对应大小的启动图,iPhone X对应像素 1125 * 2436,将启动图添加到LaunchImage中后,还要在Contents.json文件中增加下面的内容
{
    "extent" : "full-screen",
    "idiom" : "iphone",
    "subtype" : "2436h",
    "filename" : "你的启动图名字.png",
    "minimum-system-version" : "11.0",
    "orientation" : "portrait",
    "scale" : "3x"
}
2.webView,tableView页面无导航栏时,顶部出现44高度的空白
image.png
image.png

*iOS11中废弃了automaticallyAdjustsScrollViewInsets,取而代之的是contentInsetAdjustmentBehavior属性,adjustedContentInset属性决定了tableView与边缘的距离。iPhone X竖屏时控制器视图的safeAreaInsets是(44,0,34,0)

#pragma mark -- 废弃了的automaticallyAdjustsScrollViewInsets
@property(nonatomic,assign) BOOL automaticallyAdjustsScrollViewInsets API_DEPRECATED_WITH_REPLACEMENT
("Use UIScrollView's contentInsetAdjustmentBehavior instead", ios(7.0,11.0),tvos(7.0,11.0)); // Defaults to YES

#pragma mark -- UIScrollView新属性
/* When contentInsetAdjustmentBehavior allows, UIScrollView may incorporate
 its safeAreaInsets into the adjustedContentInset.
 */
@property(nonatomic, readonly) UIEdgeInsets adjustedContentInset API_AVAILABLE(ios(11.0),tvos(11.0));

contentInsetAdjustmentBehavior属性有以下几个枚举值:

/*
1. automatic 和scrollableAxes一样,scrollView会自动计算和适应顶部和底部的内边距并且在scrollView 不可滚动时,也会设置内边距.
2. scrollableAxes 自动计算内边距.
3. never 不计算内边距
4. always 根据safeAreaInsets 计算内边距
*/
typedef NS_ENUM(NSInteger, UIScrollViewContentInsetAdjustmentBehavior) {  
    UIScrollViewContentInsetAdjustmentAutomatic, 
    UIScrollViewContentInsetAdjustmentScrollableAxes,
    UIScrollViewContentInsetAdjustmentNever,
    UIScrollViewContentInsetAdjustmentAlways,
}

@property(nonatomic) UIScrollViewContentInsetAdjustmentBehavior contentInsetAdjustmentBehavior;
@property(nonatomic, readonly) UIEdgeInsets adjustedContentInset;

//adjustedContentInset值被改变的delegate
- (void)adjustedContentInsetDidChange; 
- (void)scrollViewDidChangeAdjustedContentInset:(UIScrollView *)scrollView;

添加如下代码解决问题

if (@available(iOS 11.0, *)) {
    tableView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever;
}
3.iPhoneX 在push进入 webView页面时,底部会有黑边一闪而过
  • 这也是由iOS11的safeArea引起的问题。
  • 发生这种情况, 你可能设置了webview 的高度为 SCREEN_HEIGHT-NAVBAR_HEIGHT(屏幕高度-(导航栏高度+状态栏高度)),你有两种选择:
    1)设置webview高度为 SCREEN_HEIGHT-NAVBAR_HEIGHT-34, 34为底部的安全区域间距。
    2)添加如下代码
if (@available(iOS 11.0, *)) {
    webView.scrollView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever;
}

第一种方法会让webview的视图和底部有34的距离,第二种会使webview保持全屏,但一部分区域会被iPhoneX底下的黑条遮住,美丑自评

4.页面底部有固定的footerView被遮挡,以及一些自定义输入框弹起键盘被遮盖问题

iPhoneX需要将底部一些控件的位置往上移34,弹出的键盘隐藏时也可能会出现问题,根据实际情况修改。

5.视图高度问题

以前编写代码的时候,定义tableView高度可能只是用了SCREEN_HEIGHT-64-49(有tabbar的时候),也可能是SCREEN_HEIGHT-64(tabbar隐藏的时候),在iphoneX上面这样的写法会出现问题,特别是一些死页面,tableView会拉不到最底部。

参考
以上内容参考了以下文章,阅读原文请点击以下链接
iOS11 & iPhone X 适配指南 http://url.cn/5wjMhix
App界面适配iOS11 http://www.jianshu.com/p/352f101d6df1
iOS 11 安全区域适配总结 http://www.jianshu.com/p/efbc8619d56b



作者:VIVILIA
链接:http://www.jianshu.com/p/a4e778c2236e
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

小程序以及H5页面上IphoneX底部安全区域小黑条适配问题 背景 公司项目开发中,发现iPhoneX上吸底元素存在被小黑条遮挡的问题 原因 在苹果 iPhoneX 、iPhone XR等机型上,物理Home键被取消,改为底部小黑条替代home键功能,从而导致吸底元素会被小黑条遮挡覆盖的问题 解决方案 使用已知底部小黑条高度为34px/68rpx机型适配(不建议) 使用微信官方API,getSystemInfo()中的safeArea对象进行适配(建议) 使用苹果官方推出的css函数env()、constant()来适配 (建议) 安全区域 看看图就明白了,中间绿色区域即为安全区域。也就是说,适配安全区域也就是让小程序或者H5的内容显示在绿色区域部分。 立即下载

相关推荐

windows10下 iperf3测试带宽

客户端输入:"iperf3.exe -u -c 服务器IP地址 -b 5g" //客户端给服务器发送udp数据包,最大带宽为5g。客户端输入:“iperf3.exe -c 服务器IP地址 -P 10“//表示客户端10路并行给服务器发送TCP包;上图可知:带宽是15Gbps(这里不知道为什么下面测试的UDP会比这里TCP慢 按道理UDP不可能比TCP慢的5.)3. 验证是否下载成功,在打开的窗口中输入“iperf3.exe -v”,会出现安装的版本,表示安装成功了。5. iperf3参数。

xiaoqixiaoguai的博客 5890

iOS 11 安全区域适配总结

导语:本文主要是对iOS 11下APP中tableView内容下移20pt或下移64pt的问题适配的一个总结。内容包括五个部分:问题的原因分析、adjustContentInset属性的计算方式、什么情况下的tableView会发生内容下移、有哪些解决方法、解决这个问题时遇到的另外一个小问题。 一、iOS 11下APP中tableView内容下移20pt或下移64pt的原因分析

码农天后的博客 2万+

从理论到实践:利用FilterSolutions高效设计7阶椭圆低通滤波器

本文详细介绍了如何利用FilterSolutions软件高效设计7阶椭圆低通滤波器。文章从理论入手,对比了巴特沃斯、切比雪夫等经典滤波器特性,阐述了在要求高衰减陡度(如62dB抑制)和严格通带波纹(0.2dB)时,椭圆滤波器是最优选择。通过分步实战教程,指导读者完成从软件参数设置、性能验证到实际电路布局与调试的全过程,助力射频与高速数字信号处理工程师将理论转化为可靠设计。

jupi8的博客 559

小程序webview嵌入h5兼容iphone安全区域

在苹果 iPhoneX及以上设备上,可以看到物理Home键被取消,改为底部小黑条替代home键功能。微信小程序和 h5 网页需要针对这种情况进行适配,否则可能会遇到底部按钮或选项卡栏与底部黑线重叠的情况,原生APP和小程序和H5都可以使用苹果官方推出适配方案css函数env()、constant()来适配。但是嵌入微信小程序webview中的h5网页使用env()、constant()是不生效的,需要在顶层的h5应用做兼容处理。 1.在webview加入padding-bottom,或者调整webview高

weixin_48226213的博客 2711

告别版本过低提示!微信3.9登录修复与聊天记录无缝迁移全攻略

本文详细解析了微信3.9版本过低提示的根源,并提供了完整的修复方案和聊天记录迁移指南。通过专用修复工具绕过版本检测,以及新旧版本聊天记录目录对比,帮助用户实现无缝迁移。特别提醒备份重要数据,确保操作安全。

weixin_42535461的博客 3141

1688店铺所有商品API接口(整店商品查询API接口)

1688店铺所有商品API接口、1688店铺列表API接口,1688店铺API接口,1688店铺查询商品API接口,1688店铺商品API接口,1688店铺详情接口,1688商品API接口

tbprice的博客 1568

前端开发进阶之H5移动端刘海屏适配

body { padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top); padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom);...

大道至简 7341

【Altium designer】BOM导出 Bill of Materials 如何自定义格式

【Altium designer】如何自定义BOM导出格式 我们用Excel做一个xx.xlt的2003的模版文件,取文件名为:AltiumDesiger PCB BOM Template.xlt 将AltiumDesiger PCB BOM Template.xlt文件存放在:AltiumDesiger 安装目录的Template文件夹内

夜半少年的博客 2717

iOS 采用@available(iOS 11.0, *)适配 iOS11,会引起调用系统相册时,系统界面上移问题

我们在使用以下方法适配 iOS11,避免滚动视图顶部出现20的空白以及push或者pop的时候页面有一个上移或者下移的异常动画的问题时,会导致一个问题,就是当我们的应用调用系统相册时,引起系统相册界面整体上移。原因是因为:全局设置了如下的方法。if (@available(iOS 11.0, *)) { [[UIScrollView appearance] setContentInse

blog_t的博客 3万+

30分钟上手YOLO26 nano:INT8量化部署到智能相机,推理速度提升43%

微调代码(仅需5行,数据集遵循COCO格式)data="custom_data.yaml", # 数据集配置文件epochs=20, # 少量轮数即可收敛batch=8,imgsz=640model.save("yolov26n_custom.pt") # 保存微调后的模型本文在30分钟内完成了YOLO26 nano的INT8量化与智能相机部署,核心步骤为环境准备→模型获取→ONNX导出→INT8量化→部署推理。

专注于Python爬虫开发,分享爬虫技巧、项目实战与反爬经验,使用Scrapy、BeautifulSoup等工具,解决数据抓取难题。 987

(七)独立按键

(七)独立按键

m0_52555663的博客 1717

iOS 有关iOS11和iPhoneX的适配问题

一:iOS11 问题 有关iOS11 ,最大的变化就是增加了一个安全区域(safeArea)的概念,iOS11 适配的大部分问题都是由于它引起的。 如果还不太了解概念,推荐阅读 iOS 11 安全区域适配总结这篇文章。 1. tableView 头部视图和尾部视图出现一块留白问题 iOS11下tableview默认开启了self-Sizing,也就是自动估高机制。 有两种办法去掉留白:...

XLaws的博客 528

【原理图与PCB专题】使用Cadence如何在Layout时直接互换相同功能的PIN

Cadence允许我们在PCB中互换管脚,最后再反标给原理图。集成TVS管、排阻、DDR、FPGA有一些PIN是完全相同功能,可进行管脚互换的,建议使用这个功能。可降低硬件工程师与Layout工程师之间沟通成本,加快设计进度。

一点硬件 801

iOS调试——适配iOS11,iPhoneX问题及解决办法

iPhoneX: 问题 1.app上下各有空间,未全屏 解决办法:UI给新图后,新增 launchimg启动图 。图片尺寸:1125 * 2436 2.问题:使用MJRefresh,下拉刷新UI错误 解决办法: 方法一:如果多个页面用tableview,建议使用 baseTableView,继承。baseTableView实现下列方法 OC: if (@

吹泡泡的星星 2874

迈瑞BS系列全自动生化分析仪LIS协议接口手册(内含HL7和ASTM)

迈瑞BS系列全自动生化分析仪LIS协议接口手册,内含HL7和ASTM)

大中型超市收银系统(可直接运行)

光步前台收银系统系统功能:商品销售、商品退货、挂单、收银员权限、会员销售、单品取消、整单取消、商品查询、脱机销售、脱机数据上传,基本资料下载,开钱箱、小票打印、收款结算,支持多币种付款方式(现金、储值卡、礼券、微信等),支持多种促销。运行环境:.net 4.0登陆信息用户名:1001 密码:123456内置商品信息,商品编码可输入00001000 - 00010000,测试效果相关功能键F5 结算 F9挂单 F11商品查询 F8退货 Insert单品取消 Del整单取消 F12开钱箱F2 会员 Ctrl+Z退出系统 Home 锁屏 相关源码待公开

iOS11/iPhoneX相关适配问题

相信大家已经被iPhoneX的刘海洗脑了,除了吐槽,留给我们的还有比较麻烦的适配工作。下面针对在整理过程中发现的适配注意点进行简单分享下。 适配: 1.iPhone X 尺寸 2.iPhone X 上下显示黑条问题 3.导航栏的适配 4.iOS11新增版本判断API 5.UITableView相关适配 6.安全区域的问题 7.上传...

守候可爱多的博客 5170

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

iphone x php兼容吗,有关iOS11和iPhoneX的适配问题

一:iOS11 问题有关iOS11 ,最大的变化就是增加了一个安全区域(safeArea)的概念,iOS11 适配的大部分问题都是由于它引起的。如果还不太了解概念,推荐阅读 iOS 11 安全区域适配总结这篇文章。1. tableView 头部视图和尾部视图出现一块留白问题iOS11下tableview默认开启了self-Sizing,也就是自动估高机制。有两种办法去掉留白:tableView的s...

weixin_32571169的博客 210

怀旧版电脑GBC模拟器

再现原版GBC掌机的界面,电脑运行连游戏界面都一样大小,很怀旧,很真实,(英文版)强烈推荐,很小的文件,很难才找到的。

适配iphonex和ios11的相关问题总结

还没有开始适配之前,就已经听身边的程序猿伙伴在为iPhone X的刘海和HomeBar的存在而纷纷吐槽了。说的我都有些怕怕,胆子小,哈哈哈。下面针对在整理过程中发现的适配注意点进行简单总结。 一、iOS11 1、iOS11新增版本判断API 2、MJRefresh上拉刷新死循环 3、访问相册权限变更 4、UI

兵仔贾---的专栏 963

iOS11/ iPhoneX相关适配问题

相信大家已经被iPhoneX的刘海洗脑了,除了吐槽,留给我们的还有比较麻烦的适配工作。下面针对在整理过程中发现的适配注意点进行简单分享下。 适配: iPhone X 尺寸 iPhone X 上下显示黑条问题 导航栏的适配 iOS11新增版本判断API UITableView相关适配 安全区域的问题 上传版本提示警告的问题 iOS 11 的相关隐私设置 一. iPhone X 尺寸 开发尺...

weixin_34404393的博客 200

适配iOS 11及iPhoneX iOS 11下tableView内容下移的问题

一.为什么会发生内容下移 1.原因分析 在iOS 11中Apple干掉了ViewController中的automaticallyAdjustsScrollViewInsets这个属性,当tableview的frame超出了安全区域后系统会自动的调整SafeAreaInsets的值,而iOS 11中真正影响tableview内容与边缘的变成了adjustedContentInset而不

weixin_39180334的博客 4506

ios11+html5偏移20pt,10分钟适配 iOS 11 & iPhone X

适配中的问题及解决办法1. 滚动条高度跳动、上下拉刷新问题:self.tableView.estimatedRowHeight = 0;self.tableView.estimatedSectionHeaderHeight = 0;self.tableView.estimatedSectionFooterHeight = 0;2. 列表/页面偏移设置工程中的UITableView、UICollec...

weixin_33974017的博客 304

Unity适配iPhoneX iOS 11+ Home键易误操作的问题

2018年06月02日 14:30:51阅读数:340问题描述iPhone设备首次去掉的传统的Home键,以极大的扩展了屏幕尺寸,取代Home键的是屏幕底部中间的虚拟home条,响应上滑手势回到主页面。但如此造成的问题是游戏中尤其是像王者荣耀等操作比较频繁的游戏很容易误操作home键,导致游戏偶然退出影响游戏体验。适配目标现在适配iPhoneX的目标是两次上滑操作才最终出发home键,默认状态让h...

勇往无前,不知所措 979

适配iOS 11及iPhoneX iOS 11下tableView内容下移的问题

https://blog.youkuaiyun.com/weixin_39180334/article/details/78284210 https://www.jianshu.com/p/a75632bab095

georgehenrywilliam的博客 706

我的iOS11及iPhoneX适配(一)

我做的项目,在更新xcode到9.0,sdk版本是iOS11,如果不适配,暂时发现以下问题: 1. 2 3 4 5

md16888的博客 1304

Xcode9 iOS11适配 iPhoneX适配 heightForHeaderInSection、contentInset失效解决 contentInsetAdjustmentBehavior详解

1.iPhoneX基本属性 启动图尺寸:1125px × 2436px(即 375pt × 812pt @3x)) iphoneX 屏幕高:812.0个点 导航栏高度+状态栏高度:88.0个点(导航栏高度仍是44个点,状态栏高度增高为44个点,所以刘海的高度并不是状态栏的高度。状态栏和导航栏平分了头部总的高度) tabbar高度:83.0个点(原是固定49个点,增高

SuYuMingXiangGuan的博客 2306
上一篇: IOS获取相册照片的大小
下一篇: IOS项目新手引导页图片适配方案
普通网友
博客等级 码龄16年 90粉丝 1232原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值