iOS移动开发1x 、2x 、3x图片介绍

1x 、2x 、3x图片介绍

手机屏幕分两种

  1. 视网膜屏:
    • 又叫Retain屏幕,就是高清视网膜屏幕,分辨率宽高是标准屏幕分辨率的2倍
  2. 非视网膜屏
    • 又叫非Retain屏,是标准分辨率

分辨率

  • 概念:分辨率的意思就是把屏幕进行横向、纵向等分,通常描述手机屏幕用来表示,在retina屏幕下,一个点表示两个像素,在非retina屏幕下,一个点表示一个像素,而像素,就是常说的分辨率,在iPhone6 Plus下,一个点表示3个像素

iPhone手机的分辨率


  • 在上图可以看出
    1. iPhone3GS的手机,是非视网膜屏幕,它的点 和 分辨率 是相同的,也就是两者相除 得 1
    2. 在iphone4/4S/5/5C//5S/6,它们都是视网膜屏幕,分辨率正好是点的两倍,相除得2
    3. 而在iPhone6 Plus,虽然也是视网膜屏幕,但是分辨率是点的三倍,也就是相除得3

1x 2x 3x 图片

  • 由于不同手机的屏幕的分辨率和它的点的倍数,是不同的,所以我们在实际开发中需要准备多套图片
  • 由于目前只存在1倍,2倍,3倍,这几种,所以目前准备的图片就分 1x,2x,3x图,当然由于只有3GS手机才是1x图,而3GS手机,基本上已经无人使用,可能很多公司已经不再去制作1x图片

图片的命名规则:

  • 1x图片: 直接使用文件名 btn_left.png
  • 2x图片: 在文件名后加上@2x标识 btn_left@2x.png
  • 3x图片: 在文件后加上@3x标识 btn_left@3x.png

总结

  1. 在同样一个尺寸的屏幕下由于使用的屏幕不一样(retina和非retina),所以造成的屏幕分辨率会不同.也就是说,同样是30*30的像素,在3.5 inch大小的屏幕上,如果是非retina显示会大一些,retina屏幕显示会小一些。
  2. 在开发中使用的是点.(比如 30 * 30 ,不是表示30像素,而是表示30点,这样的话iOS系统会自动把点转换为对应的像素)
    • 非retina屏幕1个点表示1像素
    • retian屏幕1个点表示2像素
    • iPhone6 Plus 下1个点表示3像素
  3. 因为程序中的是,iOS系统会自动把点转换为不同的像素去找图片,所以图片对应的也要准备多份不同的图片,
    • @2X:视网膜屏幕,在原来点坐标的大小上乘以2
    • @3X:在原来的坐标的大小上乘以3
发布了22 篇原创文章 · 获赞 9 · 访问量 13万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 编程工作室 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览