移动APP切图术语解读:什么是@1x @2x和@3x
现在很多APP设计师小白都会稀里糊涂的在解读这些缩放1倍,扩大2倍或者说扩大1.5倍 等等之类的言论。
大家谈论的却是也没有错。如果你搭配上@1x @2x和@3x的话,你的理解就有问题啦!
首先我们看下我们切图的命名方式:
假设有两张图片名为:正确的命名方式应该是这样test_t@2x.png 、test_t@3x.png
这是对于ios 切图来说的。
iphone 4 5 6是采用test_t@2x.png 这个图,iphone 6 plus就采用test_t@3x.png
但是对于iphone加载的顺序是
在ipone4 ipone5 s、iphone6和iphone6 plus都是不需要带上@2x/@3x的图片后缀名,程序会优先加载 @2x 的图片 ,但如果需要加载 @3x 的图片,你需要写上 @3x ; 这个是IOS客户端做的,但是作为APP设计师必须了解。
第一个:为解决ios分辨率而生
之所以有@1x @2x和@3x的出现,也是苹果为了便于程序员的开发,不同分辨率的设备开发时统一为一个尺寸。例如iPad2 是768 x 1024,iPad Retina 是1536 x 2048,开发时都按 768 * 1024 操作。但实际上两者有一倍差异。为了达到最佳效果,使用的图片大小不一样。这时候就用同一个名称,但 Retina 的图加上 @2x 后缀。系统加载图片时,在 iPad2 上会加载 @1x 的图在 1536 * 2048 的设备上,会加载 @2x 的。@3x 现在用于 iPhone 6/6+ 上。
第二个:@1x @2x和@3x也是xcode软件所需要的UI资源。你命好名称以后,ios会根据设备型号自动挑选合适的@1x,@2x或@3x尺寸来使用。
第三个:mac电脑上的APP设计软件Sketch,他切图之后保存的图片格式也是带有@1x @2x和@3x。 在这里 可以解毒@1x @2x和@3x为图片格式,成为图片后缀名。跟我们安卓上的.9.png 类似的。
第四个:苹果IOS程序开发不同分辨率的设备统一为一个尺寸而标记的。@3X就是@1X分辨率的3倍。@3x也是倍数的解读。
所以,在这里 安卓到底有没有这样的@1x @2x和@3x的格式呢。25学堂的小编认为,肯定没有,@1x @2x和@3x严格来说是苹果公司的专利。
适合安卓的切图命名规范最好的是.9.png图,当然目前.9.png应用在ios上也很多。
附带一提:iOS8渲染操作中使用前缀带有@1x、@2x 和@3x 的测试图像,代码会优先载入3x 图像。@2x图像不被加载。
移动APP切图术语解读:什么是@1x @2x和@3x相关推荐
- 移动APP切图术语解读:什么是@1x @2x和@3x【转自25学堂】
现在很多APP设计师小白都会稀里糊涂的在解读这些缩放1倍,扩大2倍或者说扩大1.5倍 等等之类的言论. 大家谈论的却是也没有错.如果你搭配上@1x @2x和@3x的话,你的理解就有问题啦! 首先我们看 ...
- iOS app 切图
iOS 切图尺寸规则 目前iPhone有10种型号,5种屏幕尺寸,再加上6plus的"降采样"(Downsampling)(1080-1920),还有iPhone6和6+上的放大模 ...
- 原生App切图的那些事儿
如何切图? 了解iphone界面的尺寸 最小的分辨率是320x480,我们把这个尺寸定为基准界面尺寸(baseline),基准尺寸所用的图标定为1倍图(1x). 在实际设计过程中,为了降低设计成本,一 ...
- app android切图工具,2018最强手机APP切图规范指南和切片要求
关于手机APP切图的干货,25学堂已经分享了很多,但是不是很全面,同时也没有把一些APP切图需要注意点分享给大家,于是,学堂君想在今天把前辈切片的经验分享出来. 之前25学堂分享的APP切图干货: 如 ...
- 切图教程,app切图命名总结
再根据自己的习惯对APP切图命名进行整理总结. 结语: 作为一个有强迫症的设计师,希望产出是有缜密的思维逻辑,当然包括细节. 文字有的部分参考其它文章,整理后根据自己的工作经验作出的总结. 自己也还在 ...
- android ui 切图工具,APP切图标注教程:UI设计切图标注的小工具实用技巧
分享关于一篇UI设计师必须要懂的切图标注的小工具实用技巧,让你在跟开发工程师协作的时候更加得心应手. 设计师必备的UI切图小工具如下3大常用工具: 1.切图工具 Assistor PS 也是一款PS的 ...
- android app ui如何切图,APP切图详细规范终极指南
我们都知道一套完整的 App 通常会有很多张切图,不管是 iPhone 需要 1x.2x.3x 图档,Android 需要至少 3 种 hdpi.xhdpi.xxhdpi.在庞大的切图数量下如何让负责 ...
- APP切图详细规范终极指南
[注]文章来自逍遥乐 我们都知道一套完整的 App 通常会有很多张切图,不管是 iPhone 需要 1x.2x.3x 图档,Android 需要至少 3 种 hdpi.xhdpi.xxhdpi.在庞大 ...
- 手机App切图命名规则
规范的命名方式可以提高客户端程序员的开发效率和团队协作. 尽可能的用最少的字符而又能完整的表达标识符的含义 只能包含小写字母.数字.下滑线,且数字.下划线不能首位 切图格式为png格式 启动界面命名规 ...
- android与ios ui切图关系,APP-IOS与Android界面设计与切图
做一全套的APP设计,流程是: 1.界面设计:设计IOS界面:设计Android界面. 2.切图:切IOS的2倍图和3倍图:切Android的hdpi,xhdpi,xxhdpi这三个尺寸的图. 3.标 ...
最新文章
- linux下性能分析命令[总结]
- 使用node来搭建简单的后台业务
- Java HashMap的死循环问题
- Mac OS 在远程主机(Linux 系统)上使用命令执行 sql 脚本文件(使用的是 MySQL 数据库)
- 重复订单号校验_吊打面试官系列重复消费、顺序消费、分布式事务
- CF1040D Subway Pursuit
- 苹果手机各种尺寸详细表苹果X、苹果XS、苹果XR、苹果XSMax、苹果11、苹果11 Pro、苹果 11 Pro Max 、苹果12、苹果12mini、苹果 12 Pro Max、苹果12pro 尺寸
- 网站APP信息以及用户数据泄露排查方案
- python爬取下厨房网站首页图片request+bs4
- Windows 静态库函数名称问题
- 智慧公交可视化大屏决策管理系统改善城市交通
- 接口测试方法论——WebSocket一点通
- 史上最全面的苏州工业园区虚拟住房补贴申请攻略
- linux设置rtc默认时间,RTCTime 设置和使用 详解
- 关于蓝屏错误IRQL_NOT_LESS_OR_EQUAL
- VS2019 + OpenVINO 初体验
- leelen可视对讲怎么接线_无线可视对讲门铃怎么样 无线可视对讲门铃性能特点【详解】...
- qt夜神android,夜神安卓模拟器命令行整理贴
- Windows下设置任意窗口总在最前面不被遮挡的方法
- AIR 028 | 南京大学LAMDA所长周志华:机器学习的现状与未来
热门文章
- 假币问题 (n枚硬币+未知轻重+DFS)
- 联想g400从u盘启动计算机,【联想G40怎么从U盘启动】联想g40怎么设置u启动_联想g40从u盘启动...
- STL CSB 11.10
- 互联网行业的众生相,不向命运低头的“英雄主义”
- 远程车控怎么玩?来,我教你..
- Android Compose 实现渐变背景色
- C/C++学习笔记(2020.11---2021.5)
- Matlab数学建模学习报告(一)
- dw读取access中的图片_DreamWeaver入门必看:ACCESS数据库(三)
- 大话西游2服务器修改,大话西游2:9.17维护解读:五倍次数修改全服上线,灵兽村要变样啦...