[GUI] 앱 디자인 시 필수로 알아야 하는 디스플레이 단위(PX, DP,SP,PT)에 대해

앱 디자인을 하려고 하면 각 기기별 환경에 따라 그에 맞는 해상도의 리소스가 필요하다. 즉, 디자인을 디바이스 해상도에 알맞게 추출해야 하는데 이를 위해서는 아래 디스플레이 개념을 알아야하는 것이 필수적. 

 

 

1. PX 픽셀은 무엇인가?

- 픽셀은 이미지를 구성하는 가장 작은 단위다.

- 화면을 구성하는 최소 단위라고 할 수 있다. 

 

2. DP는 무엇인가?

- DP는 Device-Independent Pixel(혹은 Density라고도 하던데..)

- 영어 해석 그대로 DP는 기기와는 독립적으로 즉, 기기의 해상도와는 상관없이 일정한 비율로 엘리먼트를 노출시키는 단위임

- 안드로이드에서 만든 것임. 

 

3.SP는 무엇인가?

- 마찬가지로 안드로이드에서 사용하는 디스플레이 단위.

- Scale-Independent Pixel

- DP와의 차이는, SP는 앱의 시스템 설정에서 폰트 사이즈를 변경하면 같이 줄어드는 단위. 사용자가 폰트 사이즈 변경이 가능한 구조라면 SP를 사용.

 

4. PT는 무엇인가?

- PT는 ios에서 사용하는 디스플레이 단위로 Point의 준말

- 안드로이드에는 DP가 있다면 ios는 PT를 사용. 같은 개념. 

- 즉, 각기 다른 해상도의 기기에서도 내가 작업한 리소스가 동일 비율로 노출 될 수 있도록 해주는 단위임. 

- 단, ios에서의 PT는 리소스가 비율로 늘어나는게 아니라 리소스를 고정시키고 늘어나게하는 것에 따라 대응을 하는게 차이가 있음. 

 

---

 

참고자료

 

https://www.youtube.com/watch?v=cJeVVfkI9sA&list=PL2XQ8H8IpiCZ9_k-Hw6Xj_I9ns4f6LZS4 

https://youtu.be/TqJm2TM9JnA

https://brunch.co.kr/@zalhanilll/407#comment

디스플레이 단위(PX, DP, SP, PT) 알아보기