研究了5个小时的iPhoneX适配. 从catalog,storyboard,safearea等一系列文章中发现.如果我们想完全撑满全屏.那直接建一个storyboard就好了.但撑满全屏后,流海就是一个恶心的问题. 思索半天后,我们发现,其实我们想要的.并不是撑满. 而是要去除留海部分.那有没有一种办法,干脆就让我们的iPhoneX达到和iPhone6一样的显示效果呢. 或许这才是我们想要的. 下面的代码,放入每一个场景的onLoad中,靠热更新,就能支持iPhoneX了,效果不要不要的.(思

WeTest 导读 随着苹果发布会的结束,Xcode的GM版也上线了,也意味着iPhoneX适配之旅的开始. 一.设计关注篇 注意设计的基本原则:(苹果呼吁的) 规格原帖:https://developer.apple.com/library/content/documentation/DeviceInformation/Reference/iOSDeviceCompatibility/Displays/Displays.html WWDC__Designing for iPhoneX最终说明见

最近在公司开发游戏,使用cocos creator做微信小游戏,遇到一个很恶心的问题,如图: 如图所示,微信的广告位被iphonex的底部bar给弹出了一点位置,没有靠在底部. 在这里不得不吐槽一下微信的小程序接口还有个恶心的地方,那就是他的广告style没有bottom,right属性,使得置底部必须使用算法计算.也就是winsize.height-广告高度(realheight),居中是winsize.width-广告宽度/2. 而就算如此,在Android和iphone普通手机上是没有适配

研究了5个小时的iPhoneX适配. 从catalog,storyboard,safearea等一系列文章中发现.如果我们想完全撑满全屏.那直接建一个storyboard就好了.但撑满全屏后,流海就是一个恶心的问题. 思索半天后,我们发现,其实我们想要的.并不是撑满. 而是要去除留海部分.那有没有一种办法,干脆就让我们的iPhoneX达到和iPhone6一样的显示效果呢. 或许这才是我们想要的. 下面的代码,放入每一个场景的onLoad中,靠热更新,就能支持iPhoneX了,效果不要不要的.(思

最近实在是蛮闲的,这都得益于苹果爸爸给力的审核,已经半个月了(委屈) 这个问题已经很久了,但是还是希望分享给各位,当然网上的教程的确很多: 1.automaticallyAdjustsScrollViewInsets automaticallyAdjustsScrollViewInsets是在iOS11之前为ScrollView自动处理内边距的,讲实话这个属性我从来都是禁止的,不喜欢被别人自动控制,主要原因还是因为控制不住别人的自动控制. 当设置为YES时(默认YES),如果视图里面存在唯一一个

在想cocos适配之前,我们想想网页是怎么适配的.浏览器有各种规格,网页的一般做法是:背景图片铺满,网页内容保持在背景图片上居中,就实现了适应或者适配.css一般这样: .bg{ height:582px; background-image:url('images/top_team_bg.png'); background-size:auto 100%; background-position: center center; background-repeat: no-repeat; } .co

一. cocos creator 提供的几种适配策略 EXACT_FIT: 整个应用程序在指定区域可见,无需尝试保留原始纵横比.可能会出现失真,应用程序会被拉伸或压缩.也就是说设计分辨率的长和宽不会等比缩放,它们会各自进行缩放,设计分辨率的宽会用 "屏幕宽/设计分辨率宽" 作为缩放因子,设计分辨率的高会用 "屏幕高/设计分辨率高" 作为缩放因子.(2.0版本这个策略有问题,等修复) NO_BORDER: 整个应用程序填充指定区域,没有失真,但可能会有一些裁剪,同时保

kbengine_js_plugins 改动(2017/7/6) 由于Cocos Creator使用严格模式的js,而原本的kbengine_js_plugins是非严格模式的,因此为了兼容和方 便Cocos Creator开发的同学,本人对此脚本做了相应的修改,并共享出来. 1:修改了继承的实现方式(旧版本使用callee,严格模式下不能用callee) 2:变量名的定义(严格模式下,全局变量需要显式声明,并且为了防止全局命名污染,因此在变量名前加入了var声明为局部变量) 3:导出KBEng

iphoneX();function iphoneX(){ var oMeta = document.createElement('meta'); oMeta.setAttribute('name',"viewport"); oMeta.setAttribute('content',"width=device-width,initial-scale=1.0,viewport-fit=cover"); document.getElementsByTagName('he

不得不提到的是,苹果的iPhone自发布以来就始终引领着智能手机发展的方向.比如iPhone一代出现之后,就慢慢将键盘手机赶下历史舞台,让触屏手机成为主流.此外,iPhone的指纹识别.金属机身.玻璃机身,乃至土豪金等颜色,都成为其他手机厂商模仿的对象.毕竟在大众消费者心中,iPhone是绝对的标杆之作,一切都是最好的,值得去追捧. iPhone X的刘海屏丑不丑?的确丑.毕竟这块刘海的出现破坏了手机屏幕的整体美感,与传统美学观念格格不入.如果是由国产手机厂商甚至三星先推出刘海屏手机,那肯定会被

@media only screen and (device-width:375px) and (device-height:812px) and (-webkit-device-pixel-ratio:3) { body:after { content: ''; ; position: fixed; ; bottom: -.68rem; width: 100%; height: .68rem; background: #fff } }

​1.  iPhoneX的介绍 屏幕尺寸 我们熟知的iPhone系列开发尺寸概要如下: △ iPhone各机型的开发尺寸 转化成我们熟知的像素尺寸: △ 每个机型的多维度尺寸 倍图其实就是像素尺寸和开发尺寸的倍率关系,但这只是外在的表现.倍图核心的影响因素在于PPI(DPI),了解屏幕密度与各尺寸的关系有助于我们深度理解倍率的概念:<基础知识学起来!为设计师量身打造的DPI指南> iPhone8在本次升级中,屏幕尺寸和分辨率都遗传了iPhone6以后的优良传统: 然而iPhone X 无论是在

​1.  iPhoneX的介绍 屏幕尺寸 我们熟知的iPhone系列开发尺寸概要如下: △ iPhone各机型的开发尺寸 转化成我们熟知的像素尺寸: △ 每个机型的多维度尺寸 倍图其实就是像素尺寸和开发尺寸的倍率关系,但这只是外在的表现.倍图核心的影响因素在于PPI(DPI),了解屏幕密度与各尺寸的关系有助于我们深度理解倍率的概念:<基础知识学起来!为设计师量身打造的DPI指南> iPhone8在本次升级中,屏幕尺寸和分辨率都遗传了iPhone6以后的优良传统: 然而iPhone X 无论是在

版本信息: hips ui: 0.1.43 须知: 随着hips ui的迭代,可能会解决适配问题,所以下面的方案是有时效性的. 如果你项目上很紧急,可以直接看第三部分解决方案,复制粘贴代码即可. 一. 无适配情况 自从iPhone X出了刘海屏后,对于我们前端是适配难度又更上一层楼.不知道你有没有遇到过如下情况 1.头尾嵌入边框 2.在适配了头尾之后,scroll框子没做适配,出现最后的内容别下方小黑条遮住的情况 3.适配了iPhoneX,却没有适配iPhoneXs Max 如果,你遇到过以上几

一.APP在iphoneX运行后不能占满,上下都有多余的边 解决方法:把旧的image.xcassets中的LaunchImage删掉,重新创建并在Images.xcassets中为iPhone X添加一个LaunchImage,新的启动图尺寸为1125px × 2436px(375pt × 812pt @3x). 问题原因:1.应用启动后的显示尺寸会根据启动图的大小来显示,因为旧的工程没有iPhoneX的尺寸,所以就会出现上下有多余边的问题. 2.旧工程工程的xcassets没有iPhoneX

引言 iPhoneX发布至今已经有将近一年的时间了,各类app都多多少少做了对iPhoneX的适配,那对于我们H5页面该做哪方面的适配呢? 首先了解安全区域(safe area)的概念,它保证了内容在设备上的正确嵌入,不会被状态栏.导航栏等遮挡. Apps should adhere to the safe area and layout margins defined by UIKit, which ensure appropriate insetting based on the devic

本文主要简单谈谈并收集一些关于 iOS 11 & iPhone X 的适配及设计指南. iPhone X 众所周知,iPhone X 屏幕与其他的 iPhone 设备均不同,苹果称 iPhone X 的屏幕为超级视网膜显示屏. 在 iPhone X 上 1pt 相当于 3x3 px,也就是我们常说的 @3x,同 Plus 机型. iPhone X 的屏幕尺寸为 375x812 pt(即 1125×2436 pix).iPhone X 比 4.7 寸机型屏幕多出 145 pt. iPhone X

一.原生适配iphoneX 原生适配很简单,查看机型图:   只要用 #define KIsiPhoneX ([UIScreen mainScreen].bounds.size.height>800.0f 判断是iPhone X的机型时,就在控制器的顶端,和底部留出 44px和34px的距离,然后webView装在这个控制器内就OK! 优点:在原生中适配,h5页面不用更改任何一句代码. 缺点:1)意味着如右图某些通栏页面无法实现, 2)顶部和底部显色固定,无法适应页面颜色,(王者荣耀用链接地址传

转载自:https://www.cnblogs.com/lolDragon/p/7795174.html 1.  iPhoneX的介绍 屏幕尺寸 我们熟知的iPhone系列开发尺寸概要如下: △ iPhone各机型的开发尺寸 转化成我们熟知的像素尺寸: △ 每个机型的多维度尺寸 倍图其实就是像素尺寸和开发尺寸的倍率关系,但这只是外在的表现.倍图核心的影响因素在于PPI(DPI),了解屏幕密度与各尺寸的关系有助于我们深度理解倍率的概念:<基础知识学起来!为设计师量身打造的DPI指南> iPhon

iPhone X适配方案 https://github.com/Wscats/iPhone-X 绝对长度单位 英寸 厘米 毫米 磅 pc inch cm mm pt pica 相对长度单位 是网页设计中使用最多的长度单位,包括px.em.rem等 屏幕尺寸 指屏幕的对角线的长度,单位是英寸,1英寸=2.54厘米 iPhone 4/4S iPhone 5/5C/5S/SE iPhone 6/6S iPhone 6S Plus iPhone 7 iPhone 7 Plus iPhone 8 iPho

cocos有很多代码实际上都不再使用了,看代码时反而误导了程序员. 比如一个简单的分辨率适配,我查到了setContentSize,然后调用setContentSize,毫无用处啊!于是乎,我到处查资料,终于发现解决办法,非常简单,纪录在下面. 做界面时,使用固定的设计分辨率,需要某个元素适配分辨率时,使用右边的锚点设置.做好以后载入进来,如此调用: Node* uiNode = CSLoader::getInstance()->createNode("file.csb"); S