图标颜色在本机基础 header 按钮中不起作用

Question

我正在使用 NativeBase Header。在 header 中，我有购物车和心愿单等按钮。但是我不能改变那个图标的颜色。

这是我的 header 代码：

<Header>
  <Left>
    <Button transparent onPress={props.onMenuPress}>
      <Icon type="Ionicons" name="menu" color="#ff0000" />
    </Button>
  </Left>
  <Body>
    <Title>{props.title}</Title>
  </Body>
  <Right>
    <Button transparent onPress={props.onWishlistPress}>
      <Icon name="heart" active={false} color="#ff0000" />
    </Button>
    <Button transparent onPress={props.onCartPress} icon>
      <Icon name="cart" active={false} color="#ff0000" />
    </Button>
  </Right>
</Header>

谁能告诉我这是什么问题？

Answer 1

它显示在 Native-base 文档中。对于 Icon，Native-base 使用 React-native-vector-icons 模块，它允许您通过 style.

设置 colors 和 sizes

图标

完美、清晰、高清图标和像素理想字体由 NativeBase 提供支持，以保持非常高的一流水平。您将不断地在您的计划中拥有像素完美的图标。这是一个列出可用 react-native-vector-icons 图标系列图标的存储库。回购

使用来自 React Native 矢量图标的 Ionicons

例子

 <Icon name='home' />
 <Icon ios='ios-menu' android="md-menu" style={{fontSize: 20, color: 'red'}}/>
 <Icon type="FontAwesome" name="home" />

图标颜色在本机基础 header 按钮中不起作用

Icon color not working in native base header buttons

react-native

native-base

图标

例子