0 purchases
blured navigation bar x
blured_navigation_bar_x #
Bottom Navigation View Library for Flutter
BLURED BOTTOM NAVIGATION VIEW #
Supported Platforms
Android
iOS
Windows
Linux
MacOS
Web
ADAPTIVE #
WITH BORDER #
DEFAULT #
SHOW SELECTED LABEL #
How to Use #
# add this line to your dependencies
blured_navigation_bar_x: ^1.0.3
copied to clipboard
import 'package:blured_navigation_bar_x/blured_navigation_bar_x.dart';
copied to clipboard
// ignore_for_file: library_private_types_in_public_api
import 'package:blured_navigation_bar_x/blured_nav_bar_x_item.dart';
import 'package:blured_navigation_bar_x/blured_navigation_bar_x.dart';
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatefulWidget {
const MyApp({super.key});
// This widget is the root of your application.
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
int _index = 0;
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "Blured Navigation Bar X",
home: Scaffold(
appBar: AppBar(
title: const Text('Blured Navigation Bar X'),
centerTitle: true,
),
//If you want to show body behind the navbar, it should be true
extendBody: true,
body: Container(
height: double.infinity,
width: double.infinity,
child: Center(child: Screen(index: _index)),
),
bottomNavigationBar: BluredNavigationBarX(
currentIndex: _index,
labelStatus: LabelStatus.showSelected,
backgroundColor: Colors.black87.withOpacity(.2),
browColor: Colors.red,
border: Border.all(width: 3, color: Colors.red),
unselectedItemColor: Colors.grey,
selectedItemColor: Colors.red,
items: [
BluredNavBarXItem(icon: Icons.home, title: 'Home'),
BluredNavBarXItem(icon: Icons.favorite, title: 'Favorite'),
BluredNavBarXItem(icon: Icons.message, title: 'Message'),
],
onPressed: (int v) {
setState(() {
_index = v;
});
},
),
),
);
}
}
class Screen extends StatefulWidget {
final int index;
const Screen({Key? key, required this.index}) : super(key: key);
@override
State<Screen> createState() => _ScreenState();
}
class _ScreenState extends State<Screen> {
@override
Widget build(BuildContext context) {
return SizedBox(
width: MediaQuery.maybeOf(context)?.size.width,
height: MediaQuery.maybeOf(context)?.size.height,
child: Image.asset(
"assets/images/fon${widget.index + 1}.png",
fit: BoxFit.fill,
),
);
}
}
copied to clipboard
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
There are no reviews.