浅谈iphone X的简单适配问题(推荐)

上周Apple大大发布了新的设备，其中最引人注目的莫过于iphone X，对于这款设备官方有详尽的解说官方文档,除了最新的若干AR、人工智能等功能外，我们发现这也是一款全新尺寸的设备。

官方文档指出这款设备的没有home键，当然有若干手势操作代替了home键的功能，同时该设备也是基本的全面屏设备。当然听到了不少吐槽该设备的“前刘海”，但是我认为相对于刘海上添加的功能，这个刘海也无伤大雅，毕竟相比美观，对于我这种务实者来说更看重功能，闲话不多说，我们在苹果发布设备的第一时间对我们的工程做了简单的适配，今天有时间，在这里说一下适配过程和小问题。

我们看一下官方的尺寸说明，发现该设备可支持@3x的分辨率，再看官方的对于适配的说明：

Most apps that use standard, system-provided UI elements like navigation bars, tables, and collections automatically adapt to the device's new form factor. Background materials extend to the edges of the display and UI elements are appropriately inset and positioned.

大概意思是说一般的原有的UI、导航等视图都可以自行适配，但是我们在第一时间用Xcode9测试了我们的项目，如图：

并没有充满整个屏幕，简单快速适配需要添加相应的启动图

启动图的大小为375x812 @3x

添加之后

此时可以完美的充满整个屏幕了但是还是有一些小问题，特别是在用纯代码的工程中特别爱用

#define SCREENWIDTH [UIScreen mainScreen].bounds.size.width
#define SCREENHIGHT [UIScreen mainScreen].bounds.size.height

这两个宏定义，来获取屏幕的宽高，容易出问题的地方在底部视图的情况，原来的所有机型状态+导航都是64，这里突然变的更大了，原来计算位置的frame现在可能会不在原来的位置上了

由于状态+导航我们有了两个不同的尺寸，方便起见可以使用下边的代码动态获取

CGRect rectStatus = [[UIApplication sharedApplication] statusBarFrame];
NSLog(@"status width - %f", rectStatus.size.width); // 宽度
NSLog(@"status height - %f", rectStatus.size.height); // 高度

// 导航栏（navigationbar）
CGRect rectNav = self.navigationController.navigationBar.frame;
NSLog(@"nav width - %f", rectNav.size.width); // 宽度
NSLog(@"nav height - %f", rectNav.size.height); // 高

这样就可以精确地获得frame，特别是以保证视图在底部，再来一张适配好的带导航的图片

至此简单适配完成！

适配iOS11与iPhoneX过程中遇到的问题

问题 1 app上下为黑色区域，不是全屏（iPhoneX）

你可能需要添加新的LaunchImage

编辑LaunchImage的Contents.json文件，在前面添加如下代码

注意替换文件名

{
    "extent" : "full-screen",
    "idiom" : "iphone",
    "subtype" : "2436h",
    "filename" : "iPhoneX.png",
    "minimum-system-version" : "11.0",
    "orientation" : "portrait",
    "scale" : "3x"
   },
   {
    "extent" : "full-screen",
    "idiom" : "iphone",
    "subtype" : "2436h",
    "filename" : "iPhoneX.png",
    "minimum-system-version" : "11.0",
    "orientation" : "landscape",
    "scale" : "3x"
   },

