animated_rail 0.0.5 copy "animated_rail: ^0.0.5" to clipboard
animated_rail: ^0.0.5 copied to clipboard

outdated

Flutter Animated Naviation Rail with multiple cool effects.

Animated Naviation Rail for Flutter #

Pub

Flutter Animated Naviation Rail with multiple cool effects see example project.

Android-Emulator---Pixel_3_XL_API_29_5554-2021-02-05-18-24-381.gif

Getting Started #

Add the package to your pubspec.yaml:

animated_rail: any

In your dart file, import the library:

import 'package:animated_rail/index.dart';
  AnimatedRail(
        activeColor: Colors.purple,
        background: hexToColor('#8B77DD'),
        maxWidth: 275,
        width: 100,
        expand: false,
        isStatic: true,
        items: [
          RailItem(
              icon: Icon(Icons.home),
              label: "Home",
              screen: _buildScreen('Home')),
          RailItem(
              icon: Icon(Icons.message_outlined),
              label: 'Messages',
              screen: _buildScreen('Messages')),
          RailItem(
              icon: Icon(Icons.notifications),
              label: "Notification",
              screen: _buildScreen('Notification')),
          RailItem(
              icon: Icon(Icons.person),
              label: 'Profile',
              screen: _buildScreen('Profile')),
        ],
      )

Parameters: #

Name Description Required Default value
items the tabs of the rail as a list of object type [RailItem] required -
width the width of the rail when it is opened required 100
maxWidth the max width the rai will snap to, active when [exapnd] is equal true - 350
direction direction of rail if it is on the right or left required TextDirection.ltr
iconBackground default icon background color if the [RailItem] doesn't have one - white
activeColor default active color for text and icon if the [RailItem] doesn't have one - primary color
iconColor default inactive icon and text color if the [RailItem] doesn't have one - -
selectedIndex current selected Index dont use it unlessa you want to change the tabs programmatically - 0
background background of the rail - 0
expand if true the the rail can exapnd and reach [maxWidth] and the animation for text will take effect - true
isStatic if true the rail will not move vertically - false

future features #

  • ❌ full custom tab
  • ❌ add more customization to rail item
  • ❌ custom rail pointer
  • ❌ custom rail shape

Contributions are more than welcomed

49
likes
0
pub points
72%
popularity

Publisher

unverified uploader

Flutter Animated Naviation Rail with multiple cool effects.

Repository (GitHub)
View/report issues

License

unknown (license)

Dependencies

flutter

More

Packages that depend on animated_rail