ruki_nav_bar 0.0.7-dev

A Responsive navigation bar for web applications

example/lib/main.dart

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

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Demo',
        debugShowCheckedModeBanner: false,
        home: LayoutBuilder(
          builder: (_, constraints) {
            return SiteNavBar.get(
                body: Container(
                  color: Colors.red[100],
                ),
                indicatorLineThickness: 4,
               backgroundColor: Colors.transparent,
                extendBodyBehindAppBar: true,

                drawerMode: NavDrawerMode.full,
                pageIndicator: PageIndicator.line,
                itemPosition: NavItemPosition.right,
                drawerHeader: Container(),
                navTextStyle: const TextStyle(fontSize: 13, color: Colors.grey),
                drawerFooter: Container(
                  height: 50,
                  color: Colors.grey[200],
                ),
                leading: const Text(
                  "Logo",
                  style: TextStyle(color: Colors.red, fontSize: 30),
                ),
                navItemSpacing: 8,
                navItems: [
                  NavItem(
                      relativeIndex: 0,
                      label: "Home",
                      activeColor: Colors.blue,
                      onTap: () {}),
                  NavItem(
                      relativeIndex: 1,
                      label: "About us",
                      activeColor: Colors.blue,
                      onTap: () {}),
                  NavItem(
                      relativeIndex: 2,
                      label: "Contact us",
                      activeColor: Colors.blue,
                      onTap: () {}),
                ]).getNavBar(
                DeviceType.desktop.currentDevice(constraints.maxWidth));
          },
        ));
  }
}