如何将@2x和@3x图片集成到React Native项目中（适用于Android和IOS）？

Question

15

我将同一张图片的不同版本(@2x和@3x)添加到了src>assets中，以便在所有设备上使用我们的平台。问题在于，VSCode只识别路径为path.png的图片（它无法识别@2x和@3x）。我们该如何解决这个问题？

- chc

1

但是在移动应用中为什么需要相同图像的3种分辨率呢？ - Gaurav Roy

1

由于每个手机的分辨率不同。https://facebook.github.io/react-native/docs/pixelratio - chc

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- abhikumar22 · Accepted Answer

React Native会自动从可用的3个选项中选择所需的图像，即1x，2x，3x。我们只需要为基本图像提供文件名即可。

示例

.
├── button.js
└── img
    ├── check.png
    ├── check@2x.png
    └── check@3x.png

如上所述，当您需要使用支票图像时，请只提供check.png的图像路径，其余部分将由React Native自动处理适用于Android和iOS设备的屏幕密度。
像下面这样使用该图像，一切都将顺利进行。

<Image source={require('./img/check.png')} />

关于React Native官方文档中有关图片的更多信息，您可以在这里阅读。

希望这可以帮到您....谢谢：）