iOS设计规范(iPhone|iOS设计规范(iPhone 12ProMax更新)
1、iPhone 各型号分辨率和设计尺寸
(设备按照渲染像素和设计大小进行归类,仅供参考)
设备 | 渲染像素 | 屏幕设计大小 | 状态栏高度 | 导航栏高度 | 底部Tabar高度 | 倍图 |
---|---|---|---|---|---|---|
iPhone4/4s | 640x960 | 320x480 | 20px | 44px | 49px | @2x |
iPhone5/5c/5s/SE | 640x1136 | 320x568 | 20px | 44px | 49px | @2x |
iPhone6/6s/7/8/SE2 | 750x1334 | 375x667 | 20px | 44px | 49px | @2x |
iPhone6p/6sp/7p/8p | 1242x2208 | 414x736 | 20px | 44px | 49px | @3x |
iPhone X/Xs/11Pro/12mini | 1125x2436 | 375x812 | 40px | 44px | 49px | @3x |
iPhone 11/XR/11Pro Max | 1242x2688 | 414x896 | 40px | 40px | 49px | @3x |
iPhone 12/12Pro | 1170x2532 | 390x844 | 40px | 44px | 49px | @3x |
iPhone 12Pro Max | 1284x2778 | 428x926 | 40px | 44px | 49px | @3x |
文章图片
Xnip2021-06-11_09-48-54.png 2、系统Icon iPhone系统图标有通知、设置、搜索、App应用、商店图标几种类型,不同系统、不同分辨率大小需要适配对应大小的icon。
注:发布iPhoneX之后iOS系统更新到了11,开始忽略对iOS5、6的图标兼容。
Icon类型 | iOS系统 | @1x | @2x | @3x |
---|---|---|---|---|
应用图标 | iOS7-14 | -- | 120x120 | 180x180 |
设置图标 | iOS7-14 | -- | 58x58 | 87x87 |
Spotlights搜索结果图标 | iOS7-14 | -- | 80x80 | 120x120 |
通知图标 | iOS7-10 | -- | 40x40 | 60x60 |
App商店图标 | iOS | 1024x1024 | -- | -- |
文章图片
3、LanuchImage(启动图)
注:iOS系统更新到11后LanuchImage比之前多了横屏启动图竖屏启动图对应关系如下:
对应机型 | 启动图大小 | 倍图 | 类型 |
---|---|---|---|
iPhone4/4s | 640×960 | @2x | 竖屏 |
iPhone5/5s/5c | 640×1136 | @2x | 竖屏 |
iPhone6/7/8 | 750×1334 | @2x | 竖屏 |
iPhone6 plus/7 plus/8 plus | 1242×2208 | @3x | 竖屏 |
iPhoneX/Xs | 1125x2436 | @3x | 竖屏 |
iPhoneXs Max/11/11Pro Max | 1242x2688 | @3x | 竖屏 |
iPhoneXR | 828x1792 | @2x | 竖屏 |
文章图片
【iOS设计规范(iPhone|iOS设计规范(iPhone 12ProMax更新)】会持续更新最新的iOS设计规范,如有问题欢迎指正!
推荐阅读
- PMSJ寻平面设计师之现代(Hyundai)
- 基于微信小程序带后端ssm接口小区物业管理平台设计
- 2020-04-07vue中Axios的封装和API接口的管理
- 标签、语法规范、内联框架、超链接、CSS的编写位置、CSS语法、开发工具、块和内联、常用选择器、后代元素选择器、伪类、伪元素。
- 爱琐搭配(喜欢复古、冷淡,像这种双环设计的气质耳环)
- iOS中的Block
- 别墅庭院设计,不同的别墅庭院设计也给人视觉上完全不一样的!
- 记录iOS生成分享图片的一些问题,根据UIView生成固定尺寸的分享图片
- 数据库设计与优化
- 2019-08-29|2019-08-29 iOS13适配那点事