Question

在主题中，我想知道React Native现在是否可以选择将非活动TabBar图标的颜色从默认灰色更改为自定义颜色？使用或不使用react-native-vector-icons

Answer 1

我找到了解决方案，但您的图标应处于“非活动”颜色。要实现此目的，请转到RTCTabBarItem.m并更改方法setIcon中的第一行：

- (void)setIcon:(UIImage *)icon
{
  _icon = [icon imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
  if (_icon && _systemIcon != NSNotFound) {
    _systemIcon = NSNotFound;
    UITabBarItem *oldItem = _barItem;
    _barItem = [UITabBarItem new];
    _barItem.title = oldItem.title;
    _barItem.imageInsets = oldItem.imageInsets;
    _barItem.selectedImage = oldItem.selectedImage;
    _barItem.badgeValue = oldItem.badgeValue;
  }
  self.barItem.image = _icon;
}

然后在所有TabBarIOS.Item中添加字段selectedIcon，其中包含与icon中相同的URL（无所谓），将TabBarIOS的tintColor设置为“活动”颜色，这就是全部！ TabBar将以默认图标颜色（非活动）呈现，活动图标将显示在tintColor中。我认为TabBar字段renderAsOriginal应该这样做，但它不起作用。毕竟我在github上发现了这个解决方案https://github.com/facebook/react-native/issues/3083

另一种解决方案（在某些情况下可能不起作用）：

查找文件RCTTabBar.m（cmd + shift + f）
找到- (instancetype)initWithFrame:(CGRect)frame
在return self之前添加：

[[UIView appearanceWhenContainedIn: [UITabBar class], nil] setTintColor: [UIColor redColor]];
[[UITabBar appearance] setSelectedImageTintColor: [UIColor greenColor]];

重启模拟器/设备

代码redColor是非活动按钮的颜色，greenColor是活动按钮的颜色。有关详细信息，请查看此Unselected UITabBar color?

编辑：如果您想将RGB转换为UIColor http://uicolor.xyz/

是否可以在React Native中更改非活动的TabBarIOS图标颜色？

1 个答案: