[iOS - swift] xcassets(1x, 2x, 3x), pt, retina 그래픽 단위

Pixel

• = px
• 이미지를 이루는 가장 작은 단위의 사각형 모양의 점 (= 그림picture + 원소element, 화소)
  - FHD 해상도: 1080 x 1920 = 픽셀의 갯수가 1080 x 1920개 존재
  - ppi: pixel per inch (72ppi = 1인치에 72개의 픽셀이 존재)
  - dpi: dot per inch: 1인치당 점의 갯수 (주로 인쇄물에서 사용되는 단위, 요즘은 ppi와 동일어처럼 사용)

Mac, Microsoft에서의 1inch의 단위

• Microsoft에서는 1inch = 96dpi를 사용
  - 컴퓨터 스크린은 책이나 문서를 읽을 때의 거리보다 4/3배 더 멀리 떨어져 있다고 판단
  - 해상도도 4/3배하여 72ppi의 모니터에서 글씨를 키워서 가독성을 높이려는 의도
• Mac에서는 1inch = 72dpi를 사용 Pixel단위

Point

• = pt
• Window: 1pt ≒ 0.4702 (1pt / 96ppi)
• Mac: 1pt ≒ 0.3527mm (1pt / 72ppi)

Retina Display

• 300 PPI가 넘을경우 사람의 눈으로 보이지 않을 수준의 고밀도 디스플레이므로, apple에서 Retina로 마케팅
  - apple은 iPad, Mac에 적용되면서 기준을 300PPI에서 260PPI로 변경
• iPhone 4: Retina Display를 위해서 PPI를 높이는 방향으로 단위 변경: 1 point = 4 pixel

xcassets(1x, 2x, 3x)

• 애플에서 retina디스플레이를 목적으로 ppi를 높일때, 개발의 편의성을 위하여 xcassets폴더에 정의
  - constrant를 줄 경우 모든 단위는 pt단위로 정의되어 있으며 개발자는 pt단위 하나만 신경쓰며 개발에 편의를 주기 위함
• 1x: 1pt = 상수 * 1px
• 2x: 1pt = 상수 * 2px
• 3x: 1pt = 상수 * 9px

 

 

cf) iOS 12+에서 호환되는 기기는 iPhone4이상의 아이폰에서는 모두 Retina 디스플레이므로 1x 이미지는 필요 x

 

* 참고

spoqa.github.io/2012/07/06/pixel-and-point.html

namu.wiki/w/Retina%20디스플레이?from=레티나%20디스플레이

support.apple.com/ko-kr/HT202471

blank2.tistory.com/3

namu.wiki/w/DPI

medium.com/@jang.wangsu/ios-ios-10-11-12-13에서-호환되는-기기-cc2a65ca577e
developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/image-size-and-resolution/