iOS 13 LaunchScreen.storyboard 启动图屏幕适配

苹果3.26 发文延迟使用 Xcode storyboard(故事板) 来提供 app 的启动屏幕,截止日期延长到6.30.弃用iOS Launch Image 早晚都得整,来写一篇博客讲讲使用方法以及适配.

快速解决办法. 原来的Launch Image 文件里的图片以及.json 文件复制. 放到一个新建的New Image Set 里,运行就ok. 以下是详细过程.

1 新建工程哈. AppDelegate 睡一觉,方便观察.

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {// Override point for customization after application launch.sleep(1000)return true}

2 点击 LaunchScreen.storyboard xib 布局我写详细些, 有些人是鄙视xib 的,基本没怎么用过.

点击Xcode右上角 + 如下图

大约在第15 个左键拖到屏幕上,上下左右挪动. 如图. 选中 image 点击下图. 上下左右暂时先都给10. 记得拖成下图,这样,不然因为安全区域以及x的刘海会有留白.(不熟悉xib的小伙伴,建议需先把imageview 拖成如下图这样,在给约束为10,然后在修改这个约束切记切记)

记得选中图片,然后把10 改成0 ,如图点击红框里的Edit 或者双击,四个10 -> 0.

3 然后Assets.xcassets 最下面有个+ 点击选择 New Image Set. 如上图.

然后选中 Image 右键 show in finder .

4 找到你的工程里原来的 LaunchImage show in finder 找到文件如下复制.. 粘贴到第三步打开的文件夹.

这一步之后Contents.json 自动发生变化.

粘贴前:

{"images" : [{"extent" : "full-screen","idiom" : "iphone","subtype" : "2436h","filename" : "1125@3x.png","minimum-system-version" : "11.0","orientation" : "portrait","scale" : "3x"},{"extent" : "full-screen","idiom" : "iphone","subtype" : "736h","filename" : "LaunchImage-800-Portrait-736h@3x.png","minimum-system-version" : "8.0","orientation" : "portrait","scale" : "3x"},{"extent" : "full-screen","idiom" : "iphone","subtype" : "667h","filename" : "LaunchImage-800-667h@2x.png","minimum-system-version" : "8.0","orientation" : "portrait","scale" : "2x"},{"orientation" : "portrait","idiom" : "iphone","filename" : "LaunchImage-700@2x.png","extent" : "full-screen","minimum-system-version" : "7.0","scale" : "2x"},{"extent" : "full-screen","idiom" : "iphone","subtype" : "retina4","filename" : "LaunchImage-568h@2x.png","minimum-system-version" : "7.0","orientation" : "portrait","scale" : "2x"}],"info" : {"version" : 1,"author" : "xcode"}
}

粘贴后:

{"images" : [{"idiom" : "iphone","scale" : "1x"},{"idiom" : "iphone","filename" : "LaunchImage-700@2x.png","scale" : "2x"},{"idiom" : "iphone","scale" : "3x"},{"idiom" : "iphone","subtype" : "retina4","scale" : "1x"},{"idiom" : "iphone","filename" : "LaunchImage-568h@2x.png","subtype" : "retina4","scale" : "2x"},{"idiom" : "iphone","subtype" : "retina4","scale" : "3x"},{"idiom" : "iphone","filename" : "LaunchImage-800-Portrait-736h@3x.png","subtype" : "736h","scale" : "3x"},{"idiom" : "iphone","filename" : "LaunchImage-800-667h@2x.png","subtype" : "667h","scale" : "2x"},{"idiom" : "iphone","filename" : "1125@3x.png","subtype" : "2436h","scale" : "3x"}],"info" : {"version" : 1,"author" : "xcode"}
}

5 找到故事版添加的image . 写上刚才整的图片. 以及适配模式建议Aspect Fill 留白和填满,我选填满.

6 Build Settings 里的 Asset Catalog App lcon Set Name 设置成空,如图.

7 运行一下, ok了.

主意事项:

1 General 里的 Launch Screen file 写成 LaunchScreen

2 做好以上步骤还是不行的话,记得卸载app 重新运行.

3 本来一个小时搞定的事儿,发觉有些工程里的图片直接拖进来不适配(故事版里xib 可以看到是否适配,如果不适配就需要注意了就是图片只显示了一部分),这个务必注意.

猜测可能是切图不规范或者图片过大,我的两套图没问题,一套图怎么都不行.不行的那套图,图片大一些.大约3.6M. 另外两个可以的一个600kb, 一个1.6M 仅供参考.

4. 我这个没有xsm 的图片建议大伙都加上.

5 另一种适配方式,UI切图,故事版里,用自动布局写个启动图,横屏貌似实现不了,会的小伙伴求告知.

6 写在最后,更精细的适配.可用如下文件 Contents.json 以下是内容.

原理应该是跟原理的1x ,2x,3x 适配图片原理一样的, 根据scale 以及subtype做的图片适配.

下面每个里面记得加 "filename" : "picture.png",

{"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"},{"idiom" : "ipad","scale" : "1x"},{"idiom" : "ipad","scale" : "2x"}],"info" : {"version" : 1,"author" : "xcode"}
}

