其他分享
首页 > 其他分享> > react-native设计之使用图片

react-native设计之使用图片

作者:互联网

文档:https://reactnative.cn/docs/images

 

1.静态图片

 

React Native 提供了一个统一的方式来管理 iOS 和 Android 应用中的图片。要往 App 中添加一个静态图片,只需把图片文件放在代码文件夹中某处,然后像下面这样去引用它:

<Image source={require('./my-icon.png')} />

 

图片文件的查找会和 JS 模块的查找方式一样。如果你有my-icon.ios.pngmy-icon.android.png,Packager 就会根据平台而选择不同的文件。

 

你还可以使用@2x@3x这样的文件名后缀,来为不同的屏幕精度提供图片。比如下面这样的代码结构:

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

并且button.js里有这样的代码:

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

标签:3x,2x,react,native,图片,check,png,icon
来源: https://blog.csdn.net/qq_27868061/article/details/115435160