iPhone X 适配

原创文章 分类: 教程 版权:
3274 24 15 4
2017-09-13
22.4
编辑推荐

Image title

昨夜发布的iPhone 8属于常规升级,屏幕与以往的iPhone 6、6S、7系列相同。在昨天发布的新机中,只有iPhone X的分辨率发生了变化,但变化仅限于物理像素层面。在真正决定屏幕内容的逻辑像素层面,新版的iPhone X与过去我们熟知的iPhone6、6Plus放大模式宽度相同。通俗的说,iPhone X可看做是iPhone 6的加长版。设计图尺寸可继续采用750x1334,切图输出@2x、@3x即可

Image title

对于习惯用750x1334作图的设计师而言,并不会带来太大影响,iPhone X与iPhone 6 的差异可理解为iPhone 4与iPhone 5

Image title

对于大多数采用瀑布流的页面来说,仅仅是屏幕高度上的变化,可以无视。但对于那些需要单屏显示的页面比如:新手引导页、音乐播放器等就得重新布局

Image title

由于 iPhone X的屏幕比例发生变化,对于长期靠“等比缩放”完成适配的H5活动页而言也有不小的影响,需要对页面结构进行适当微调

Image title

不过值得庆幸的是,高度上的变化虽然会带来一些不变,但总好过宽度上的变化。倘若宽度发生变化,可能会影响到设计基准的调整。






若有疑问请留言或前往主页翻阅往期内容 《适配① ~⑤》




海边来的设计师

公众号:颜伟CSD

6117粉丝/11关注

原创小生“劳模勋章”之锄头勋章
有一种失败叫瞎忙:一招突破三大瓶颈!三分钟弄懂iPhone X 设计尺寸和适配

京ICP备14007358号-1 / 京公网安备11010802014104号 / Powered by 2008-2018 UI.CN