spincircle_bottom_bar 2.0.0 copy "spincircle_bottom_bar: ^2.0.0" to clipboard
spincircle_bottom_bar: ^2.0.0 copied to clipboard

This is an easy to Implement Flutter Package for Spin Circle Bottom Navigation Bar

Spin Circle Bottom Bar #

An easy to implement Spin Circle Bottom Navigation Bar for Flutter Applications.

Current Features #

  • Initial Release for Spin Circle Bottom Bar
  • Customizable Tab Icon and Text for both Active and Inactive State
  • Customize colors for Spin Circle
  • Customize Bottom Bar and Spin Circle Item Count

Demo #

Usage #

To Use, simply add SpinCircleBottomBarHolder to your Scaffold's body, as follows:

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        appBar: AppBar(
          title: Text("RetroPortal Studio"),
          backgroundColor: Colors.deepOrangeAccent,
        ),
        //Adding SpinCircleBottomBarHolder to body of Scaffold
        body: SpinCircleBottomBarHolder(
          bottomNavigationBar: SCBottomBarDetails(
              circleColors: [Colors.white, Colors.orange, Colors.redAccent],
              iconTheme: IconThemeData(color: Colors.black45),
              activeIconTheme: IconThemeData(color: Colors.orange),
              backgroundColor: Colors.white,
              titleStyle: TextStyle(color: Colors.black45,fontSize: 12),
              activeTitleStyle: TextStyle(color: Colors.black,fontSize: 12,fontWeight: FontWeight.bold),
              actionButtonDetails: SCActionButtonDetails(
                  color: Colors.redAccent,
                  icon: Icon(
                    Icons.expand_less,
                    color: Colors.white,
                  ),
                  elevation: 2),
              elevation: 2.0,
              items: [
                // Suggested count : 4
                SCBottomBarItem(icon: Icons.verified_user, title: "User", onPressed: () {}),
                SCBottomBarItem(icon: Icons.supervised_user_circle, title: "Details", onPressed: () {}),
                SCBottomBarItem(icon: Icons.notifications, title: "Notifications", onPressed: () {}),
                SCBottomBarItem(icon: Icons.details, title: "New Data", onPressed: () {}),
              ],
              circleItems: [
                //Suggested Count: 3
                SCItem(icon: Icon(Icons.add), onPressed: () {}),
                SCItem(icon: Icon(Icons.print), onPressed: () {}),
                SCItem(icon: Icon(Icons.map), onPressed: () {}),
              ],
              bnbHeight: 80 // Suggested Height 80
          ),
          child: Container(
            color: Colors.orangeAccent.withAlpha(55),
            child: Center(child: Text("Isn't this Awesome!"),),
          ),
        ),
      ),
    );
  }
}

Roadmap #

Plans to add more customizations.

License #

MIT

213
likes
140
points
90
downloads

Publisher

verified publisherretroportalstudio.com

Weekly Downloads

This is an easy to Implement Flutter Package for Spin Circle Bottom Navigation Bar

Repository (GitHub)

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on spincircle_bottom_bar