iOS高阶UI相关UI设计iOS

ios 引导页/启动页/广告页 适配方案

2019-03-28  本文已影响37人  sandy_w

两种实现方式

A.活图(即可灵活配置,资源图无需受限APP发版)

B.死图(资源图写在APP内,替换图时APP需发版)

活图的两种适配方式

【方案一:输出1125*2436px一张资源图】(内容安全区域:1242*2210px),iPhoneXS【375*812】、iPhoneXR【414*896】、iPhoneXS Max【414*896】等宽等高缩放即可适配;iPhoneSE【320*560】、iPhone8【375*667】、iPhone 8 Plus【414*736】等宽,居中裁剪上下。

举例,如下图:

验证对比图 适配效果图

【方案二:输出750*1334px和1125*2436px两张资源图】

因1125*2436px与iPhoneXS(@3x)【1125 x 2436】、iPhoneXR/XS Max(@3x)【1242 x 2208】等宽等高,所以等宽等高缩放即可适配

因750*1334px与iPhoneSE/5(@2x)【640*1136】、iPhone 8/7/6(@2x) 【750*1334】、iPhone 8/7/6 plus(@3x)【1242 x 2208】等宽等高,所以等宽等高缩放即可适

举例,如下图:

适配效果图


死图的适配

需输出:iPhoneSE@2x【640 x 1136】、iPhoen4s/4(@2x) 【640 x 960】、iPhone 8/7/6(@2x) 【750 x 1334】、iPhone 8/7/6 plus (@3x) 【 1242 x 2208】、iPhone x (@3x) 【1125 x 2436】尺寸PNG资源图


so,引导页/启动页/广告页输出资源尺寸

请根据自己家APP页面的需求选择相应的实现方式,并输出相应资源图。

-----------------------------------(重要事情说三遍)------------------------------

输出资源图为png、输出资源图为png、输出资源图为png、压缩、压缩、压缩!!!

上一篇下一篇

猜你喜欢

热点阅读