reactjs - 缩放问题导致 react-native 应用程序的外观不一致

Question

react-native 的新手。我得到了一个参考 iPhone 6 的设计原型。因此，当我查看 320*50px 的视图时，它看起来与原型完全一样，但在 iPhone 5s 上它看起来太大且不一致。图像的类似问题。我需要做些什么考虑才能使图像、字体和设计（如果不是像素完美的话）但至少在多个设备上看起来一致。

Answer 1

我所做的是编写一个可扩展的文件

    'use strict';

let React = require('react-native')
    , Dimensions = React.Dimensions || require('Dimensions')
    , {width, height} = Dimensions.get('window');

let units = {
    vw: Math.min(width, height)/100
    , vh: Math.max(width, height)/100
};

units.vmin = Math.min(units.vw, units.vh);
units.vmax = Math.max(units.vw, units.vh);
units.wid=width;
units.hei=height;
module.exports = units;

然后我在需要时导入它

Text: {
        width: 60 * vw,
        fontSize: vw * 4,
        color: 'black',
        fontFamily: 'B Yekan',
        height: vh * 7,

    },

但不建议设置尺寸最好不
要这样做，你会在 iphone、ipad、android 手机和 android 平板电脑上看起来几乎一样的设计