问题2 tabbar或navigation Bar异常 （iPhoneX）

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • iPhone X官方文档的适配学习详解

    iPhone X官方文档的适配学习详解

    前言 官方文档原文地址:链接,iPhone X在文中均用iPX来表示,iPhone 7在文中均用iP7来表示 屏幕尺寸 iPX的屏幕尺寸是2436px×1125px(812pt×375pt @ 3x),也就是说我们依然使用的是3x的素材应该影响不大,他和iP7在宽度上是一致的,但是高度上多了145个点. 布局 最好在真机上预览一下布局. 布局需要延伸到边缘,另外在纵向高度上最好可以根据不同情境滚动. 状态栏的高度已经改变了,如果布局没有使用系统的导航栏,或者布局是依照导航栏来的,那么需要重新适配

  • iOS11&iPhoneX适配&Xcode9打包注意事项

    1,适配UITableView if#available(iOS11.0, *) { self.contentInsetAdjustmentBehavior= .never self.estimatedRowHeight=0 self.estimatedSectionHeaderHeight=0 self.estimatedSectionFooterHeight=0 }else{ } 2,适配UIScrollView if#available(iOS11.0, *) { scrollView?.

  • 详解iOS11、iPhone X、Xcode9 适配指南

    详解iOS11、iPhone X、Xcode9 适配指南

    更新iOS11后,发现有些地方需要做适配,整理后按照优先级分为以下三类: 单纯升级iOS11后造成的变化: Xcode9 打包后造成的变化: iPhoneX的适配 一.单纯升级iOS11后造成的变化 升级后,发现某个拥有tableView的界面错乱,组间距和contentInset错乱,因为iOS11中 UIViewController 的 automaticallyAdjustsScrollViewInsets 属性被废弃了,因此当tableView超出安全区域时,系统自动会调整SafeAre

  • 关于适配iOS11和iPhoneX的一些事

    前言 众所周知iOS11正式版终于来了,最近也把app适配了一下,其实也不是很麻烦,来看看我做的一些操作,话不多说了,来一起看看吧. 1.UITableView.UICollectionView的变化 tableView在iOS11默认使用Self-Sizing,tableView的estimatedRowHeight.estimatedSectionHeaderHeight. estimatedSectionFooterHeight三个高度估算属性由默认的0变成了UITableViewAuto

  • iOS11和iPhoneX适配的一些坑

    iOS11和iPhoneX适配的一些坑

    本文转载于:http://www.cocoachina.com/ios/20170921/20623.html 导航栏 导航栏高度的变化 iOS11之前导航栏默认高度为64pt(这里高度指statusBar + NavigationBar),iOS11之后如果设置了prefersLargeTitles = YES则为96pt,默认情况下还是64pt,但在iPhoneX上由于刘海的出现statusBar由以前的20pt变成了44pt,所以iPhoneX上高度变为88pt,如果项目里隐藏了导航栏加了

  • iOS 11更新后及iPhone X推出后工程中遇到的问题及适配方法

    1.UITableView滑动时右侧的滑动条忽长忽短的乱跳以及MJRefresh上拉刷新死循环 这是因为tableView在iOS11默认使用Self-Sizing,tableView的estimatedRowHeight.estimatedSectionHeaderHeight.estimatedSectionFooterHeight三个高度估算属性由默认的0变成了UITableViewAutomaticDimension,MJRefresh的KVO会监听错误的contentoffset,造成

  • 浅谈iphone X的简单适配问题(推荐)

    浅谈iphone X的简单适配问题(推荐)

    上周Apple大大发布了新的设备,其中最引人注目的莫过于iphone X,对于这款设备官方有详尽的解说官方文档,除了最新的若干AR.人工智能等功能外,我们发现这也是一款全新尺寸的设备. 官方文档指出这款设备的没有home键,当然有若干手势操作代替了home键的功能,同时该设备也是基本的全面屏设备.当然听到了不少吐槽该设备的"前刘海",但是我认为相对于刘海上添加的功能,这个刘海也无伤大雅,毕竟相比美观,对于我这种务实者来说更看重功能,闲话不多说,我们在苹果发布设备的第一时间对我们的工程做

  • 浅谈angularjs module返回对象的坑(推荐)

    通过将module中不同的部件拆分到不同的js文件中,在组装的时候发现module存在一个奇怪的问题,不知道是不是AngularJS的bug.至今没有找到解释. 问题是这样的,按照理解,angular.module('app.main', []);这样一句话相当于从app.main命名空间返回出一个app对象.那么,不论在任何js文件中,我通过该方法获得的app变量所储存的指针都应该指向唯一的一个堆内存,而这个内存中存储的就是这个app对象.这种操作在module的js文件,和controlle

  • 浅谈Android RecyclerView 间距全适配

    本文介绍了Android RecyclerView 间距全适配,分享给大家,具体如下: LinearLayoutManager spacing import android.graphics.Rect; import android.support.v7.widget.RecyclerView; import android.view.View; /** * Created by anonymous on 2016/9/9 0009. * <p> * SpacesItemDecoration

  • 浅谈thinkphp5 instance 的简单实现

    最近学习 ThinkPHP5,第一次看到 TestClass::instance() 就能创建 TestClass 实例的方法.感到很好奇,翻阅 ThinkPHP 的源代码,大体理解了 它的 设计思想,非常的先进. 老规矩,直接上代码: <?php class TestClass { public static function instance() { return new self(); } public $data = []; public function __set($name, $

  • 浅谈C# AOP的简单实现

    前言:为了弄清楚AOP,博主也是拼了.这篇打算写写AOP,说起AOP,其实博主接触这个概念也才几个月,了解后才知道,原来之前自己写的好多代码原理就是基于AOP的,比如MVC的过滤器Filter,它里面的异常捕捉可以通过FilterAttribute,IExceptionFilter去处理,这两个对象的处理机制内部原理应该就是AOP,只不过之前没有这个概念罢了. 一.AOP概念 老规矩,还是先看官方解释:AOP(Aspect-Oriented Programming,面向切面的编程),它是可以通过

  • 浅谈Java slf4j日志简单理解

    一.理解 slf4j(Simple Logging Facade for Java),表示为java提供的简单日志门面,更底层一点说就是接口.通过将程序中的信息导入到日志系统并记录,实现程序和日志系统的解耦 日志门面接口本身通常并没有实际的日志输出能力,它底层还是需要去调用具体的日志框架API的,也就是实际上它需要跟具体的日志框架结合使用.由于具体日志框架比较多,而且互相也大都不兼容,日志门面接口要想实现与任意日志框架结合可能需要对应的桥接器,就好像JDBC与各种不同的数据库之间的结合需要对应的

  • 浅谈redux以及react-redux简单实现

    写在前头 redux 简介 随着 JavaScript 单页应用开发日趋复杂,JavaScript 需要管理比任何时候都要多的 state (状态). 这些 state 可能包括服务器响应.缓存数据.本地生成尚未持久化到服务器的数据,也包括 UI 状态,如激活的路由,被选中的标签,是否显示加载动效或者分页器等等. 管理不断变化的 state 非常困难.如果一个 model 的变化会引起另一个 model 变化,那么当 view 变化时,就可能引起对应 model 以及另一个 model 的变化,

  • 浅谈vue 移动端完美适配方案

    前言:根据最近做的一个医疗手机端项目总结在移动端,vue怎么在不同屏幕上做根据不同屏幕大小适配 1.适配方案 在本项目中我所使用的vue移动方案是使用amfe-flexible 和 postcss-pxtorem 结合)的方式. 首先介绍一下amfe-flexible amfe-flexible 是配置可伸缩布局方案,主要是将 1rem 设为 viewWidth/10. 然后就是这个库 postcss-pxtorem postcss-pxtorem是postcss的插件,用于将像素单元生成rem

  • 浅谈mvvm-simple双向绑定简单实现

    浅谈mvvm-simple双向绑定简单实现

    mvvm模式解放DOM枷锁 mvvm原理分析 JavaScript在浏览器中操作HTML经历了几个不同阶段 第一阶段 直接用浏览器提供的原生API操作DOM元素 var dom = document.getElementById('id'); dom.innerHTML = 'hello mvvm'; 第二阶段 jQuery的出现解决了原生API的复杂性和浏览器间的兼容性等问题,提供了更加简易方便的API $('#id').text('hello mvvm') 第三阶段 MVC模式使前端可以和后

  • 浅谈Spring Boot 微服务项目的推荐部署方式

    如果开发过spring boot的程序,应该都知道,使用spring boot官方的maven打包插件(spring-boot-maven-plugin) 来打包,打出来的jar包一般有40M以上. 如果公司的服务器上传带宽不高,那么手动上传一个jar或者jenkins部署一次jar,都是非常痛苦的........ 但是,如果打包的时候不引入lib,那么打出来的jar包一般只有几十k而已,非常小,想怎么传就怎么传......... 本文会提供一个bash启动脚本,只需要稍做更改,即可适应你的程序

随机推荐