jasongaare / react-native-walkthrough-tooltip

An inline wrapper for calling out React Native components via tooltip
MIT License
610 stars 182 forks source link

Showing tooltip changes the navigation bar color #157

Closed anti-duhring closed 2 years ago

anti-duhring commented 2 years ago

I'm using the react-native-navigation-bar-color package to change the navigation bar color, but when I show the tooltip the navigation bar returns his color to the default color.

Before: image

After: image

I've tried to set useReactNativeModal to false, but despite it no longer change the navigation bar color, the tooltip also no longer appears.

My tooltip component:

    const TooltipMessage = ({children, message,position, style}) => (
        <Tooltip
            isVisible={showTip}
            content={
                   <View>
                     <Text> {message} </Text>
                   </View>
            }
            onClose={() => setTip(false)}
            placement={position}
            backgroundColor='rgba(0,0,0,0)'
            contentStyle={style}
        >
            {children}
        </Tooltip>
    )
anti-duhring commented 2 years ago

Update:

Solve it by setting the FullscreenDialog style inside android/app/src/main/res/values/style.xml:

  <style name="Theme.FullScreenDialog">
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowIsFloating">false</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="android:navigationBarColor">@android:color/transparent</item>
  </style>

image