如何将@2x @3x 图像集成到 React Native 项目（Android 和 IOS）？

Question

我已将相同图像的版本 (@2x @3x) 添加到 src>assets 以在所有设备上运行我们的平台。问题来了，VSCode 只识别 ie path.png（它不识别 @2x 和 @3x）。我们如何处理这个问题？

Answer 1

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 官方文档中图像的更多信息。

我希望这会有所帮助....谢谢:)