torgeadelin/react-native-animated-nav-tab-bar

Floating:true not working. being styled as standard tab instead.

suraj-ingle opened this issue · 1 comments

Here's the configuration I've done for styling my bottom tab nav

 <Tabs.Navigator
            // default configuration from React Navigation
            tabBarOptions={{
                activeBackgroundColor: colors.secondary,
                activeTintColor: colors.white,
                inactiveTintColor: colors.black,
                tabStyle: {
                    bottom: keyboard.keyboardShown ? -100 : -10,
                },
                keyboardHidesTabBar: true,
                dotCornerRadius: 10,

            }}
            appearence={{
                floating: true,
                topPadding: 5,
                bottomPadding: 5,
                horizontalPadding: 5,
                dotCornerRadius: 10,
                dotSize: 'small'
            }}
            initialRouteName="Feed"
            tabBar={(props) => <FloatingTabBar {...props} />}
        >

It used to work perfectly but i had to restart my project (npx react-native init and copy paste all the js files).
I am unable to use @react-native-community/masked-view. Instead I am using @react-native-masked-view/masked-view. Wonder if that's what is causing this.

here's a screenshot of current results

Oopsy daisy.
Didn't read the doc about appearance - appearence error
Changing appearence to appearance solved my issue.
Thanks for creating such beautiful component for us devs ;D