微信号:CocosEngine

介绍:Cocos引擎官方账号,第一时间为您送上引擎动态、精品教程、达人专访等干货,还会定期举办有奖活动喔!

「技术分享」iPhone X 快速适配,快得让你出乎意料

2017-12-27 23:55 C姐

早在今年九月苹果发布三款新手机后,作为第一款全面屏手机 iPhone X 由于刘海和修长的身型曾引起网友的热议。其分辨率更是改为 1125×2436,如果 Cocos 的游戏不做任何适配,直接安装,将会导致运行后出现上下或者左右两大黑边,游戏体验会大打特打折扣。



Cocos 引擎团队抢在第一时间就发布了 Cocos2d-x、Cocos Creator 的全屏适配方案,全程做到手把手包教包会。具体的修改方式可以进 github.com/cocos2d/cocos2d-x/pull/18276 参考教程说明。



今天C姐给大家推荐的是幼麟科技 CEO 麒麟子自主整理的另一个适配方案。同样适用,而且方案更加简洁明了,6 得飞起,小伙伴们可以自主选择。


本方案研究了 5 个小时的 iPhone X 适配教程,分别从 catalog、storyboard、safearea 等一系列文章中摸索。


如果我们想完全撑满全屏,那直接建一个 storyboard 就好了。但撑满全屏后,流海就是一个恶心的问题。


思索半天后,发现其实我们想要的,并不是撑满,而是要去除留海部分。



那有没有一种办法,干脆就可以让我们的 iPhone X 达到和前几款型号一样的效果呢? 下面的代码,放入每一个场景的 onLoad 中,靠热更新,就能支持 iPhone X 了,效果牛得不要不要的。(思路是 iPhone X 下面,用 ShowAll)



总结一下步骤

1、新建一个 Laucn Screen.storyboard;
2、删除所有 View 下面的内容,SafeArea 也要去掉;
3、General 里面,使用这个 Launch Screen 作为加载屏;


这里想要达到最好的效果,和分辨率设计也有关系。比较推荐的是 1280 x 640。在其他设备上,默认使用「定宽策略」。 也就是说,高度上做自适应,背景图做成 1280 x 960 就可以适配到 iPad 了。 

(如果之前用的是 1280 x 720 的设计分辨率,不打紧,勉强可用)


1280 x 640 的设计分辨率,效果见下图:




Storyboard 设置启动画面具备更强大的扩展性,引擎的示例中只是添加一张图片放到全屏的 UIImageView 中。开发者还可以根据对启动画面的需求,修改 storyboard、添加 UILabel 等其他 iOS 系统控件,实现更加丰富的布局效果。


亲测麒麟子的方案虽然便捷,如果要实现全屏,还需要用户自己调整 UI 避开刘海。但是!这个方案依然留了黑边,不确定苹果官方是否能审核通过。小伙伴们可以使用两种教程进行对比,欢迎提交反馈建议!


使劲!戳爆原文!
 
COCOS 更多文章 辟谣:苹果禁止用 Xamarin, PhonGap, Appcelerator 等开发应 Cocos 社区水友自发线下技术交流会 教程:Cocos Creator + Node-js 从 0 开发棋 今夜,我们来点不一样的! 游戏梦之夜,欢聚鹭岛,感谢有你!
猜您喜欢 中国小伙王潮和他的团队造出"铁甲钢拳"外骨骼CEXO-01 只说三件事 号外:诺基亚将“嫁给”小米,华为将“牵手”肯德基 十步快速学习法 以“桥”的视⻆来聊聊前端开发模式的变迁