rotary_navbar 1.0.1

A customizable navigation bar with a curved design for Flutter applications.Which also rotates

CustomNavBar

A sleek, customizable navigation bar with a curved design for Flutter applications.

Features

• 🌊 Elegant curved design with customizable arc radius
• 🎨 Fully customizable colors for background, selected and unselected items
• 📐 Adjustable height and item spacing
• 🚀 Smooth animations when switching between items
• 🧩 Easy to integrate and customize

Installation

Add this to your package's pubspec.yaml file:

dependencies:
  rotary_navbar: ^1.0.0



Then run:

$ flutter pub get

Usage
Import the package in your Dart file:

import 'package:rotary_navbar/rotary_navbar.dart';


Implement the CustomNavBar in your widget tree:

Scaffold(
  body: YourPageContent(),
  bottomNavigationBar: CustomNavBar(
    items: [
      NavBarItem(icon: Icons.home, label: 'Home'),
      NavBarItem(icon: Icons.search, label: 'Search'),
      NavBarItem(icon: Icons.person, label: 'Profile'),
      NavBarItem(icon: Icons.settings, label: 'Settings'),
    ],
    onItemSelected: (index) {
      // Handle item selection
    },
  ),
)


Customization
The CustomNavBar widget offers various customization options:
ParameterTypeDefaultDescriptionitemsList<NavBarItem>RequiredList of navigation itemsbackgroundColorColorColors.blackBackground color of the navbarselectedItemColorColorColor(0xFF7C4DFF)Color of the selected itemunselectedItemColorColorColors.greyColor of unselected itemsarcRadiusdouble95.0Radius of the curved archeightdouble96.0Height of the navigation baritemSpacingdouble0.35Spacing between items (as a fraction of screen width)onItemSelectedValueChanged<int>nullCallback function when an item is selected

Example
Here's a more detailed example of how to use CustomNavBar:

import 'package:flutter/material.dart';
import 'package:custom_nav_bar/custom_nav_bar.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _selectedIndex = 0;

  final List<Widget> _pages = [
    Center(child: Text('Home Page')),
    Center(child: Text('Search Page')),
    Center(child: Text('Profile Page')),
    Center(child: Text('Settings Page')),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('CustomNavBar Demo')),
      body: _pages[_selectedIndex],
      bottomNavigationBar: CustomNavBar(
        items: [
          NavBarItem(icon: Icons.home, label: 'Home'),
          NavBarItem(icon: Icons.search, label: 'Search'),
          NavBarItem(icon: Icons.person, label: 'Profile'),
          NavBarItem(icon: Icons.settings, label: 'Settings'),
        ],
        backgroundColor: Colors.black,
        selectedItemColor: Colors.blue,
        unselectedItemColor: Colors.grey,
        arcRadius: 95,
        height: 96,
        itemSpacing: 0.35,
        onItemSelected: (index) {
          setState(() {
            _selectedIndex = index;
          });
        },
      ),
    );
  }
}


For a complete example, please check the example folder in the package repository.
Contributing
Contributions are welcome! If you find a bug or want a feature, please open an issue.
License
This project is licensed under the MIT License - see the LICENSE file for details.