本想给这些功能插件每个单独写一篇详细的使用教程,但感觉使用的也都是些基础功能,故在此记录下这些插件,以及对应的简单使用代码
- 渐变色组件(linear-gradient)- react-native-linear-gradient,RN没有提供官方的渐变色样式我是真没想到的,这个组件感觉就是一个带背景的View:
<LinearGradient
start={{ x: 0, y: 0 }}
end={{ x: 0, y: 1 }}
colors={['#8EA5EC', '#415DCD']}
>
<Text>Content</Text>
</LinearGradient>
- 剪切板 - @react-native-clipboard/clipboard,RN官方的clipboard弃用了,这个是社区中使用的比较多的库,使用起来也比较简单:
import { useClipboard } from '@react-native-clipboard/clipboard';
function () {
const [, setString] = useClipboard();
return <Button title='copy' onPress={() => setString('the content you want write')} />
}
- 弹出层Popover - react-native-popover-view,这是一个功能还算比较全的popover,我拿这个是实现一个tooltip;
- 相机Camera - react-native-vision-camera,这个功能就比较强大了,基本上常用的相机相关的功能都有了,社区也开发了不少插件,我主要是用这个库和vision-camera-code-scanner插件实现的扫描二维码/条形码的功能,例子建议看文档中的例子吧(注:build时会下载很多依赖,还都是GitHub的链接,注意科学上网,如果下载失败可以尝试
yarn start --reset-cache
或者cd android && ./gradlew clean
后重试); - Svg图片 - react-native-vector-image,RN的Image是不支持Svg格式的资源显示的(人都晕了),这个用起来还比较麻烦,没特殊情况还是直接用Png、jpg吧;