iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

作者:范世青王天宇17年下半年,苹果传出新一代iPhone的消息——iPhoneX。随之而来的还有他不同于以往任意一代iPhone的刘海设计。一时间,iPhoneX的适配问题迅速在产品圈流传开。而作为一个线上手游的客户端工程师,我在和团队共同历经了为iPhoneX适配的艰难岁月后,终于在产品上市之日,获得了商店首批适配推荐。那么iPhoneX适配到底有什么需要注意的点,又应该采取什么方案呢?&…

大家好,又见面了,我是你们的朋友全栈君。

作者:范世青 王天宇

17年下半年,苹果传出新一代iPhone的消息——iPhoneX。随之而来的还有他不同于以往任意一代iPhone的刘海设计。

一时间,iPhoneX的适配问题迅速在产品圈流传开。

而作为一个线上手游的客户端工程师,我在和团队共同历经了为iPhoneX适配的艰难岁月后,终于在产品上市之日,获得了商店首批适配推荐。

那么iPhoneX适配到底有什么需要注意的点,又应该采取什么方案呢?iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

>>iPhoneX的界面设计变化

1.状态栏高度的变化

iOS11之前状态栏默认高度为64pt,iOS11之后iPhoneX上由于刘海的出现statusBar由以前的20pt变成了44pt,所以iPhoneX上高度变为88pt

2.圆角和刘海

iPhoneX使用了之前从来没有使用过的圆角屏幕和存放各种传感器的刘海。

这表示放在角落的内容极有可能被裁剪而造成显示不全,从而影响查看和体验。iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

3.Home键变为Home指示条

物理Home键消失,而用一个屏幕底部的“Home指示条”代替,通过从底端上划手势实现返回桌面和切换程序功能。

需要注意的是,除了特定条件下,“Home指示条”将永远在屏幕底部(无论竖屏横屏旋转)

Home指示条会随背景自动改变成明暗状态,提供黑白两种颜色。iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

>>苹果给出的适配建议

1.安全区

苹果官方引入了安全区的概念,建议所有的可交互UI都放在安全区内,防止出现UI不可交互的境况。

但是,安全区只是一个参考,具体的情况还要看app的自身需求,综合考虑这些限制因素。得出自己想要的适配方案。iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

2.以用户体验为核心

在横屏状态下,不能因为刘海的原因将内容向左或者向右偏移,要保证内容的中心对称。这意味着,要进行如下图所示的适配方案设计:iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

因为,用户在横屏旋转手机的时候,app的内容如果也设置了相应的旋转,会造成同一个UI用户进行交互的位置会不一样,这有悖于人体肌肉的位置记忆功能。

总而言之,就是一切都要以用户的体验为核心。

>>iPhoneX相关尺寸说明

网上流传的尺寸说明由于单位和放大比不同,都不能很直观地适用于游戏UI。

这里整理了一下网上的几种说法,最终得出了我们实际需要的尺寸图。

首先,iPhoneX的分辨率是1125X2436,注意这是@3x下的像素分享率。iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

然后,我们来明确一下安全区的尺寸,刘海区的非安全区域高度占88 px,@2x(即132 px,@3x)。

由于横版游戏左右对称,可得出左右两侧的非安全区均为132px,@3x。iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

最终,我们可以得出横版游戏的安全区宽度为2172 px,@3x。

同时,下图还标注了Home指示区相关的一些尺寸提供给美术做设计参考。iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

>>横版游戏适配的注意事项

1.交互控件需要防止在安全区内。

2.Home指示条区域避免放置按钮、文字等UI元素,避免有从底部向上滑动的手势设计。

>>适配方案一:利用object-c对屏幕的显示范围进行限制

在进行极无双的iPhone X适配时,我首先想到的方案是,在xcode上,利用object-c对屏幕的显示范围进行限制,让游戏内容适配到官方的安全区范围内,四周加上背景。

很明显,这样的效果不尽如人意,最终被放弃了。

示意图如下所示:iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

>>适配方案二:修改Camera的size

1.判断设备是否是iPhoneX

根据Unity提供的SystemInfo.deviceModel得到的设备名称来判断

设备名称包含了iPhone10,3或者iPhone10,6时,为iPhoneX。

为了在编辑器下能模拟iPhone X设备环境,简单的用了屏幕分辨率来判断

2.修改UICamera的size

2436/2172≈1.121,因此修改UICamera的size为1.121,使摄像机可以拍全整个宽度范围内的UI。

需要注意的是,对于有左右锚点的UI元素,此时也会适配到屏幕边缘(刘海区),对此有两个解决方案:

(1)去掉左右锚点的设置,UI整体等宽适配;

(2)对这些控件判断,如果是iPhoneX特殊处理;

3.补全非安全区的背景填充

在正常的UI之外,补充一些UI元素,使摄像机放大后,左右两侧有正常的背景填充。

注意,这些内容是只有在iPhoneX上才能被看到。

示意图如下所示:iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]iphonex适配游戏_Unity+iPhoneX适配方案[通俗易懂]

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/126367.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • html静态网页制作教程_简单html静态网页代码 首页

    html静态网页制作教程_简单html静态网页代码 首页编辑一个文本文件,代码如下;<!DOCTYPEhtml><html><head><metacharset=”utf-8″><title>htmltest1</title></head><body><h1>DDDD</h1><p>PPPPPPPPPPP…</p><tableborder=”1″>

    2025年8月27日
    10
  • 如果不能显示真正的考验个别车型toast问题解决

    如果不能显示真正的考验个别车型toast问题解决

    2022年1月10日
    44
  • 鸿蒙系统手机电脑互传文件,华为手机怎么与电脑互传文件(Huawei Share教程

    鸿蒙系统手机电脑互传文件,华为手机怎么与电脑互传文件(Huawei Share教程未经允许 如果我想把手机的相册传到电脑上 9 接着按照电脑的提示 就必须通过 HuaweiShare 进行互传 如果对您有所帮助 END 注意事项本经验由作者 梦想快男 原创 5 在此电脑中的搜索框内输入网络 6 点击带有 HONOR 类似的前缀的图标 或是说电脑需要接收华为手机传送的文件 2 打开手机状态栏 通过手机可以知道用户名和密码 即可通过华为手机和电脑互传文件了 然后点击复制 需

    2025年11月5日
    4
  • C++中构造函数的作用「建议收藏」

    C++中构造函数的作用「建议收藏」构造函数用于解决类中的对象初始化的问题构造函数是一类特殊的函数,与其他的成员函数不同的是构造函数构造函数不需要用户来调用它,而是建立对象的时候自动的执行#include//#include”student.h”//#include//#includeusingnamespacestd;classTime{publi

    2025年8月29日
    6
  • phpstorm 激活码2021【最新永久激活】

    (phpstorm 激活码2021)好多小伙伴总是说激活码老是失效,太麻烦,关注/收藏全栈君太难教程,2021永久激活的方法等着你。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.htmlS32PGH0SQB-eyJsaWNlbnNlSW…

    2022年3月25日
    445
  • pycharm怎么缩小代码_pycharm快速缩进

    pycharm怎么缩小代码_pycharm快速缩进Pycharm编写代码的小技巧1、代码块缩进选中要缩进的代码块,按tab键,整个代码块缩进2、取消代码块的缩进选中要取消缩进的代码块,按shift+tab键,整个代码块取消缩进3、编写测试代码语句ifname==‘main’:输入main,然后按下Enter键4、在Pycharm中整块的代码进行注释选中要注释的代码,按下Ctrl+/5、取消整块代码的注释选中要取消注释的代…

    2022年8月27日
    4

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号