Neverending Pun Machine

    @arelstone/react-native-animated-tabbar
    TypeScript icon, indicating that this package has built-in type declarations

    1.0.4 • Public • Published

    @arelstone/react-native-animated-tabbar

    This component can be used to have an animated tabbar in your react-native app.

    This package leverages on react-native-svg and d3-shapes.

    npm npm (scoped) GitHub issues GitHub pull requests

    @arelstone/react-native-animated-tabbar

    Install

    npm i @arelstone/react-native-animated-tabbar
    // or
    yarn add @arelstone/react-native-animated-tabbar

    For ios remember to run pod install in the ./ios-directory to apply react-native-svg.

    Props

    Prop Type Description
    tabs { icon: ReactElement; activeIcon: ReactElement; onPress: () => void; label?: string;} An array of tabs that will be displayed
    backgroundColor string (optional) Set the backgroundColor of the tabbar and the circle. Default: white
    circleAnimationDurationMs number (optional) Change the duration of the circle animation. Defualt: 100
    circleContainerStyle StyleProp (optional) Apply some styling the the container that holds the circles
    circleSize number (optional) The size of the circle. Default 40
    circleStyle StyleProp (optional) Apply some styling for the circles
    height number (optional) Set the height of the tabbar. Default 64
    textStyle StyleProp (optional) Apply styling to the label of each tab.

    Credits

    This component wouldn't have been able to do without the videos from William Candillon who was the inspiration for this component. I will reccoment all of his videos.

    Install

    npm i @arelstone/react-native-animated-tabbar

    DownloadsWeekly Downloads

    1

    Version

    1.0.4

    License

    MIT

    Unpacked Size

    1.02 MB

    Total Files

    30

    Last publish

    Collaborators

    • arelstone