chore: updated UI chnages.

fossasia · Jan 6, 2025 · ee86ffa · ee86ffa
1 parent 777ef9f
commit ee86ffa
Show file tree

Hide file tree

Showing 6 changed files with 200 additions and 286 deletions.
diff --git a/lib/constants.dart b/lib/constants.dart
@@ -1,3 +1,5 @@
+import 'dart:ui';
+
 import 'package:badgemagic/bademagic_module/utils/toast_utils.dart';
 import 'package:url_launcher/url_launcher.dart';
 
@@ -6,6 +8,22 @@ const drawBadgeScreen = "bm_db_screen";
 const savedClipartScreen = "bm_sc_screen";
 const savedBadgeScreen = "bm_sb_screen";
 
+//Colors used in the app
+ // Primary Colors
+  const Color colorPrimary = Color(0xFFD32F2F);
+  const Color colorPrimaryDark = Color(0xFFC72C2C);
+  const Color colorAccent = Color(0xFFD32F2F);
+
+  // Knob Colors
+  const Color backCircleColor = Color(0xFFEDEDED);
+  const Color indicatorColor = Color(0xFFD32F2F);
+  const Color progressSecondaryColor = Color(0xFFEEEEEE);
+
+  // Additional Colors
+  const Color mdGrey400 = Color(0xFFBDBDBD);
+  const Color dividerColor = Color(0xFFE0E0E0);
+  const Color drawerHeaderTitle = Color(0xFFFFFFFF);
+
 //path to all the animation assets used
 const String animation = 'assets/animations/ic_anim_animation.gif';
 const String aniLeft = 'assets/animations/ic_anim_left.gif';

diff --git a/lib/view/homescreen.dart b/lib/view/homescreen.dart
@@ -146,7 +146,7 @@ class _HomeScreenState extends State<HomeScreen>
           length: 3,
           child: CommonScaffold(
             index: 0,
-            title: 'BadgeMagic',
+            title: 'Badge Magic',
             body: SafeArea(
               child: SingleChildScrollView(
                 physics: isDialInteracting
@@ -158,7 +158,7 @@ class _HomeScreenState extends State<HomeScreen>
                     Container(
                       margin: EdgeInsets.all(15.w),
                       child: Material(
-                        color: Colors.white,
+                        color: drawerHeaderTitle,
                         borderRadius: BorderRadius.circular(10.r),
                         elevation: 4,
                         child: ExtendedTextField(
@@ -177,8 +177,10 @@ class _HomeScreenState extends State<HomeScreen>
                               },
                               icon: const Icon(Icons.tag_faces_outlined),
                             ),
-                            focusedBorder: const OutlineInputBorder(
-                              borderSide: BorderSide(color: Colors.red),
+                            focusedBorder: OutlineInputBorder(
+                              borderRadius:
+                                  BorderRadius.all(Radius.circular(10.r)),
+                              borderSide: BorderSide(color: colorPrimary),
                             ),
                           ),
                         ),
@@ -190,23 +192,23 @@ class _HomeScreenState extends State<HomeScreen>
                             height: 150.h,
                             decoration: BoxDecoration(
                               borderRadius: BorderRadius.circular(10.r),
-                              color: Colors.grey.shade100,
+                              color: dividerColor,
                             ),
                             margin: EdgeInsets.symmetric(horizontal: 15.w),
                             padding: EdgeInsets.symmetric(
                                 vertical: 10.h, horizontal: 10.w),
                             child: VectorGridView())),
                     TabBar(
-                      indicatorSize: TabBarIndicatorSize.label,
+                      indicatorSize: TabBarIndicatorSize.tab,
                       labelColor: Colors.black,
-                      unselectedLabelColor: Colors.grey,
-                      indicatorColor: Colors.red,
+                      unselectedLabelColor: mdGrey400,
+                      indicatorColor: colorPrimary,
                       controller: _tabController,
                       splashFactory: InkRipple.splashFactory,
                       overlayColor: WidgetStateProperty.resolveWith<Color?>(
                         (Set<WidgetState> states) {
                           if (states.contains(WidgetState.pressed)) {
-                            return Colors.grey[300];
+                            return dividerColor;
                           }
                           return null;
                         },
@@ -218,7 +220,7 @@ class _HomeScreenState extends State<HomeScreen>
                       ],
                     ),
                     SizedBox(
-                      height: 180.h, // Adjust the height dynamically
+                      height: 250.h, // Adjust the height dynamically
                       child: TabBarView(
                         physics: const NeverScrollableScrollPhysics(),
                         controller: _tabController,
@@ -274,7 +276,7 @@ class _HomeScreenState extends State<HomeScreen>
                                       horizontal: 33.w, vertical: 8.h),
                                   decoration: BoxDecoration(
                                     borderRadius: BorderRadius.circular(2.r),
-                                    color: Colors.grey.shade400,
+                                    color: mdGrey400,
                                   ),
                                   child: const Text('Save'),
                                 ),
@@ -311,7 +313,7 @@ class _HomeScreenState extends State<HomeScreen>
                                       horizontal: 20.w, vertical: 8.h),
                                   decoration: BoxDecoration(
                                     borderRadius: BorderRadius.circular(2.r),
-                                    color: Colors.grey.shade400,
+                                    color: mdGrey400,
                                   ),
                                   child: const Text('Transfer'),
                                 ),

diff --git a/lib/view/widgets/animation_container.dart b/lib/view/widgets/animation_container.dart
@@ -35,7 +35,7 @@ class _AniContainerState extends State<AniContainer> {
 
     return Container(
       margin: EdgeInsets.symmetric(horizontal: 5.w, vertical: 4.h),
-      height: 50.h,
+      height: 65.h,
       width: 110.w,
       child: GestureDetector(
         onTap: () {
@@ -51,10 +51,7 @@ class _AniContainerState extends State<AniContainer> {
             mainAxisAlignment: MainAxisAlignment.center,
             children: [
               Flexible(
-                child: Image.asset(
-                  widget.animation,
-                  fit: BoxFit.contain,
-                ),
+                child: Image.asset(widget.animation, fit: BoxFit.fill),
               ),
               Text(
                 widget.animationName,

diff --git a/lib/view/widgets/common_scaffold_widget.dart b/lib/view/widgets/common_scaffold_widget.dart
@@ -1,3 +1,4 @@
+import 'package:badgemagic/constants.dart';
 import 'package:badgemagic/view/widgets/navigation_drawer.dart';
 import 'package:flutter/material.dart';
 
@@ -33,7 +34,7 @@ class CommonScaffold extends StatelessWidget {
             ),
           );
         }),
-        backgroundColor: Colors.red,
+        backgroundColor: colorPrimary,
         title: Text(
           key: scaffoldKey,
           title,