##前言

近期在开发新项目, 然后针对 App Icon 与 App LaunchScreen 都需要重新切一套, 需要把相应尺寸大小跟 UI 说明一下, 加上最近刚发布的我 iPhone XS XR XS Max都需要进行统一适配,同时为了让自己以及 UI 同事能更好的去了解 iPhone 不同尺寸特意整理了一下。

App LaunchScreen(启动图)

下面分别罗列出当前所有 iPhone 不同机型尺寸所需 LaunchScreen Size, 其中 iPhone 6 7 8 尺寸一致, iPhone 6 7 8 P 尺寸一致, 所以分别切两种即可. 另外新出的 iPhone X XR XS XSMAX, 除了 X和 XS 尺寸一致外, 都需要分别对应不同尺寸。 其他的也就是 小屏的如 iPhone 4 5 SE 等。

Device 横屏尺寸 竖屏尺寸
iPhone XS Max 1242px × 2688px 2688px × 1242px
iPhone XS 1125px × 2436px 2436px × 1125px
iPhone XR 828px × 1792px 1792px × 828px
iPhone X 1125px × 2436px 2436px × 1125px
iPhone 8 Plus 1242px × 2208px 2208px × 1242px
iPhone 8 750px × 1334px 1334px × 750px
iPhone 7 Plus 1242px × 2208px 2208px × 1242px
iPhone 7 750px × 1334px 1334px × 750px
iPhone 6s Plus 1242px × 2208px 2208px × 1242px
iPhone 6s 750px × 1334px 1334px × 750px
iPhone SE 640px × 1136px 1136px × 640px

APP Icon

如果只是针对 iOS 移动端来说, 对 iphone 做配置的话, 按照下面指的这五种分别切图即可.

iPad Pro. iPad, iPad Mini 尺寸需另切。

主要包括五种类型图片, 分别是 手机上直接展示的 App Icon,搜索栏 App Icon, 设置栏 App Icon, 通知栏 App Icon, 另一个是 AppStore 上需要的。

Device or context Icon size
iPhone App Icon 180px × 180px (60pt × 60pt @3x)
iPhone App Icon 120px × 120px (60pt × 60pt @2x)
iPhone Spotlight Icon(搜索框下展示图标) 120px × 120px (40pt × 40pt @3x)
iPhone Spotlight Icon(搜索框下展示图标) 80px × 80px (40pt × 40pt @2x)
iPhone Settings Icon (设置栏里面展示图标) 87px × 87px (29pt × 29pt @3x)
iPhone Settings Icon (设置栏里面展示图标) 58px × 58px (29pt × 29pt @2x)
iPhone Notification icon 60px × 60px (20pt × 20pt @3x)
iPhone Notification icon 40px × 40px (20pt × 20pt @2x)
App Store 1024px × 1024px (1024pt × 1024pt @1x)

参考: [Apple Icon](https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/app-icon/)

希望此篇文章对您有所帮助,如有不对的地方,希望大家能留言指出纠正。谢谢!!!!!

学习的路上,与君共勉!!!

iOS App Icon启动图尺寸配置适配iPhone XS XR XS Max等相关推荐

  1. iOS App 设置启动图(LaunchImage)

    基本上所有APP都有启动图,用来过渡APP启动时的一些耗时操作 (注意:启动图不是引导图,引导图得自定义VC) 下面简单说一下如何设置启动图. 1.点击 进入 Assets.xcassets ,右键新 ...

  2. Icon+启动图尺寸

    1.LaunchImage  启动图 命名格式: 1x -> xxx.png 2x -> xxx@2x.png Retina 4 -> xxx@2x.png 转载于:https:// ...

  3. ios自动化打包 替换icon 启动图 bid appname 额外资源

    ios自动化打包脚本 下载地址https://github.com/gwh111/package 打开后自行替换 icon 启动图 bid appname 额外资源 原理:最新的脚本还是一个个替换后再 ...

  4. iOS App icon、启动页、图标规范

    下面是App Icon需要的尺寸和命名(尺寸和命名不做解释): 尺寸                                                               命名 ...

  5. iOS -- 给自己的APP加上启动图

    在开发App中很多时候,要给App加上启动图.步骤如下: ① 在工程的目录文件下找到Assets.xcassets文件,然后打开. 打开之后: ② 在添加LaunchImage这个文件 添加之后回看到 ...

  6. 如何设置App的启动图

    如何设置App的启动图,也就是Launch Image? Step1 1.点击Image.xcassets 进入图片管理,然后右击,弹出"New Launch Image" 2.如 ...

  7. iPhone所有机型启动图尺寸整理

    由于iPhone每年发布产品众多,累计起来启动图尺寸繁多,开发需要不同尺寸图片进行适配,通过官网整理如下: 6.7寸屏幕3倍图: iPhone 12 Pro Max 428x926 pt (1284x ...

  8. 怎样做一个iOS App的启动分层引导动画

    http://www.cocoachina.com/ios/20141211/10610.html 一. 为什么要写这篇文章? 这是一个很古老的话题,从两年前新浪微博开始使用多层动画制作iOS App ...

  9. 怎样做一个iOS App的启动分层引导动画?

    一. 为什么要写这篇文章? 这是一个很古老的话题,从两年前新浪微博开始使用多层动画制作iOS App的启动引导页让人眼前一亮(当然,微博是不是历史第一个这个问题值得商榷)之后,各种类型的引导页层出不穷 ...

  10. iOS11以后启动图尺寸

    iOS11以后启动图尺寸 iPhone X:1125x2436 Retina HD 5.5'':1242x2208 Retina HD 4.7'':750x1334 Retina 4:640x1136 ...

最新文章

  1. python协程异步原理_简单介绍Python的Tornado框架中的协程异步实现原理
  2. 2019清北学堂学习笔记
  3. nginx index.php 端口,nginx-如果index.php不在nginx文件夹中,则禁止使用php fpm
  4. Git内部原理之深入解析维护与数据恢复
  5. SAP CRM WebClient UI,点击Master Data工作中心后执行的JavaScript代码
  6. 环境部署(九):linux下安装python+chrome+Xvfb
  7. 活动目录组策略统一管理桌面
  8. asp建站系统源码_ASP.NET制造业进销存管理系统源码
  9. Python连接Oracle-常见问题
  10. MATLAB下载安装
  11. html5广告条滚动特效代码,js实现随屏幕滚动的带缓冲效果的右下角广告代码
  12. 微信指纹锁原理及安全性分析
  13. iOS 上架App Store 遇到的坑
  14. 一篇文章带你看遍Google I/O 2019大会
  15. 第七周 OJ总结4-求三角形面积-gyy
  16. pc模拟器运行多个Android,低配电脑如何强制开50个安卓模拟器挂机
  17. Vue Element Admin 用mock模块模拟数据
  18. Java 基础实验 找出1000以内的完数
  19. React + Ts 自定义 日历插件
  20. win10 1909版本安装不上RX560 570显卡驱动的解决办法。

热门文章

  1. java 图片压缩 base64,图片的尺寸 大小压缩 和转化为base64
  2. vue通过识别字符串中的分号进行换行
  3. mysql 平方_MYsql的数学函数
  4. Steam Deck 游戏掌机可运行 Windows
  5. html显示tif图片,呈现HTML中的TIF文件
  6. nginx的网页压缩以及图片的压缩
  7. SAN和NAS、ISCSI存储有什么区别,SAN和NAS设备哪个更好?
  8. 关于Android 启动页加载先预加载系统白页问题
  9. Node.js 环境性能监控探究
  10. 2.人工智能与机器学习的关系