iOS 13使用LaunchScreen.storyboard适配各尺寸启动图

最近搞FLutter, 基于Flutter的启动在做适配, 发现原来很久没有单独关注iOS的变化, 在启动图方面, 我们常用的iOS 的 launchImage, 已经不再被苹果推荐了…
而是全面转向统一的LaunchScreen.sb启动, 因此我们想要再去无脑的往LaunchImage里面丢图片是不再可行的方案, 需要自己去适配各个iOS设备,
具体的看这个文章比较全面…
这个世界变化真的快

iOS 13使用LaunchScreen.storyboard适配各尺寸启动图

iOS13最新LaunchScreen.storyboard 启动图屏幕适配

~~因为是使用Flutter, 我个人倾向于选择第三种方式, 即依旧用多图来进行适配, 统一的原理还是可以适用于android,~~

多讲一句

LaunchImage_14">想继续用LaunchImage的思路来适配

会发现 LaunchScreen.storyboard中, 去加载资源其实读不出图片, 上面也有哥们说在json里面添加空格, 其实我发现没有用, 关键在于要放一张图 ,
在 contennts.json 中要配上这个, 才能让整个json 被加载读取


      "idiom" : "iphone",
      "scale" : "1x"
    },
    {
      "idiom" : "iphone",
      "filename" : "640-1136.png",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x"
    },

Contents.json 可以这样搞

{
  "images" : [
    {
      "idiom" : "iphone",
      "scale" : "1x"
    },
    {
      "idiom" : "iphone",
      "filename" : "640-1136.png",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "subtype" : "retina4",
      "scale" : "1x"
    },
    {
      "idiom" : "iphone",
      "filename" : "640-1136.png",
      "subtype" : "retina4",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "subtype" : "retina4",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "filename" : "1242-2208.png",
      "subtype" : "736h",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "filename" : "750-1334.png",
      "subtype" : "667h",
      "scale" : "2x"
    },
    {
      "idiom" : "iphone",
      "filename" : "1125-2436.png",
      "subtype" : "2436h",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "filename" : "1242-2688.png",
      "subtype" : "2688h",
      "scale" : "3x"
    },
    {
      "idiom" : "iphone",
      "filename" : "828-1792.png",
      "subtype" : "1792h",
      "scale" : "2x"
    }
  ],
  "info" : {
    "version" : 1,
    "author" : "xcode"
  }
}

就可以读取到图片资源了

关于约束的问题…

因为有个刘海屏,有个大下巴的原因, 在iPhone X 的前后设备适配上, 确实要做一个选择…
如果说, 由于公司和业务 ,UI设计的Launch页面内容, 是那种四周留白比较多的, 其实约束倾向于使用iPhonex 一下设备的全屏约束,
缺点: iPhoneX以上设备上下会有留白… 取巧的办法是讲LaunchScreen.sb的View的背景色设置成图片背景色一致

在这里插入图片描述