React-native-navigation: Can't change badgeColor for bottomTab on iOS (v6.5.0)

Created on 4 May 2020  Â·  5Comments  Â·  Source: wix/react-native-navigation

Issue Description

In RNN 6.5.0 badge color is not changing on iOS. Works fine on Android.

I've tried different ways to set badge color:
1) with mergeOptions:

Navigation.mergeOptions('Tab.Inbox', {
    bottomTab: {
        badge: newMessagesCount ? String(newMessagesCount) : '',
        badgeColor: colors.pink
    }
});

2) with setDefaultOptions:

Navigation.setDefaultOptions({
    bottomTab: {
     badgeColor: colors.pink,
    }
});

3) setting color directly in the bottomTabs children:

{
    stack: {
    id: 'Tab.Inbox',
    children: [{
        component: {
        id: 'Inbox.Main',
        name: Screens.Inbox,
        }
    }],
    options: {
        bottomTab: {
        icon: IMG_INBOX,
        text: 'Inbox',
        iconColor: colors.grayBlue,
        textColor: colors.grayBlue,
        selectedIconColor: colors.orange,
        selectedTextColor: colors.orange,
        fontFamily: FONT_OPENSANS_BOLD,
        badgeColor: colors.pink,
        }
    }
    }
},

But none of these ways worked and badge is always displayed with default orange color:
iPhone 11 — 13 2 2 2020-05-04 18-34-50
Compare to Android:
httpsmonosnap comdirectfbAfLRdFgalk5B5njoqdmdOLa9WIFg 2020-05-04 18-58-15

Note: If RNN is downgraded to 6.0.0 everything works fine on both platforms.


Environment

  • React Native Navigation version: 6.5.0
  • React Native version: 0.61.5
  • Platform(s) (iOS, Android, or both?): iOS
  • Device info (Simulator/Device? OS version? Debug/Release?): iOS Simulator 13.2.2 Debug and Release
iOS acceptebug 📌 pinned

Most helpful comment

Fixed in #6246

All 5 comments

We have the same issue (
Can somebody take a look on this please?
@guyca

@yogevbd Do you have any ETA for this issue?

Fixed in #6246

Please reopen this issue. After upgrading to latest (6.7.5), badgeColor cannot be changed. Prior to upgrade it worked fine. Please help.

@yond The fix in #6246 is working fine, but as I see it wasn't yet released for some reason.
It was mentioned in bug fixes list for v6.7.5 (https://github.com/wix/react-native-navigation/releases/tag/6.7.5) but I can't see these changes in the latest version (https://github.com/wix/react-native-navigation/compare/6.5.0...6.7.5)

@yogevbd @guyca Could somebody please take a look at this?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

viper4595 picture viper4595  Â·  3Comments

yayanartha picture yayanartha  Â·  3Comments

switchtrue picture switchtrue  Â·  3Comments

kiroukou picture kiroukou  Â·  3Comments

zhanguangao picture zhanguangao  Â·  3Comments