curve_bottom_nav_bar 0.0.1 copy "curve_bottom_nav_bar: ^0.0.1" to clipboard
curve_bottom_nav_bar: ^0.0.1 copied to clipboard

A highly customizable, animated bottom navigation bar with a central floating action notch and smooth curved background. Designed for apps that want a playful yet production‑ready navigation experience.

example/lib/main.dart

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

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final iconData = [
    Icons.home,
    Icons.shopping_bag,
    Icons.read_more,
    Icons.receipt,
  ];
  final pages = [PageOne(), PageTwo(), PageThree(), PageFour()];
  int activeIndex = 0;
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
      ),
      home: CurveBottomNavBar(
        activeColor: Colors.yellow,
        activeIndex: activeIndex,
        centerFloatIcon: Icon(Icons.send),
        curveColor: Color(0xFF8C4EF8),
        curveHeight: 65,
        curveNotch: 38,
        curveRadius: 40,
        inActiveColor: Colors.grey,
        iconData: iconData.map((e) => Icon(e)).toList(),
        widget: pages,
        onCenterFloatingTab: () {
          print("send float tab");
        },
        onContentTap: (int index) {
          setState(() {
            activeIndex = index;
          });
        },
      ),
    );
  }
}

class PageOne extends StatelessWidget {
  const PageOne({super.key});

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [Center(child: Text("Page One"))],
      ),
    );
  }
}

class PageTwo extends StatelessWidget {
  const PageTwo({super.key});

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [Center(child: Text("Page Two"))],
      ),
    );
  }
}

class PageThree extends StatelessWidget {
  const PageThree({super.key});

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [Center(child: Text("Page Three"))],
      ),
    );
  }
}

class PageFour extends StatelessWidget {
  const PageFour({super.key});

  @override
  Widget build(BuildContext context) {
    return const Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [Center(child: Text("Page Four"))],
      ),
    );
  }
}
4
likes
130
points
21
downloads

Publisher

verified publishersagarkoju5.com.np

Weekly Downloads

A highly customizable, animated bottom navigation bar with a central floating action notch and smooth curved background. Designed for apps that want a playful yet production‑ready navigation experience.

Documentation

API reference

License

BSD-3-Clause (license)

Dependencies

flutter

More

Packages that depend on curve_bottom_nav_bar