더북(TheBook)

예를 들어, iPhone 11 Pro의 화면 해상도는 2436px × 1125px이고, 화면 밀도는 458ppi입니다.

▲ 그림 3-21 화면 밀도 ppi

ppi(pixel per inch)란 1inch에 몇 px이 들어갈 수 있는지를 의미하는 밀도 단위입니다. 이는 dpi(dots per inch)와 비슷한 개념입니다(ppi는 디스플레이에서 사용하는 단위이고, dpi는 인쇄물에서 사용하는 단위입니다).

리액트 네이티브에서 스타일링할 때 크기는 모두 dp로 설정합니다. dp(density-independent pixel)란 1인치당 픽셀 밀도에 따라 크기가 일관된 UI를 보여줄 수 있는 단위입니다.

dp와 px을 변환하는 계산 방법은 다음과 같습니다.

dp = px * 160 / ppi

px = dp * ppi / 160

만약 iPhone 11 Pro에서 너비 200의 사이즈에 선명한 이미지를 보여주려면 200 * 458 / 160 = 572.5px의 너비를 가진 이미지를 사용해야 합니다. 따라서 이 크기와 가장 비슷한 @3x 이미지를 사용해야 선명하게 보여줄 수 있습니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.