px:设备实际像素单位
dp/pt:逻辑像素单位(IOS的尺寸单位为pt,Android的尺寸单位为dp)
在设计和开发过程中,应该尽量使用逻辑像素尺寸来思考界面。
UI 给默认 640 的图,采用 pxToDp 函数,即可将 UI 等比放大到机器上。
import {Dimensions} from 'react-native';// 58 app 只有竖屏模式,所以可以只获取一次 width const deviceWidthDp = Dimensions.get('window').width; // UI 默认给图是 640 const uiWidthPx = 640; function pxToDp(uiElementPx) { return uiElementPx * deviceWidthDp / uiWidthPx; } export default pxToDp;
调用方法
import pxToDp from './pxToDp';...... 参考网址: