LaunchScreen.storyboard启动图适配

2020-03-19 本文已影响0人 HF_K

前言

iOS 8之前我们都是通过LaunchImage来设置启动图，随着苹果设备的更新，尺寸也越来越多，这时候我们需要设置各种设备的启动图，而且每次增加新的尺寸的设备都需要添加相应尺寸的启动图，这个比较麻烦。因此iOS 8苹果引入了LaunchScreen.storyboard，支持了AutoLayout 和 SizeClass，这样能够更加方便的适配各种屏幕。

注意⚠️：苹果提出内容从2020年4月份开始，所有支持iOS 13的App必须提供LaunchScreen.storyboard，否则将无法提交到App Store进行审核。

因为最近提交App到App Store提示2020年4月份必须适配iOS 13，所以就适配iOS 13的同时，把LaunchScreen.storyboard也给处理了。

方案

方案1：使用一张通用图片

这种方案没什么难度，主要是在LaunchScreen.storyboard中添加图片并设置好约束，然后将准备好的图片设置好即可。这种方案在不同设备上可能会出现不同程度的裁剪。

方案2：使用一套图片(主要介绍)

因为公司项目需要，不希望出现裁剪的效果，因此要做成LaunchImage的效果。

iPhone尺寸如下图：

手机尺寸

目前市场上主要尺寸以及对应图片：

3.5寸的iPhone4s(640*960)
4.0寸的iPhone5/5s/5c/SE(640*1136)
4.7寸的iPhone6/6s/7/8(750*1334)
5.5寸的iPhone6p/6sp/7p/8p(1242*2208)
5.8寸的iPhoneX/XS/11Pro(1125*2436)
6.1寸的iPhoneXr/11(828*1792)
6.5寸的iPhone XS Max/11 Pro Max(1242*2688)

步骤

在Xcode的Assets.xcassets中创建图片组并且命名Image_qidong(随意)。

创建图片组g

右键图片组 --> Show in Finder --> 进入修改Contents.json --> 修改相应图片组信息

 //修改前
 {
   "images" : [
     {
       "idiom" : "universal",
       "scale" : "1x"
     },
     {
       "idiom" : "universal",
       "scale" : "2x"
     },
     {
       "idiom" : "universal",
       "scale" : "3x"
     }
   ],
   "info" : {
     "version" : 1,
     "author" : "xcode"
   }
 }

修改前图片组

    //修改后
    {
      "images" : [
        {
          "idiom" : "iphone",
          "scale" : "1x"
        },
        {
          "idiom" : "iphone",
          "scale" : "2x"
        },
        {
          "idiom" : "iphone",
          "scale" : "3x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "retina4",
          "scale" : "1x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "retina4",
          "scale" : "2x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "retina4",
          "scale" : "3x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "736h",
          "scale" : "3x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "667h",
          "scale" : "2x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "2436h",
          "scale" : "3x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "2688h",
          "scale" : "3x"
        },
        {
          "idiom" : "iphone",
          "subtype" : "1792h",
          "scale" : "2x"
        }
      ],
      "info" : {
        "version" : 1,
        "author" : "xcode"
      }
    }