react native 屏幕尺寸转换

设计图的尺寸:

一般UI设计原型基于iphone6,

分辨率:1334 x 750,

屏幕尺寸: 4.7英寸

计算公式:

dpi = ppi = √ (屏幕长^2 + 屏幕宽^2) / 屏幕尺寸

px = dp*(ppi/160)

demsity = dpi / 160

根据公式计算可得:

dpi =  ppi = √ (1334^2 + 750^2) / 4.7 =  326dpi (约等于320dpi)

demsity = 320/160 = 2;

1dp = 2px

iphone6 全屏的dp值:667 x 375

====================

以宽为标准:

const width = Dimensions.get("window").width;
const ratio = width / 375;

转换为px

export const fitPx = _px => {
  return Math.floor(ratio * (_px / 2));
};

转换为dp

export const fixPt = _pt => {
  return width * (_pt / 375);
};

  

 

posted @ 2020-04-29 15:03  Ayinger  阅读(427)  评论(0编辑  收藏  举报