React Native开发跳坑之native-base自定义样式

Posted 2023-04-06

参考技术A 开发平台的搭建就不赘述了，按照网上的资料和官网的Demo都能把HelloWorld搞出来，在这里我只记录一些，花了较长时间才解决的问题。本篇文章解决的问题是在使用第三方UI插件native-base如何自己定义样式。

在使用RN时，自己写按钮啥的都太费劲，况且对于我这种从java转过来凑热闹的，根本也不会写啊。还好有一些强大的第三方组件可以用。native-base就是我给项目引入的一个UI组件，它包含几乎所有的常见控件，像Button，Icon，Badge等等。但是在使用过程就遇到需要修改默认样式的问题，网上苦苦寻找好久，最后还是在native-base官网（ https://nativebase.io/ ）找到了答案。

打开官网-点击docs-点击左侧customize可以看到问题的答案：

这样我们就可以使用对应的主题了，这时的主题是使用的刚才新生成的样式文件，你可以在里面开心地自定义样式了！是不是很简单？
阿里云优惠

native-base中icon不能正确显示[转]

初次接触native-base，在使用它的Icon组件的时候碰到了一个问题：图标没能正确显示！（在expo调试模式下是正常的）

1. native-base官网给的使用Icon的例子
2. 怎么找到适合我的图标呢？
3. github上的react-native-vector-icons，介绍了怎样在项目中使用图标

从上面的第一个链接中我们知道了Icon组件最简单的用法，如下：

从上面的第二个链接中我们知道了native-base给提供了哪些图标让我们使用。从这里我们可以看出有不止一个Icon提供者。

（例如：Entypo、EvilIcons、FontAwesome、Foundation、Ionicons等等）。

问题就在于，直接使用下面这种方式：

默认情况下，会使用“Ionicons”提供的icon。那么，如果我想使用的icon不是”Ionicons“提供的可怎么办呢？

指定”iconFamily”属性，它的值就是上面提到的icon提供者的名字。