iOS 13 LaunchScreen.storyboard 启动图屏幕适配相关推荐

storyboard 苹果启动图_iOS13最新LaunchScreen.storyboard 启动图屏幕适配
从2020年4月开始,所有使⽤ iOS13 SDK的 App将必须提供 LaunchScreen,LaunchImage即将退出历史舞台 2020年3月22号更新评论里很多兄弟反映了几个问题 1,i ...
storyboard 苹果启动图_iOS LaunchScreen.storyboard启动图更新
根据苹果要求2020年4月之后上线的APP都必须使用LaunchScreen适配启动图,在研究的过程中发现还是有一些坑的,记录一下. 环境: Xcode 11.3 + iPhone 11 + iOS ...
关于LaunchScreen.storyboard启动设置（包含不同设备适配）
消除警告 1.warning: Launch images are deprecated in iOS 13.0. Use a launch storyboard or XIB instead. 2. ...
iOS LaunchScreen.storyboard 的使用和适配
一.苹果审核新规背景:WWDC在2019有session提出.到2020年4月,上架APP的启动页必须使用launchscreen.storyboard,不能再使用assert方式了,后面延迟到20 ...
IOS使用LaunchScreen Storyboard实现启动图片
1.res下创建Launch Screen文件在view controller scene中设置自己想要的logo界面.(记得勾选Use as Launch Screen) 2.在Target的工程 ...
AppLaunchScreen/Screenshot(启动图/屏幕快照)输出规范
启动图需要做7套,必须为 PNG 格式,且必须采用 RGB 颜色空间显示屏设备尺寸启动图命名 6.5 英寸超视网膜显示屏 iPhone XS Max 1242px × 2688px Defau ...
storyboard 苹果启动图_使用Xcode storyboard 来提供 app 的启动屏幕
一. 背景 6月30日前,苹果要求所有的app必须使用storyboard来提供app的启动屏幕. 其主要目的就是希望所有的开发者尽量不使用一张纯图片作为启动页面,而是希望APP的启动页面和其他页面一 ...
storyboard 苹果启动图_iOS平台自定义storyboard启动界面
背景 6月30日起,苹果App Store审核要求应用在启动时,不能使用启动图片,必须改为使用Storyboard来制作启动界面.原文参考:https://developer.apple.com/ne ...
iOS 是如何获取夜间模式启动图缓存路径？
Python实战社群 Java实战社群长按识别下方二维码,按需求添加扫码关注添加客服进Python社群▲ 扫码关注添加客服进Java社群▲ 作者丨酷酷的哀殿来源丨酷酷的哀殿的博客 https ...

iOS 13 LaunchScreen.storyboard 启动图屏幕适配

iOS 13 LaunchScreen.storyboard 启动图屏幕适配相关推荐

最新文章

热门文章