Flutter 에서 사용 되는 Size의 단위

 

 

플러터에서 사이즈를 사용하다보면 아래와 같이 어떤 단위도 없는 숫자만 입력하게 된다. 

SizedBox(
height : 10,
width : 10 
)

 

 

그렇다면 ? 여기서 저 숫자의 단위는 무엇일까 

 

우선 보통 안드로이드에서는 dp 라는 단위를, ios 에서는 pt 라는 단위를 사용한다. 

What is unit of measurement in flutter

 

스택오버플로우 사람들의 답변에 의하면, 플러터는 Logical Pixels (논리 픽셀)을 사용한다고 한다. 

 

아래는 장치픽셀과 논리픽셀이 무엇인지 정리 한 글이다. 

장치픽셀(Device Pixel)과 논리픽셀(Logical Pixel)

 

 

논리픽셀은 화면의 물리적 크기나 해상도와 상관없이 동일한 크기를 유지한다. flutter는 논리 픽셀을 사용하여 화면의 레이아웃을 정의한다. 프레임워크가 장치의 해상도를 감지하고, 논리 픽셀을 실제 장치 픽셀로 변환하여 화면에 그린다. 이로 인해 앱은 다양한 해상도의 기기에서 동일하게 보이게 되는것이다. 

 

스택오버플로의 한 슨배륌이 남겨준 예시인데 하나하나 살펴보자. 

 

 

 

 

devicePixelRatio 가 2인 장치에서 SizeedBox 위젯을 사용하려고 할때, devicePixelRatio는 장치 픽셀 비율을 나타내며, 이는 각 논리 픽셀에 대해 몇 개의 물리적 픽셀이 사용되는지를 의미한다.( (devicePixelRatio가 2라는 것은 1 논리 픽셀이 2개의 장치 픽셀에 해당) 

 

이 코드는 높이가 10 논리 픽셀(dp)인 SizedBox를 생성하고, devicePixelRatio가 2인 장치에서 10 논리 픽셀은 10 * 2 = 20 장치 픽셀이 된다. 따라서, 이 SizedBox는 해당 장치에서 20 장치 픽셀 높이로 그려지게 된다!