react native 螢幕尺寸轉換

2022-07-20 17:30:17 字數 603 閱讀 8302

設計圖的尺寸:

一般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 =>;

轉換為dp

export const fixpt = _pt => ;

React Native螢幕尺寸適配

現在的手機品牌和型號越來越多,導致我們平時寫布局的時候會在個不同的移動裝置上顯示的效果不同,比如我們的設計稿乙個view的大小是300,如果直接寫300,可能在當前裝置顯示正常,但到了其他裝置可能就會偏小或者偏大,這就需要我們對螢幕進行適配。安卓原生的話有自己的適配規則,可以根據不同的尺寸建立不同的...

react native獲取螢幕尺寸

專案中需要獲取手機的尺寸 import from react native var window dimensions.get window var width window.width var height window.height var scale window.scale 其中 width...

手機 螢幕尺寸

手機螢幕尺寸分為物理尺寸和顯示解析度兩個概念。物理尺寸是指螢幕的實際大小。大的螢幕同時必須要配備高解析度,也就是在這個尺寸下可以顯示多少個畫素,顯示的畫素越多,可以表現的餘地自然越大。兩台手機的螢幕大小差不多大,卻乙個只能顯示兩行漢字,另乙個則可以顯示五行漢字,拋開字型大小差別,關鍵就是螢幕的解析度...