Bottom nav bar linked with pageview

dscnitrourkela · Apr 19, 2020 · 0382853 · 0382853
1 parent 98bddf7
commit 0382853
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 16 deletions.
diff --git a/gogrocy/lib/ui/router.dart b/gogrocy/lib/ui/router.dart
@@ -1,14 +1,15 @@
 import 'package:flutter/material.dart';
 import 'package:gogrocy/ui/views/awesome_animation_view.dart';
 import 'package:gogrocy/ui/views/home/home.dart';
+import 'package:gogrocy/ui/views/landing_page.dart';
 import 'package:gogrocy/ui/views/login_view.dart';
 
 Route<dynamic> generateRoute(RouteSettings settings) {
   switch (settings.name) {
     case '/':
       return MaterialPageRoute(builder: (context) => LoginView());
     case 'home':
-      return MaterialPageRoute(builder: (context) => Home());
+      return MaterialPageRoute(builder: (context) => HomePageView());
     case 'login':
       return PageRouteBuilder(
         pageBuilder: (BuildContext context, Animation<double> animation,

diff --git a/gogrocy/lib/ui/shared/constants.dart b/gogrocy/lib/ui/shared/constants.dart
@@ -20,8 +20,10 @@ class OnBoardingConfig{
 }
 
 class BottomNavBarConfig {
-  static double bottomNavBarHeight = 0.0842 * screenHeight;
+  static double bottomNavBarHeight = (70/823) * screenHeight;
   static double bottomNavBarWidth = screenWidth;
+  static double activeIconSize=(66/411)*screenWidth;
+  static double inactiveIconSize=(24/411)*screenWidth;
 }
 
 class AppBarConfig {

diff --git a/gogrocy/lib/ui/views/home/home.dart b/gogrocy/lib/ui/views/home/home.dart
@@ -4,6 +4,7 @@ import 'package:gogrocy/ui/views/home/category_list.dart';
 import 'package:gogrocy/ui/views/home/grid_list.dart';
 import 'package:gogrocy/ui/views/home/indicator.dart';
 import 'package:gogrocy/ui/shared/constants.dart' as constants;
+import 'package:gogrocy/ui/widgets/appbar.dart';
 import 'package:gogrocy/ui/widgets/bottom_navbar.dart';
 
 class Home extends StatelessWidget {

diff --git a/gogrocy/lib/ui/widgets/bottom_navbar.dart b/gogrocy/lib/ui/widgets/bottom_navbar.dart
@@ -1,24 +1,44 @@
 import 'package:fancy_bottom_navigation/fancy_bottom_navigation.dart';
 import 'package:flutter/material.dart';
 import 'package:gogrocy/core/services/bottom_appbar_provider.dart';
+import 'package:gogrocy/ui/widgets/navbar/bottom_navbar.dart';
 import 'package:provider/provider.dart';
+import 'package:gogrocy/ui/shared/constants.dart' as constants;
+
 
 class BottomNavBar extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     // TODO: implement build
     var provider = Provider.of<BottomNavBarProvider>(context);
-    return FancyBottomNavigation(
-      barBackgroundColor: Colors.black,
-      inactiveIconColor: Colors.grey,
-      textColor: Colors.white,
-      tabs: [
-        TabData(iconData: Icons.shopping_cart, title: "Cart"),
-        TabData(iconData: Icons.home, title: "Home"),
-        TabData(iconData: Icons.account_circle, title: "Account")
+    return CurvedNavigationBar(
+      //key: _bottomNavigationKey,
+      index: 0,
+      height: 75,
+      items: <Widget>[
+        Icon(
+          Icons.shopping_cart,
+          size: constants.BottomNavBarConfig.inactiveIconSize,
+          color: Colors.white,
+        ),
+        Icon(
+          Icons.explore,
+          size: 35,
+          color: Colors.white,
+        ),
+        Icon(
+          Icons.person,
+          size: 35,
+          color: Colors.white,
+        ),
       ],
-      onTabChangedListener: (int position) {
-        provider.currentIndex = position;
+      color: Colors.black,
+      buttonBackgroundColor: Colors.lightGreen,
+      backgroundColor: Colors.transparent,
+      animationCurve: Curves.easeOut,
+      animationDuration: Duration(milliseconds: 400),
+      onTap: (index) {
+        provider.currentIndex = index;
       },
     );
   }

diff --git a/gogrocy/lib/ui/widgets/navbar/bottom_navbar.dart b/gogrocy/lib/ui/widgets/navbar/bottom_navbar.dart
@@ -120,7 +120,7 @@ class CurvedNavigationBarState extends State<CurvedNavigationBar>
                   type: MaterialType.circle,
                   child: Padding(
                     padding: EdgeInsets.all(15.0),
-                    child: _icon,
+                    child: Center(child: _icon,),
                   ),
                 ),
               ),
@@ -129,19 +129,19 @@ class CurvedNavigationBarState extends State<CurvedNavigationBar>
           Positioned(
             left: 0,
             right: 0,
-            bottom: 0 - (75.0 - widget.height),
+            bottom: 0 - (75.0- widget.height),
             child: CustomPaint(
               painter: NavCustomPainter(
                   _pos, _length, widget.color, Directionality.of(context)),
               child: Container(
-                height: 75.0,
+                height: constants.BottomNavBarConfig.bottomNavBarHeight,
               ),
             ),
           ),
           Positioned(
             left: 0,
             right: 0,
-            bottom: 0 - (75.0 - widget.height),
+            bottom: 0 - (75 - widget.height),
             child: SizedBox(
                 height: 70.0,
                 child: Row(