From c745226ee2ced247d3a975294e5d63401a58160a Mon Sep 17 00:00:00 2001 From: lokeshramchand-ctrl Date: Wed, 27 Aug 2025 07:37:15 +0530 Subject: [PATCH] OHO-19(Adding email UI) --- .../lib/main_pages/HomePage/homepage.dart | 1 - Frontend/lib/main_pages/HomePage/navbar.dart | 176 ++++++++---------- .../lib/main_pages/Statistics/statistics.dart | 1 - 3 files changed, 75 insertions(+), 103 deletions(-) diff --git a/Frontend/lib/main_pages/HomePage/homepage.dart b/Frontend/lib/main_pages/HomePage/homepage.dart index 4cb06d5..b486abf 100644 --- a/Frontend/lib/main_pages/HomePage/homepage.dart +++ b/Frontend/lib/main_pages/HomePage/homepage.dart @@ -823,7 +823,6 @@ class _FinTrackHomePageState extends State accentColor: accentColor, primaryColor: primaryColor, cardColor: cardColor, - floatingActionButtonLocation: FloatingActionButtonLocation.centerTop, ), ); } diff --git a/Frontend/lib/main_pages/HomePage/navbar.dart b/Frontend/lib/main_pages/HomePage/navbar.dart index 31d0b75..ea0df5c 100644 --- a/Frontend/lib/main_pages/HomePage/navbar.dart +++ b/Frontend/lib/main_pages/HomePage/navbar.dart @@ -1,5 +1,6 @@ // ignore_for_file: deprecated_member_use +import 'dart:ui'; import 'package:flutter/material.dart'; import 'package:monarch/support/add.dart'; import 'package:monarch/main_pages/HomePage/homepage.dart'; @@ -20,130 +21,103 @@ class CustomNavBar extends StatelessWidget { required this.backgroundColor, required this.accentColor, required this.primaryColor, - required this.cardColor, required FloatingActionButtonLocation floatingActionButtonLocation, + required this.cardColor, }); - // Define navigation items configuration - final List _navItems = const [ - NavItem( - icon: Icons.home_rounded, - index: 0, - page: FinTrackHomePage(), - ), - NavItem( - icon: Icons.bar_chart_rounded, - index: 1, - page: Statistics(), - ), - NavItem( - icon: Icons.settings_rounded, - index: 2, - page: AddExpenseScreen(), - ), + // Navigation items + final List _navItems = const [ + NavItem(icon: Icons.home_rounded, index: 0, page: FinTrackHomePage()), + NavItem(icon: Icons.bar_chart_rounded, index: 1, page: Statistics()), + NavItem(icon: Icons.settings_rounded, index: 2, page: AddExpenseScreen()), ]; @override Widget build(BuildContext context) { - return Container( - margin: const EdgeInsets.symmetric(horizontal: 24, vertical: 16), - height: 72, - decoration: BoxDecoration( - color: cardColor, - borderRadius: BorderRadius.circular(36), - boxShadow: [ - BoxShadow( - color: primaryColor.withOpacity(0.1), - blurRadius: 30, - offset: const Offset(0, 8), + return Align( + alignment: Alignment.bottomCenter, + child: Container( + margin: const EdgeInsets.only(bottom: 20), + padding: const EdgeInsets.symmetric(horizontal: 20), + height: 72, + width: MediaQuery.of(context).size.width * 0.7, // centered & responsive + decoration: BoxDecoration( + color: cardColor.withOpacity(0.65), + borderRadius: BorderRadius.circular(40), + boxShadow: [ + BoxShadow( + color: primaryColor.withOpacity(0.15), + blurRadius: 30, + offset: const Offset(0, 8), + ), + ], + ), + child: ClipRRect( + borderRadius: BorderRadius.circular(40), + child: BackdropFilter( + filter: ImageFilter.blur(sigmaX: 12, sigmaY: 12), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: + _navItems + .map((item) => _buildNavItem(context, item)) + .toList(), + ), ), - ], - ), - child: Row( - mainAxisAlignment: MainAxisAlignment.spaceEvenly, - children: [ - ..._navItems.map((item) => _buildNavItem(context, item)), - _buildAddButton(context), - ], + ), ), ); } Widget _buildNavItem(BuildContext context, NavItem item) { final isActive = currentIndex == item.index; - - return Material( - color: Colors.transparent, - borderRadius: BorderRadius.circular(20), - child: InkWell( - borderRadius: BorderRadius.circular(20), - onTap: () { - onTap(item.index); - Navigator.pushReplacement( - context, - MaterialPageRoute(builder: (context) => item.page), - ); - }, - child: Container( - width: 48, - height: 48, - decoration: BoxDecoration( - color: isActive ? primaryColor.withOpacity(0.1) : Colors.transparent, - borderRadius: BorderRadius.circular(20), + return GestureDetector( + onTap: () { + onTap(item.index); + Navigator.pushReplacement( + context, + MaterialPageRoute(builder: (context) => item.page), + ); + }, + child: Column( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + AnimatedContainer( + duration: const Duration(milliseconds: 250), + width: isActive ? 38 : 30, + height: isActive ? 38 : 30, + decoration: BoxDecoration( + color: + isActive + ? primaryColor.withOpacity(0.15) + : Colors.transparent, + borderRadius: BorderRadius.circular(16), + ), + child: Icon( + item.icon, + color: isActive ? primaryColor : primaryColor.withOpacity(0.4), + size: 24, + ), ), - child: Icon( - item.icon, - color: isActive ? primaryColor : primaryColor.withOpacity(0.4), - size: 24, - ), - ), - ), - ); - } - - Widget _buildAddButton(BuildContext context) { - return Container( - width: 48, - height: 48, - decoration: BoxDecoration( - color: accentColor, - borderRadius: BorderRadius.circular(20), - boxShadow: [ - BoxShadow( - color: accentColor.withOpacity(0.3), - blurRadius: 12, - offset: const Offset(0, 4), + const SizedBox(height: 4), + AnimatedContainer( + duration: const Duration(milliseconds: 250), + width: 6, + height: 6, + decoration: BoxDecoration( + color: isActive ? accentColor : Colors.transparent, + shape: BoxShape.circle, + ), ), ], ), - child: Material( - color: Colors.transparent, - borderRadius: BorderRadius.circular(20), - child: InkWell( - onTap: () => Navigator.push( - context, - MaterialPageRoute(builder: (context) => const AddExpenseScreen()), - ), - borderRadius: BorderRadius.circular(20), - child: const Icon( - Icons.add_rounded, - color: Colors.white, - size: 24, - ), - ), - ), ); } } -// Navigation item model +// Nav item model class NavItem { final IconData icon; final int index; final Widget page; - - const NavItem({ - required this.icon, - required this.index, - required this.page, - }); + const NavItem({required this.icon, required this.index, required this.page}); } diff --git a/Frontend/lib/main_pages/Statistics/statistics.dart b/Frontend/lib/main_pages/Statistics/statistics.dart index 2becd4a..fe47327 100644 --- a/Frontend/lib/main_pages/Statistics/statistics.dart +++ b/Frontend/lib/main_pages/Statistics/statistics.dart @@ -772,7 +772,6 @@ class StatisticsState extends State with TickerProviderStateMixin { accentColor: accentColor, primaryColor: primaryColor, cardColor: cardColor, - floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked, ), ); }