iOS

iOS13 / iPhone12---LaunchScreen.

2020-04-02  本文已影响0人  小緈福

从2020年4月开始,所有使⽤ iOS13 SDK的 App将必须提供 LaunchScreen,
LaunchImage即将退出历史舞台

2020年2月10号更新
评论里很多兄弟反映了几个问题
1,ios13系统有问题
2,刘海屏上下有黑边
3,文章的demo是白图,看不出来是否适配。
本人今天恰逢有新项目,顺道来看一下我这个配置,本人未发现有这三个问题,尤其是第三个,其实看一下准备>的图就发现上面的白边是少了一部分的,说明并没有留白。
放上xs max的截图,其他的就懒得放了

1229008-dd504fb8fd741fc7.png

今天拿到新启动项目的启动图,突然想到这条iOS13的要求,恰好最近在适配公司其他的工程到iOS13。像在下这个菜鸡当然是先百度为敬。


1229008-19373cfe8fca080d.png
然后吃了一惊,网上竟然几乎没有这方面的资料(可能菜到不会百度)即便是有,也是将图片直接放在LaunchScreen.storyboard进行粗暴的拉伸,就目前苹果这个机器越来越复杂的情况,很明显粗暴的拉伸是绝对满足不了需求的。 1229008-7fd1964cb31c2c46.png
肿么办呢?通过查阅各方资料,再加上自己思考(自闭)终于找到一个方法,也不知道是不是正规操作,总之是完成了适配。

准备图片

1229008-5679f8befe8067dd.jpg.png
1229008-75cf05911e52e2ae.jpg.png

我们准备了目前市场占比较高的手机尺寸的图片

为了区分每个手机屏幕,在图片上做了标记。

Xcode创建图片



将所有尺寸的图片拖入到当前图片的文件夹下



xcode会自动同步,但是会出现不识别的警告。

然后用编辑器打开Contents.json文件


1229008-dd19c95cadcafc4c.png
将三个数组字典删除掉,更换成
    {
      "idiom" : "iphone",
      "scale" : "1x"
    },
    {
      "idiom" : "iphone",
      "filename" : "iPhone4.png",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "subtype" : "retina4",
      "scale" : "1x"
    },
    {
      "idiom" : "iphone",
      "filename" : "iPhone5s.png",
      "subtype" : "retina4",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "filename" : "iPhone8P.png",
      "subtype" : "736h",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "filename" : "iPhone8.png",
      "subtype" : "667h",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "filename" : "IPhoneX.png",
      "subtype" : "2436h",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "filename" : "iPhone XS Max.png",
      "subtype" : "2688h",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "filename" : "iPhone XR.png",
      "subtype" : "1792h",
      "scale" : "2x"
    }

这时我们的xcode就变成了这样


操作LaunchScreen.storyboard

注意: 布局的时候,上下需要选择边界view,默认是SafeArea
然后图片image填上我们刚才创建的图片名。


注意:在我们敲入名字的时候,可能会出现图片不识别的情况,xcode11现在敲入图片的时候已经会提示了,也不会出现提示,在json文件中加上前面这段空状态或者有一张图就行,意思一下,原理是什么不知道,大佬可以评论一下解答,多谢
    {
      "idiom" : "iphone",
      "scale" : "1x"
    },
    {
      "idiom" : "iphone",
      "filename" : "iPhone4.png",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "subtype" : "retina4",
      "scale" : "1x"
    }

这样就会有提示,且图片不在为大问号。


运行测试






iPhone12系列启动页适配(仅供参考)

在 iPhone 12 以前,content.json中配置好相应的屏幕尺寸之后(如上),Xcode 会自动匹配相应的设备。而到目前为止,Xcode 12.2 不会对iPhone 12,iPhone 12 Pro, iPhone 12 Pro Max 这三个机型做自动精准匹配。所以,只能加入通用 2X、3X 图。
具体做法:
1、选中对应的imageSet,展开右侧栏,勾选 “Universal”;
2、图片区域会多出一组 Universal 的图片位置,拖入对应的图片;12系列的尺寸在上方有


🎉🎉🎉🎉🎉🎉🎉🎉🎉🎉鼓掌鼓掌🎉🎉🎉🎉🎉🎉🎉🎉🎉

附:【使用lunchScreen.xib清除之前的缓存】

作者邮件:zhangxmsy@163.com, 有问题联系。

上一篇下一篇

猜你喜欢

热点阅读