Merge pull request #556 from HackIllinois/sneh/app_bar

Modified app bar

app/src/main/java/org/hackillinois/android/view/MainActivity.kt

@@ -56,19 +56,26 @@ class MainActivity : AppCompatActivity() {
 
     private fun setupBottomAppBar() {
         // by default, home button is selected
-        val selectedIconColor = ContextCompat.getColor(this, R.color.selectedAppBarIcon)
-        val unselectedIconColor = ContextCompat.getColor(this, R.color.unselectedAppBarIcon)
+        val selectedIconColor = ContextCompat.getColor(this, R.color.black)
+        val unselectedIconColor = ContextCompat.getColor(this, R.color.black)
 
+        // Set default icons (assume these are your unselected drawables)
+        bottomAppBar.homeButton.setImageResource(R.drawable.battle_png)
+        bottomAppBar.scheduleButton.setImageResource(R.drawable.schedule_png)
+        bottomAppBar.shopButton.setImageResource(R.drawable.shop_png)
+        bottomAppBar.profileButton.setImageResource(R.drawable.profile_png)
+
+        // Set default color filter on home button (as it's selected by default)
         bottomAppBar.homeButton.setColorFilter(selectedIconColor)
 
         val bottomBarButtons = listOf(
             bottomAppBar.homeButton,
             bottomAppBar.scheduleButton,
             bottomAppBar.shopButton,
-            bottomAppBar.profileButton,
+            bottomAppBar.profileButton
         )
 
-        // make all buttons unselectedColor and then set selected button to selectedColor
+        // Set click listeners for each button.
         bottomBarButtons.forEach { button ->
             button.setOnClickListener { view ->
                 val newSelection = bottomBarButtons.indexOf(button)
@@ -77,15 +84,31 @@ class MainActivity : AppCompatActivity() {
                 if (newSelection != currentSelection) {
                     currentSelection = newSelection
 
-                    // change icon colors
+                    // Reset all buttons: set unselected drawable and color filter.
+                    bottomAppBar.homeButton.setImageResource(R.drawable.battle_png)
+                    bottomAppBar.scheduleButton.setImageResource(R.drawable.schedule_png)
+                    bottomAppBar.shopButton.setImageResource(R.drawable.shop_png)
+                    bottomAppBar.profileButton.setImageResource(R.drawable.profile_png)
                     bottomBarButtons.forEach { (it as ImageButton).setColorFilter(unselectedIconColor) }
-                    (view as ImageButton).setColorFilter(selectedIconColor)
 
+                    // Set the clicked button to selected drawable and color filter.
                     when (view) {
-                        bottomAppBar.homeButton -> switchFragment(HomeFragment(), false)
-                        bottomAppBar.scheduleButton -> switchFragment(ScheduleFragment(), false)
-                        bottomAppBar.shopButton -> switchFragment(ShopFragment(), false)
-                        bottomAppBar.profileButton -> switchFragment(ProfileFragment(), false)
+                        bottomAppBar.homeButton -> {
+                            bottomAppBar.homeButton.setImageResource(R.drawable.battle_underlined_png)
+                            switchFragment(HomeFragment(), false)
+                        }
+                        bottomAppBar.scheduleButton -> {
+                            bottomAppBar.scheduleButton.setImageResource(R.drawable.schedule_underlined_png)
+                            switchFragment(ScheduleFragment(), false)
+                        }
+                        bottomAppBar.shopButton -> {
+                            bottomAppBar.shopButton.setImageResource(R.drawable.shop_underlined_png)
+                            switchFragment(ShopFragment(), false)
+                        }
+                        bottomAppBar.profileButton -> {
+                            bottomAppBar.profileButton.setImageResource(R.drawable.profile_underlined_png)
+                            switchFragment(ProfileFragment(), false)
+                        }
                         else -> return@setOnClickListener
                     }
                 }
@@ -113,7 +136,7 @@ class MainActivity : AppCompatActivity() {
                     bottomAppBar.shopButton,
                     bottomAppBar.profileButton,
                 )
-                val unselectedIconColor = ContextCompat.getColor(this, R.color.unselectedAppBarIcon)
+                val unselectedIconColor = ContextCompat.getColor(this, R.color.black)
                 bottomBarButtons.forEach { (it as ImageButton).setColorFilter(unselectedIconColor) }
 
                 // if not already on scanner selection page, switch fragment to scanner selection page

app/src/main/res/drawable/ic_profile.xml

@@ -3,7 +3,7 @@
     android:height="24dp"
     android:viewportWidth="24"
     android:viewportHeight="24"
-    android:tint="@color/unselectedAppBarIcon">
+    android:tint="@color/black">
   <path
       android:fillColor="@android:color/white"
       android:pathData="M12,12c2.21,0 4,-1.79 4,-4s-1.79,-4 -4,-4 -4,1.79 -4,4 1.79,4 4,4zM12,14c-2.67,0 -8,1.34 -8,4v2h16v-2c0,-2.66 -5.33,-4 -8,-4z"/>

app/src/main/res/drawable/ic_today.xml

@@ -3,7 +3,7 @@
     android:height="24dp"
     android:viewportWidth="24"
     android:viewportHeight="24"
-    android:tint="@color/unselectedAppBarIcon">
+    android:tint="@color/black">
   <path
       android:pathData="M19,3H18V2C18,1.45 17.55,1 17,1C16.45,1 16,1.45 16,2V3H8V2C8,1.45 7.55,1 7,1C6.45,1 6,1.45 6,2V3H5C3.89,3 3.01,3.9 3.01,5L3,19C3,20.1 3.89,21 5,21H19C20.1,21 21,20.1 21,19V5C21,3.9 20.1,3 19,3ZM18,19H6C5.45,19 5,18.55 5,18V8H19V18C19,18.55 18.55,19 18,19ZM8,10H11C11.55,10 12,10.45 12,11V14C12,14.55 11.55,15 11,15H8C7.45,15 7,14.55 7,14V11C7,10.45 7.45,10 8,10Z"
       android:fillColor="#FFFFFF"/>

app/src/main/res/layout/activity_main.xml

@@ -2,6 +2,7 @@
 <androidx.coordinatorlayout.widget.CoordinatorLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:paddingBottom="0dp">
@@ -16,39 +17,47 @@
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_gravity="bottom"
-        app:backgroundTint="@color/darkForest">
+        app:backgroundTint="@color/cream">
 
         <androidx.constraintlayout.widget.ConstraintLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:orientation="horizontal">
 
+
             <androidx.appcompat.widget.AppCompatImageButton
                 android:id="@+id/homeButton"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
-                android:background="@color/darkForest"
+                android:layout_marginTop="4dp"
+                android:layout_marginBottom="16dp"
+                android:background="@color/cream"
                 app:layout_constraintBottom_toBottomOf="parent"
                 app:layout_constraintEnd_toStartOf="@+id/scheduleButton"
                 app:layout_constraintHorizontal_bias="0.5"
                 app:layout_constraintStart_toStartOf="parent"
                 app:layout_constraintTop_toTopOf="parent"
-                app:srcCompat="@drawable/ic_home" />
+                app:layout_constraintVertical_bias="0.0"
+                app:layout_constraintHorizontal_chainStyle="spread"
+                app:tint="@color/black"
+                app:srcCompat="@drawable/battle_png" />
+
 
             <androidx.appcompat.widget.AppCompatImageButton
                 android:id="@+id/scheduleButton"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
-                android:background="@color/darkForest"
+                android:background="@color/cream"
                 app:layout_constraintBottom_toBottomOf="@id/homeButton"
                 app:layout_constraintEnd_toStartOf="@+id/placeholder"
                 app:layout_constraintHorizontal_bias="0.5"
                 app:layout_constraintStart_toEndOf="@+id/homeButton"
-                app:srcCompat="@drawable/ic_today" />
+                app:srcCompat="@drawable/schedule_png" />
+
 
             <View
                 android:id="@+id/placeholder"
-                android:layout_width="70dp"
+                android:layout_width="72dp"
                 android:layout_height="0dp"
                 android:visibility="invisible"
                 app:layout_constraintBottom_toBottomOf="@id/homeButton"
@@ -62,42 +71,44 @@
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:layout_marginEnd="16dp"
-                android:background="@color/darkForest"
+                android:background="@color/cream"
                 app:layout_constraintBottom_toBottomOf="@id/homeButton"
                 app:layout_constraintEnd_toEndOf="parent"
                 app:layout_constraintHorizontal_bias="0.5"
                 app:layout_constraintStart_toEndOf="@+id/shopButton"
-                app:srcCompat="@drawable/ic_profile" />
+                app:srcCompat="@drawable/profile_png" />
+
 
             <androidx.appcompat.widget.AppCompatImageButton
                 android:id="@+id/shopButton"
                 android:layout_width="48dp"
                 android:layout_height="48dp"
                 android:layout_marginBottom="2dp"
-                android:background="@color/darkForest"
+                android:background="@color/cream"
                 app:layout_constraintBottom_toBottomOf="@id/homeButton"
                 app:layout_constraintEnd_toStartOf="@+id/profileButton"
                 app:layout_constraintHorizontal_bias="0.5"
                 app:layout_constraintStart_toEndOf="@+id/placeholder"
                 app:layout_constraintTop_toTopOf="@+id/homeButton"
-                app:srcCompat="@drawable/ic_point_shop" />
+                app:srcCompat="@drawable/shop_png" />
+
         </androidx.constraintlayout.widget.ConstraintLayout>
 
     </com.google.android.material.bottomappbar.BottomAppBar>
 
     <com.google.android.material.floatingactionbutton.FloatingActionButton
         android:id="@+id/code_entry_fab"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        app:backgroundTint="@color/white"
-        app:layout_anchor="@id/bottomAppBar"
-        app:srcCompat="@drawable/qr_icon"
-        app:tint="@color/selectedAppBarIcon"
-        app:fabCradleMargin="0dp"
-        app:fabCradleVerticalOffset="0dp"
-        app:fabAlignmentMode="center"/>
-
-<!--    <FrameLayout-->
+        android:layout_width="72dp"
+        android:layout_height="72dp"
+        app:backgroundTint="@color/cream"
+        android:layout_gravity="bottom|center"
+        android:layout_marginBottom="30dp"
+        android:layout_marginTop="20dp"
+        app:fabCustomSize="72dp"
+        app:maxImageSize="40dp"
+        app:srcCompat="@drawable/camera_png" />
+
+    <!--    <FrameLayout-->
 <!--        android:id="@+id/codeEntrySheet"-->
 <!--        android:layout_width="wrap_content"-->
 <!--        android:layout_height="wrap_content"-->

app/src/main/res/values/colors.xml

@@ -13,8 +13,8 @@
     <color name="starColor">#ED9B21</color>
     <color name="primaryTextColor">#08151B</color>
     <color name="proTagColor">#6D9CA0</color>
-    <color name="selectedAppBarIcon">#ACCEBE</color> <!--   For bottom tab icons     -->
-    <color name="unselectedAppBarIcon">#FFFFFF</color> <!--   For bottom tab icons     -->
+<!--    <color name="selectedAppBarIcon">#000000</color> &lt;!&ndash;   For bottom tab icons     &ndash;&gt;-->
+<!--    <color name="unselectedAppBarIcon">#000000F</color> &lt;!&ndash;   For bottom tab icons     &ndash;&gt;-->
 
 <!--      2023 color palette (from leaderboard)       -->
     <color name="nightBlue">#0D387C</color>
@@ -61,5 +61,9 @@
     <color name="burntBrown">#8C3712</color>
     <color name="burntBrownBorder">#C5673F</color>
     <color name="tealButtonBorder">#0E3F41</color>
+
+  <!--      2025 color palette      -->
+    <color name="cream">#F5F0DD</color>
+    <color name="black">#000000</color>
 
 </resources>

app/src/main/res/values/strings.xml

@@ -15,6 +15,12 @@
     <string name="need_internet_title">Internet Required</string>
     <string name="need_internet_message">You must be connected to the internet in order to use the HackIllinois app. Please retry once you have verified your connection.</string>
 
+    <!--   Appbar   -->
+    <string name="home_icon">Home</string>
+    <string name="schedule_icon">Schedule</string>
+    <string name="prizes_icon">Prizes</string>
+    <string name="profile_icon">Profile</string>
+
     <!--    Onboarding Fragment   -->
     <string name="onboarding_get_started">Get Started</string>
     <string name="onboarding_welcome_title">Welcome!</string>