1.0.2 • Published 3 years ago
rn-shiny-tab-bar v1.0.2
rn-shiny-tab-bar
Custom animated shiny-tab-bar for react-native.

💾 Installation
yarn add rn-shiny-tab-baror
npm install rn-shiny-tab-bar⚒️ Usage
<Tab.Navigator
  tabBar={(props) => {
    return <ShinyTabBar {...props} />;
  }}
>
  <Tab.Screen
    name="Dashboard"
    component={TestScreen}
    options={{
      tabBarIcon: <SimpleLineIcons name="grid" size={20}></SimpleLineIcons>,
      tabBarBackground: "rgb(2 179 189)",
    }}
  />
  <Tab.Screen
    name="Home"
    component={TestScreen}
    options={{
      tabBarIcon: <FontAwesome name="home" size={20}></FontAwesome>,
      tabBarBackground: "rgb(58 107 229)",
    }}
  />
  <Tab.Screen
    name="Profile"
    component={TestScreen}
    options={{
      tabBarIcon: <Icon name="user" size={20}></Icon>,
      tabBarBackground: "rgb(255 59 45)",
    }}
  />
</Tab.Navigator>🔧 Props
| Prop | Type | Description | 
|---|---|---|
| tabBarStyle | StyleProp | Styling the whole Tab Bar | 
| labelsStyle | StyleProp | Styling all labels | 
| iconsStyle | StyleProp | Styling all icons | 
| currentTabLabelStyle | StyleProp | Styling only the current tab label | 
| currentTabIconStyle | StyleProp | Styling only the current tab icon | 
| currentTabDashStyle | StyleProp | Styling dash component above the current tab | 
📄 Credits
Big thanks to @AetherAurelia for the design : https://twitter.com/AetherAurelia/status/1638858062596374528?s=20