反应原生 - 宽度和高度

Question

我有一个关于反应原生的宽度和高度的问题。我在自己的设备（huawei p9 plus）中设置宽度高度为50的View，看起来没问题。然后我换到更大的设备（huawei mate9），View变得更大。我只是想知道这是正常的吗？或者有一些设置可以让所有设备具有相同的外观。 非常感谢。

Answer 1

如果要在所有设备中使用相同的Outlook，则必须提供高度和宽度的百分比值。首先，您必须在文件中导入Dimensions

import { Dimensions } from "react-native";

之后定义 deviceWidth 和 deviceHeight ，

var deviceWidth = Dimensions.get("window").width;
var deviceHeight = Dimensions.get("window").height;

然后您将 deviceHeight 和 deviceWidth 用于高度和宽度，如下所示，

width : deviceWidth * percentageYouWant / 100

这里＆＃39;百分比你想要＆＃39;是设备宽度的百分比。那么你使用的设备将从该设备获得宽度。

Answer 2

对于所有设备中的相同前景，您必须提供高度和宽度的百分比值。例如，首先在文件中导入尺寸

从＆＃34; react-native＆＃34;;

导入{Dimensions}

之后define **deviceWidth** and **deviceHeight**,

var deviceWidth = Dimensions.get("window").width;
 var deviceHeight = Dimensions.get("window").height;

然后以相应的方式将视图传递给视图，因为它会自动获取设备的宽度和高度并调整视图。 您还可以通过将公式应用到自定义视图（大小变化）中来使用此变量。 例如，在样式中，您可以将宽度传递为：

width: deviceWidth/2;

以上例如。将自动取出deviceWidth的半宽

Answer 3

这是完全正常的，因为它在official documentation＆＃34中进行了解释;本机中的所有维度都是无单位的并且代表与密度无关的像素＆＃34;，因此不同的设备具有不同的大小和不同的DPI将呈现不同的方式。 如果您想要相同的外观，您可以使用flex或百分比，如上所述