app启动时的闪屏页显示不全问题的两种解决方案

1.把闪屏页面设计成只有底部有图文,接近中间部分为单一颜色背景。
2.在工程里设置为不显示状态栏,在首页显示状态栏。
最近测试美女给我提一个bug:启动闪屏页,拍品详情页,页面显示不全.
app启动时的闪屏页显示不全问题的两种解决方案_第1张图片
仔细看一下截图,发现我们的闪屏页面中间是一个很大的优字,应用启动时,确实看到这个优字中间少了一部分而出现错乱。估计是这个丢失的部分就是状态栏的高度吧!
我就进行各种app的启动页面的对比,并且用不同类型的手机测试。发现几个app与我们app一样启动闪屏页面显示不全。
随便找一个app看下效果,在正常模式下还算正常(估计闪屏图UI进行过特别处理,尽量避免这种异常,也可能是使用的是Launch Screen文件的约束功能的原因,为了兼容低版本的ios,我们使用的是Launch Images),再看个人热点蓝条下压是,这个app的闪屏页面比我们的app还凌乱,略过。看下一家。
app启动时的闪屏页显示不全问题的两种解决方案_第2张图片

app启动时的闪屏页显示不全问题的两种解决方案_第3张图片

再来看我们伟大的淘宝app,在正常模式下蛮正常的(估计闪屏图UI进行过特别处理,尽量避免这种异常,也可能是使用的是Launch Screen文件的约束功能的原因,为了兼容低版本的ios,我们使用的是Launch Images),在个人热点共享,蓝条下压时,由于闪屏页面过于花里胡哨,也避免不了页面显示不全。看来大厂的app也不是都完美的。
app启动时的闪屏页显示不全问题的两种解决方案_第4张图片

app启动时的闪屏页显示不全问题的两种解决方案_第5张图片
这个app的闪屏页面稍微好些,,在正常模式下蛮正常的(估计闪屏图UI进行过特别处理,尽量避免这种异常,也可能是使用的是Launch Screen文件的约束功能的原因,为了兼容低版本的ios,我们使用的是Launch Images),但是在个人热点蓝条下压时,闪屏页面中间丢失了一部分,不过正好看到丢失的一部分是一段空白区域,但是看到文字好像稍微丢了一点点。只是由于有和没有个人热点,页面布局差异很大。所以这样的处理也不是很好。
app启动时的闪屏页显示不全问题的两种解决方案_第6张图片

app启动时的闪屏页显示不全问题的两种解决方案_第7张图片
再看几个大厂的app,发现他们的app大都没有这个问题。
他们的处理有两种:
第一种处理是:把闪屏页面设计成只有底部有图文,接近中间部分为单一颜色背景。下面是以大家熟悉的支付宝的闪屏页面为例子。可以看到,闪屏页面只最下面有图文。中间无论怎么缺失都是少了一条白色背景,用户感知不出来。
app启动时的闪屏页显示不全问题的两种解决方案_第8张图片

第二种处理是:在工程里设置为不显示状态栏,在首页显示状态栏。
app启动时的闪屏页显示不全问题的两种解决方案_第9张图片

app启动时的闪屏页显示不全问题的两种解决方案_第10张图片

app启动时的闪屏页显示不全问题的两种解决方案_第11张图片
具体实现是,工程设置为不显示状态栏如下图设置。
app启动时的闪屏页显示不全问题的两种解决方案_第12张图片
在第一个页面设置状态栏的样式,代码如下:

- (UIStatusBarStyle)preferredStatusBarStyle {
#if AGENT_APP
    return UIStatusBarStyleLightContent;
#else
    return UIStatusBarStyleDefault;
#endif
    
}

所以该谁的问题就要谁从源头上解决,UI设计师也不能帮解决所有情况,毕竟根源在我们app端。当然也不是一点和UI设计师无关,他可以设计出中间为单色的闪屏页面,当然这也不是他说了算,产品要显示那么多元素,他们也得不就范。闪屏页面不显示时间和热点共享信息大家都能接受吧!毕竟也就几秒,甚至一秒不到(具体多久和硬件速度和应用启动时同步加载的数据有关,建议采用懒加载启动数据更好,那样启动速度也快些),若超过5秒就被苹果操作系统干掉了。

你可能感兴趣的:(ios)