react-native - 如何为react-native-elements元素指定默认颜色？

Question

现在，我正在为我的应用程序使用 react-native-elements 组件库。具体来说，我使用的是它们的Button组件，该组件已应用了默认的灰色。



如何为这些按钮设置自定义默认颜色，而不必每次都传递样式 Prop ？

有没有我可以调用的简单函数/方法，还是我必须研究创建一个自定义组件来包装它？我更喜欢前者。

Answer 1

我知道这是一个老问题，但是自从我找到了这篇文章以来，我将在这里留下这个答案供其他人查看。

从Oct 2018开始，react-native-elements支持主题。按照documentation，您可以在RN应用程序中使用主题提供程序，并通过执行以下操作来覆盖库的默认颜色:

import { ThemeProvider } from 'react-native-elements';

const theme = {
  colors: {
    primary: 'pink',
  }
}

....
....

render(){
  ...
  return(
      <ThemeProvider theme={theme} >
         <App/>
      </ThemeProvider>
   )
}

上面的示例将更改所有组件的原色。通过应用相同的逻辑，您可以仅更改按钮元素的背景颜色。您还可以将主题设置用于其他自定义，例如默认组件属性等。有关更多信息，请查看文档