前言

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尺寸如下圖：

手機尺寸

目前市場上主要尺寸以及對應圖片：

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

步驟

1. 在Xcode的Assets.xcassets中創建圖片組并且命名Image_qidong(隨意)。

創建圖片組g

2. 右鍵圖片組 --> 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"
      }
    }

修改后圖片組

3. 將對應圖片添加進入圖片組中

   注意??：不要整體拖進去，不會自動識別，逐一添加。

添加對應圖片

4. 設置LaunchScreen.storyboard，并將圖片設置成剛剛的image_qidong

設置LaunchScreen.storyboard

5. 設置用LaunchScreen.storyboard作為啟動圖。

設置LaunchScreen.storyboard作為啟動圖

注意??：

1. LaunchScreen.storyboard布局的時候，上下需要選擇邊界view，默認是SafeArea。
2. 需要將LaunchImage的設置去掉，否則會報錯。
3. 設置完成后重啟下Xcode，否則設置沒有效果，感覺是Xcode的一個Bug。

效果

下面展示不同機型的啟動效果：

iPhone 6sp

iPhone 8

iPhone 8p

iPhone X?

iPhone Xs Max

iPhone 11 Pro Max

方案3：將素材進行分割加載，當成普通的storyboard文件進行相關處理。

這里就是將需要的啟動圖中的元素，包括logo，文字，圖片等單獨切出來，然后跟普通頁面那樣加載UI控件等。這就可以解決了不同尺寸屏幕的適配問題以及包資源體積增大的問題。好處就是包體積小了適配各種機型更靈活（但是背景圖還是不可避免的要失去部分顯示效果），不好的地方就是以后要是換開屏圖，那么就要開發者有一定的工作量進行處理。