浏览代码

Worked on UI of onboarding screens and adjusted UI/UX

Khubaib 4 月之前
父节点
当前提交
e069b91f73
共有 21 个文件被更改,包括 241 次插入64 次删除
  1. 1 0
      app/src/main/java/com/fastest/pass/browse/utils/BrowseNavigation.kt
  2. 42 17
      app/src/main/java/com/fastest/pass/dashboard/presentation/ui/component/BottomTab.kt
  3. 14 4
      app/src/main/java/com/fastest/pass/forgotpassword/presentation/ui/components/ForgotPasswordScreen.kt
  4. 23 5
      app/src/main/java/com/fastest/pass/login/presentation/ui/components/LoginScreen.kt
  5. 4 1
      app/src/main/java/com/fastest/pass/login/utils/LoginNavigation.kt
  6. 3 0
      app/src/main/java/com/fastest/pass/signup/presentation/ui/SignUpFragment.kt
  7. 66 5
      app/src/main/java/com/fastest/pass/signup/presentation/ui/components/SignUpScreen.kt
  8. 3 0
      app/src/main/java/com/fastest/pass/signup/utils/SignUpNavigation.kt
  9. 1 0
      app/src/main/java/com/fastest/pass/signup/utils/SignUpRoute.kt
  10. 1 1
      app/src/main/java/com/fastest/pass/ui/theme/Type.kt
  11. 8 5
      app/src/main/java/com/fastest/pass/welcome/presentation/ui/component/WelcomeScreen.kt
  12. 4 0
      app/src/main/java/com/fastest/pass/welcome/presentation/ui/fragment/WelcomeFragment.kt
  13. 4 4
      app/src/main/res/drawable/account.xml
  14. 8 8
      app/src/main/res/drawable/browse.xml
  15. 8 8
      app/src/main/res/drawable/home.xml
  16. 二进制
      app/src/main/res/drawable/home_img.png
  17. 42 0
      app/src/main/res/drawable/home_white.xml
  18. 二进制
      app/src/main/res/drawable/lock3x.png
  19. 6 6
      app/src/main/res/drawable/security.xml
  20. 二进制
      app/src/main/res/drawable/sms3x.png
  21. 3 0
      app/src/main/res/values/strings.xml

+ 1 - 0
app/src/main/java/com/fastest/pass/browse/utils/BrowseNavigation.kt

@@ -23,6 +23,7 @@ class BrowseNavigation {
                         val newItemBrowseFragment1 = NewItemBrowseFragment()
                         activity.supportFragmentManager.beginTransaction()
                             .replace(R.id.fragment_container_view, newItemBrowseFragment1)
+                            .addToBackStack("NewItemBrowseFragment")
                             .commit()
                     }
                     BrowseRoute.OpenNoneScreen -> {}

+ 42 - 17
app/src/main/java/com/fastest/pass/dashboard/presentation/ui/component/BottomTab.kt

@@ -1,5 +1,6 @@
 package com.fastest.pass.dashboard.presentation.ui.component
 
+import android.util.Log
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
@@ -9,12 +10,16 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.BottomNavigation
 import androidx.compose.material.BottomNavigationItem
+import androidx.compose.material3.Icon
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
@@ -26,8 +31,10 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.viewinterop.AndroidView
 import androidx.fragment.app.FragmentActivity
 import androidx.fragment.app.FragmentContainerView
+import androidx.fragment.app.FragmentManager
 import com.fastest.pass.R
 import com.fastest.pass.account.presentation.ui.fragment.AccountFragment
+import com.fastest.pass.browse.presentation.ui.fragment.NewItemBrowseFragment
 import com.fastest.pass.dashboard.domain.model.Screen
 import com.fastest.pass.home.presentation.ui.fragment.BrowseFragment
 import com.fastest.pass.home.presentation.ui.fragment.HomeFragment
@@ -36,18 +43,20 @@ import com.fastest.pass.ui.theme.Gray_Splash
 
 @Composable
 fun BottomTab() {
-
     val activity = LocalContext.current as FragmentActivity
     var selectedTab = remember { mutableStateOf<Screen>(Screen.Home) }
+    var isBottomBarVisible by remember { mutableStateOf(true) }
 
     Scaffold(
         bottomBar = {
-            BottomNavigationBar(
-                selectedTab = selectedTab.value,
-                onTabSelected = { screen ->
-                    selectedTab.value = screen
-                }
-            )
+            if (isBottomBarVisible) {
+                BottomNavigationBar(
+                    selectedTab = selectedTab.value,
+                    onTabSelected = { screen ->
+                        selectedTab.value = screen
+                    }
+                )
+            }
         }
     ) { paddingValues ->
         Box(modifier = Modifier
@@ -65,14 +74,33 @@ fun BottomTab() {
                 modifier = Modifier.fillMaxSize()
             )
 
+//            DisposableEffect(key1 = activity) {
+//                val listener = FragmentManager.OnBackStackChangedListener {
+//                    val currentFragment = activity.supportFragmentManager.fragments.lastOrNull()
+//
+//                    Log.d("test_navbar", "frag = ${currentFragment?.id} $currentFragment")
+//
+//                    isBottomBarVisible = when (currentFragment) {
+//                        is HomeFragment -> true
+//                        is BrowseFragment -> true
+//                        is AccountFragment -> true
+//                        is NewItemBrowseFragment -> false
+//                        else -> false
+//                    }
+//                }
+//
+//                activity.supportFragmentManager.addOnBackStackChangedListener(listener)
+//                onDispose {
+//                    activity.supportFragmentManager.removeOnBackStackChangedListener(listener)
+//                }
+//            }
+
             // Handle fragment replacement when the selected tab changes
             LaunchedEffect(selectedTab.value) {
                 loadFragment(activity, selectedTab.value)
             }
         }
     }
-
-
 }
 
 @Composable
@@ -82,7 +110,7 @@ fun BottomNavigationBar(selectedTab: Screen, onTabSelected: (Screen) -> Unit) {
 
     BottomNavigation(
         backgroundColor = colorResource(id = R.color.blue_login),
-        contentColor = colorResource(id = R.color.gray_text),
+        contentColor = colorResource(id = R.color.white),
         modifier = Modifier
             .fillMaxWidth()
             .height(70.dp),
@@ -95,10 +123,8 @@ fun BottomNavigationBar(selectedTab: Screen, onTabSelected: (Screen) -> Unit) {
                     Image(
                     painter = painterResource(id = screen.icon),
                     contentDescription = null,
-                    colorFilter = ColorFilter.tint(
-                        if (selectedTab == screen) colorResource(id = R.color.white)
-                        else colorResource(id = R.color.gray_text)
-                    ),
+                    colorFilter = ColorFilter.tint(if (selectedTab == screen) colorResource(id = R.color.white)
+                    else colorResource(id = R.color.gray_text)),
                 ) },
                 label = {
                     Text(
@@ -109,14 +135,13 @@ fun BottomNavigationBar(selectedTab: Screen, onTabSelected: (Screen) -> Unit) {
                         },
                 selected = selectedTab == screen,
                 onClick = { onTabSelected(screen) },
-                selectedContentColor = Color.Gray, // You can customize selected item color
-                unselectedContentColor = Color.Gray
+                selectedContentColor = Color.Transparent, // You can customize selected item color
+                unselectedContentColor = Color.Transparent
             )
         }
     }
 }
 
-
 fun loadFragment(activity: FragmentActivity, screen: Screen) {
     val fragment = when (screen) {
         Screen.Home -> HomeFragment()// Replace with your actual fragments

+ 14 - 4
app/src/main/java/com/fastest/pass/forgotpassword/presentation/ui/components/ForgotPasswordScreen.kt

@@ -4,6 +4,7 @@ import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.detectTapGestures
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
@@ -18,6 +19,7 @@ import androidx.compose.foundation.layout.statusBarsPadding
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material.Icon
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.IconButton
@@ -35,6 +37,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.focus.FocusManager
+import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.platform.LocalSoftwareKeyboardController
 import androidx.compose.ui.platform.SoftwareKeyboardController
@@ -63,6 +66,12 @@ fun ForgotPasswordScreen(clickType: (ClickType) -> Unit) {
             .background(colorResource(id = R.color.blue_login))
             .fillMaxSize()
             .statusBarsPadding()
+            .pointerInput(Unit) {
+                detectTapGestures {
+                    focusManager.clearFocus()
+                    keyboardController?.hide()
+                }
+            }
     ) {
         Column(
             modifier = Modifier
@@ -85,7 +94,7 @@ fun ForgotPasswordScreen(clickType: (ClickType) -> Unit) {
                 ForgotPasswordText(R.string.email_associated_account)
                 LoginTextFieldFP(keyboardController = keyboardController, focusManager = focusManager)
                 Spacer(modifier = Modifier.height(25.dp))
-                SendCodeButton(buttonText = R.string.send_code) { clickType ->
+                SendCodeButton(buttonText = R.string.send_email) { clickType ->
                     clickType(clickType)
                 }
             }
@@ -200,11 +209,12 @@ fun ColumnScope.LoginTextFieldFP(
 //            )
 //        },
         leadingIcon = {
-            Image(
-                painter = painterResource(id = R.drawable.profile_circle),
+            Icon(
+                painter = painterResource(id = R.drawable.sms3x),
                 contentDescription = "Email Logo",
                 modifier = Modifier
-                    .size(24.dp, 24.dp)
+                    .size(24.dp, 24.dp),
+                tint = colorResource(id = R.color.gray_splash)
             )
         },
         maxLines = 1,

+ 23 - 5
app/src/main/java/com/fastest/pass/login/presentation/ui/components/LoginScreen.kt

@@ -4,6 +4,7 @@ import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.detectTapGestures
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -23,6 +24,7 @@ import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
@@ -39,6 +41,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.focus.FocusManager
 import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.platform.LocalSoftwareKeyboardController
@@ -74,6 +77,12 @@ fun LoginScreen(clickType: (ClickType) -> Unit) {
             .background(colorResource(id = R.color.blue_login))
             .fillMaxSize()
             .statusBarsPadding()
+            .pointerInput(Unit) {
+                detectTapGestures {
+                    focusManager.clearFocus()
+                    keyboardController?.hide()
+                }
+            }
     ) {
         Column(
             modifier = Modifier
@@ -220,11 +229,12 @@ fun ColumnScope.LoginTextField(
 //            )
 //        },
         leadingIcon = {
-            Image(
-                painter = painterResource(id = R.drawable.profile_circle),
+            Icon(
+                painter = painterResource(id = R.drawable.sms3x),
                 contentDescription = "Email Logo",
                 modifier = Modifier
-                    .size(24.dp, 24.dp)
+                    .size(24.dp, 24.dp),
+                tint = colorResource(id = R.color.gray_splash)
             )
         },
         maxLines = 1,
@@ -311,7 +321,15 @@ fun ColumnScope.PasswordTextField(
         visualTransformation =
         if (passwordVisible) VisualTransformation.Companion.None
         else PasswordVisualTransformation(),
-
+        leadingIcon = {
+            Icon(
+                painter = painterResource(id = R.drawable.lock3x),
+                contentDescription = "Email Logo",
+                modifier = Modifier
+                    .size(24.dp, 24.dp),
+                tint = colorResource(id = R.color.gray_splash)
+            )
+        },
         trailingIcon = {
             val description = if (passwordVisible) "Hide Password"
             else "Show Password"
@@ -388,7 +406,7 @@ fun ColumnScope.ForgotPasswordText(clickType: (ClickType) -> Unit) {
         ),
         modifier = Modifier
             .align(Alignment.End)
-            .padding(start = 30.dp, top = 15.dp, end = 30.dp)
+            .padding(start = 30.dp, top = 15.dp, end = 35.dp)
     )
 }
 

+ 4 - 1
app/src/main/java/com/fastest/pass/login/utils/LoginNavigation.kt

@@ -21,7 +21,10 @@ class LoginNavigation {
                     }
                     LoginRoute.OpenNoneScreen -> {}
                     LoginRoute.GoBack -> {
-                        loginFragment.findNavController().popBackStack()
+                        loginFragment.findNavController().popBackStack(
+                            destinationId = R.id.welcomeFragment,
+                            inclusive = false
+                        )
                     }
                     LoginRoute.OpenMasterLoginScreen -> {
                         loginFragment.findNavController().navigate(R.id.masterLoginFragment)

+ 3 - 0
app/src/main/java/com/fastest/pass/signup/presentation/ui/SignUpFragment.kt

@@ -46,6 +46,9 @@ class SignUpFragment : BaseFragment() {
                             ClickType.GO_TO_MASTER_SIGNUP -> {
                                 viewmodel.navigateTo(SignUpRoute.OpenMasterSignupScreen)
                             }
+                            ClickType.GO_TO_LOGIN -> {
+                                viewmodel.navigateTo(SignUpRoute.OpenLoginScreen)
+                            }
                         }
                     }
                 }

+ 66 - 5
app/src/main/java/com/fastest/pass/signup/presentation/ui/components/SignUpScreen.kt

@@ -4,6 +4,8 @@ import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.detectTapGestures
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ColumnScope
@@ -15,11 +17,14 @@ import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.statusBarsPadding
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.ClickableText
 import androidx.compose.foundation.text.KeyboardActions
 import androidx.compose.foundation.text.KeyboardOptions
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Surface
@@ -36,6 +41,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.focus.FocusManager
 import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.input.pointer.pointerInput
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalFocusManager
 import androidx.compose.ui.platform.LocalSoftwareKeyboardController
@@ -43,6 +49,7 @@ import androidx.compose.ui.platform.SoftwareKeyboardController
 import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.AnnotatedString
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.input.ImeAction
 import androidx.compose.ui.text.input.KeyboardType
@@ -55,7 +62,8 @@ import com.fastest.pass.R
 
 enum class ClickType {
     GO_BACK,
-    GO_TO_MASTER_SIGNUP
+    GO_TO_MASTER_SIGNUP,
+    GO_TO_LOGIN
 }
 
 @Composable
@@ -68,6 +76,12 @@ fun SignUpScreen(clickType: (ClickType) -> Unit) {
             .background(colorResource(id = R.color.blue_login))
             .fillMaxSize()
             .statusBarsPadding()
+            .pointerInput(Unit) {
+                detectTapGestures {
+                    focusManager.clearFocus()
+                    keyboardController?.hide()
+                }
+            }
     ) {
         Column(
             modifier = Modifier
@@ -96,6 +110,9 @@ fun SignUpScreen(clickType: (ClickType) -> Unit) {
                 SignUpButton(buttonText = R.string.signup) { clickType ->
                     clickType(clickType)
                 }
+                HaveAnAccountText { clickType ->
+                    clickType(clickType)
+                }
             }
         }
     }
@@ -211,11 +228,12 @@ fun ColumnScope.SignUpTextField(
 //            )
 //        },
         leadingIcon = {
-            Image(
-                painter = painterResource(id = R.drawable.profile_circle),
+            Icon(
+                painter = painterResource(id = R.drawable.sms3x),
                 contentDescription = "Email Logo",
                 modifier = Modifier
-                    .size(24.dp, 24.dp)
+                    .size(24.dp, 24.dp),
+                tint = colorResource(id = R.color.gray_splash)
             )
         },
         maxLines = 1,
@@ -302,7 +320,15 @@ fun ColumnScope.PasswordTextFieldSU(
         visualTransformation =
         if (passwordVisible) VisualTransformation.Companion.None
         else PasswordVisualTransformation(),
-
+        leadingIcon = {
+            Icon(
+                painter = painterResource(id = R.drawable.lock3x),
+                contentDescription = "Email Logo",
+                modifier = Modifier
+                    .size(24.dp, 24.dp),
+                tint = colorResource(id = R.color.gray_splash)
+            )
+        },
         trailingIcon = {
             val description = if (passwordVisible) "Hide Password"
             else "Show Password"
@@ -363,4 +389,39 @@ fun ColumnScope.SignUpButton(buttonText: Int, clickType: (ClickType) -> Unit) {
             textAlign = TextAlign.Center
         )
     }
+}
+
+@Composable
+fun ColumnScope.HaveAnAccountText(clickType: (ClickType) -> Unit) {
+    Row(
+        modifier = Modifier
+            .fillMaxWidth()
+            .padding(top = 25.dp)
+            .padding(horizontal = 30.dp),
+        verticalAlignment = Alignment.CenterVertically,
+        horizontalArrangement = Arrangement.Center
+    ) {
+        Text(
+            text = stringResource(id = R.string.already_have_acc),
+            color = colorResource(id = R.color.gray_splash),
+            style = MaterialTheme.typography.displayLarge.copy(
+                fontSize = 16.sp
+            ),
+            lineHeight = 25.sp,
+            modifier = Modifier
+        )
+        Spacer(modifier = Modifier.width(3.dp))
+        ClickableText(
+            text = AnnotatedString(stringResource(id = R.string.signin)),
+            onClick = {
+                clickType.invoke(ClickType.GO_TO_LOGIN)
+            },
+            style = MaterialTheme.typography.displayLarge.copy(
+                fontSize = 16.sp,
+                lineHeight = 25.sp,
+                color = colorResource(id = R.color.sky_green),
+            ),
+            modifier = Modifier,
+        )
+    }
 }

+ 3 - 0
app/src/main/java/com/fastest/pass/signup/utils/SignUpNavigation.kt

@@ -18,6 +18,9 @@ class SignUpNavigation {
                     SignUpRoute.OpenMasterSignupScreen -> {
                         signUpFragment.findNavController().navigate(R.id.masterSignupFragment)
                     }
+                    SignUpRoute.OpenLoginScreen -> {
+                        signUpFragment.findNavController().navigate(R.id.loginFragment)
+                    }
                 }
 
                 signUpFragment.viewmodel.navigateTo(SignUpRoute.OpenNoneScreen)

+ 1 - 0
app/src/main/java/com/fastest/pass/signup/utils/SignUpRoute.kt

@@ -4,4 +4,5 @@ sealed class SignUpRoute {
     data object GoBack : SignUpRoute()
     data object OpenNoneScreen : SignUpRoute()
     data object OpenMasterSignupScreen : SignUpRoute()
+    data object OpenLoginScreen : SignUpRoute()
 }

+ 1 - 1
app/src/main/java/com/fastest/pass/ui/theme/Type.kt

@@ -74,7 +74,7 @@ val Typography = Typography(
     titleLarge = TextStyle(
         fontFamily = outfitFontFamily,
         fontWeight = FontWeight.ExtraBold,
-        fontSize = 70.sp,
+        fontSize = 60.sp,
         lineHeight = 50.sp,
         letterSpacing = 0.45.sp,
         textAlign = TextAlign.Center

+ 8 - 5
app/src/main/java/com/fastest/pass/welcome/presentation/ui/component/WelcomeScreen.kt

@@ -13,6 +13,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
@@ -136,8 +137,9 @@ fun WelcomePage(
             ) {
                 Text(
                     text = title,
-                    style = Typography.headlineLarge.copy(textAlign = TextAlign.Center, fontSize = TextUnit(24f,
-                        TextUnitType.Sp)),
+                    style = MaterialTheme.typography.headlineLarge.copy(
+                        textAlign = TextAlign.Center
+                    ),
                     color = Gray_Splash,
                     modifier = Modifier.fillMaxWidth()
                 )
@@ -168,8 +170,9 @@ fun WelcomePage(
             ) {
                 Text(
                     text = description,
-                    style = Typography.displaySmall.copy(textAlign = TextAlign.Center, fontSize = TextUnit(15f,
-                        TextUnitType.Sp)),
+                    style = MaterialTheme.typography.labelLarge.copy(
+                        fontSize = 18.sp
+                    ),
                     color = Gray_Splash,
                     textAlign = TextAlign.Center,
                     modifier = Modifier.fillMaxWidth()
@@ -177,7 +180,7 @@ fun WelcomePage(
             }
 
             Column(modifier = Modifier.weight(0.5f)) {
-                Spacer(Modifier.height(10.dp))
+                Spacer(Modifier.height(0.dp))
                 Row(
                     verticalAlignment = Alignment.CenterVertically,
                     horizontalArrangement = Arrangement.Center,

+ 4 - 0
app/src/main/java/com/fastest/pass/welcome/presentation/ui/fragment/WelcomeFragment.kt

@@ -4,14 +4,17 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Scaffold
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.ComposeView
+import androidx.compose.ui.res.colorResource
 import androidx.fragment.app.viewModels
 import com.fastest.pass.BaseFragment
+import com.fastest.pass.R
 import com.fastest.pass.ui.theme.FastestPassTheme
 import com.fastest.pass.welcome.presentation.ui.component.ClickType.LOGIN_CLICK
 import com.fastest.pass.welcome.presentation.ui.component.ClickType.SIGNUP_CLICK
@@ -49,6 +52,7 @@ class WelcomeFragment : BaseFragment() {
                         Box(
                             modifier = Modifier
                                 .fillMaxSize()
+                                .background(color = colorResource(id = R.color.light_gray_login))
                                 .padding(bottom = paddingValues.calculateBottomPadding()) // Apply padding to respect system bottom inset
                         ) {
                             // Your main content goes here

+ 4 - 4
app/src/main/res/drawable/account.xml

@@ -5,20 +5,20 @@
     android:viewportHeight="24">
   <path
       android:pathData="M12,12.005C14.761,12.005 17,9.766 17,7.005C17,4.243 14.761,2.005 12,2.005C9.239,2.005 7,4.243 7,7.005C7,9.766 9.239,12.005 12,12.005Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M20.59,22.005C20.59,18.135 16.74,15.005 12,15.005C7.26,15.005 3.41,18.135 3.41,22.005"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
 </vector>

+ 8 - 8
app/src/main/res/drawable/browse.xml

@@ -5,38 +5,38 @@
     android:viewportHeight="24">
   <path
       android:pathData="M5.005,10.005H7.005C9.005,10.005 10.005,9.005 10.005,7.005V5.005C10.005,3.005 9.005,2.005 7.005,2.005H5.005C3.005,2.005 2.005,3.005 2.005,5.005V7.005C2.005,9.005 3.005,10.005 5.005,10.005Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M17.005,10.005H19.005C21.005,10.005 22.005,9.005 22.005,7.005V5.005C22.005,3.005 21.005,2.005 19.005,2.005H17.005C15.005,2.005 14.005,3.005 14.005,5.005V7.005C14.005,9.005 15.005,10.005 17.005,10.005Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M17.005,22.005H19.005C21.005,22.005 22.005,21.005 22.005,19.005V17.005C22.005,15.005 21.005,14.005 19.005,14.005H17.005C15.005,14.005 14.005,15.005 14.005,17.005V19.005C14.005,21.005 15.005,22.005 17.005,22.005Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M5.005,22.005H7.005C9.005,22.005 10.005,21.005 10.005,19.005V17.005C10.005,15.005 9.005,14.005 7.005,14.005H5.005C3.005,14.005 2.005,15.005 2.005,17.005V19.005C2.005,21.005 3.005,22.005 5.005,22.005Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
 </vector>

+ 8 - 8
app/src/main/res/drawable/home.xml

@@ -5,38 +5,38 @@
     android:viewportHeight="24">
   <path
       android:pathData="M9.027,2.845L3.637,7.045C2.737,7.745 2.007,9.235 2.007,10.365V17.775C2.007,20.095 3.897,21.995 6.217,21.995H17.797C20.117,21.995 22.007,20.095 22.007,17.785V10.505C22.007,9.295 21.197,7.745 20.207,7.055L14.027,2.725C12.627,1.745 10.377,1.795 9.027,2.845Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M10.507,18.005H13.507C15.157,18.005 16.507,16.655 16.507,15.005V12.005C16.507,10.355 15.157,9.005 13.507,9.005H10.507C8.857,9.005 7.507,10.355 7.507,12.005V15.005C7.507,16.655 8.857,18.005 10.507,18.005Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M12.007,9.005V18.005"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M7.507,13.505H16.507"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
 </vector>

二进制
app/src/main/res/drawable/home_img.png


+ 42 - 0
app/src/main/res/drawable/home_white.xml

@@ -0,0 +1,42 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24">
+    <path
+        android:pathData="M9.027,2.845L3.637,7.045C2.737,7.745 2.007,9.235 2.007,10.365V17.775C2.007,20.095 3.897,21.995 6.217,21.995H17.797C20.117,21.995 22.007,20.095 22.007,17.785V10.505C22.007,9.295 21.197,7.745 20.207,7.055L14.027,2.725C12.627,1.745 10.377,1.795 9.027,2.845Z"
+        android:strokeAlpha="0.5"
+        android:strokeLineJoin="round"
+        android:strokeWidth="1.5"
+        android:fillColor="#00000000"
+        android:strokeColor="#ffffff"
+        android:fillAlpha="0.5"
+        android:strokeLineCap="round"/>
+    <path
+        android:pathData="M10.507,18.005H13.507C15.157,18.005 16.507,16.655 16.507,15.005V12.005C16.507,10.355 15.157,9.005 13.507,9.005H10.507C8.857,9.005 7.507,10.355 7.507,12.005V15.005C7.507,16.655 8.857,18.005 10.507,18.005Z"
+        android:strokeAlpha="0.5"
+        android:strokeLineJoin="round"
+        android:strokeWidth="1.5"
+        android:fillColor="#00000000"
+        android:strokeColor="#ffffff"
+        android:fillAlpha="0.5"
+        android:strokeLineCap="round"/>
+    <path
+        android:pathData="M12.007,9.005V18.005"
+        android:strokeAlpha="0.5"
+        android:strokeLineJoin="round"
+        android:strokeWidth="1.5"
+        android:fillColor="#00000000"
+        android:strokeColor="#ffffff"
+        android:fillAlpha="0.5"
+        android:strokeLineCap="round"/>
+    <path
+        android:pathData="M7.507,13.505H16.507"
+        android:strokeAlpha="0.5"
+        android:strokeLineJoin="round"
+        android:strokeWidth="1.5"
+        android:fillColor="#00000000"
+        android:strokeColor="#ffffff"
+        android:fillAlpha="0.5"
+        android:strokeLineCap="round"/>
+</vector>

二进制
app/src/main/res/drawable/lock3x.png


+ 6 - 6
app/src/main/res/drawable/security.xml

@@ -5,29 +5,29 @@
     android:viewportHeight="24">
   <path
       android:pathData="M20.912,11.125C20.912,16.015 17.362,20.595 12.512,21.935C12.182,22.025 11.822,22.025 11.492,21.935C6.642,20.595 3.092,16.015 3.092,11.125V6.735C3.092,5.915 3.712,4.985 4.482,4.675L10.052,2.395C11.302,1.885 12.712,1.885 13.962,2.395L19.532,4.675C20.292,4.985 20.922,5.915 20.922,6.735L20.912,11.125Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M12.002,12.505C13.107,12.505 14.002,11.609 14.002,10.505C14.002,9.4 13.107,8.505 12.002,8.505C10.898,8.505 10.002,9.4 10.002,10.505C10.002,11.609 10.898,12.505 12.002,12.505Z"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
   <path
       android:pathData="M12.002,12.505V15.505"
-      android:strokeAlpha="0.5"
+      android:strokeAlpha="1"
       android:strokeLineJoin="round"
       android:strokeWidth="1.5"
       android:fillColor="#00000000"
       android:strokeColor="#ffffff"
-      android:fillAlpha="0.5"
+      android:fillAlpha="1"
       android:strokeLineCap="round"/>
 </vector>

二进制
app/src/main/res/drawable/sms3x.png


+ 3 - 0
app/src/main/res/values/strings.xml

@@ -7,11 +7,14 @@
     <string name="forgot_your_password">Forgot your password?</string>
     <string name="dont_have_account">Don\'t have an account?</string>
     <string name="create_account">Create Account</string>
+    <string name="already_have_acc">Already have an account?</string>
     <string name="new_account">New Account</string>
     <string name="signup">Sign Up</string>
+    <string name="signin">Sign In</string>
     <string name="forgot_password">Forgot Password</string>
     <string name="email_associated_account">Enter the email address associated with your account.</string>
     <string name="send_code">Send Code</string>
+    <string name="send_email">Send Email</string>
     <string name="welcome_back">Welcome back!</string>
     <string name="login_to_continue">Please log in to continue.</string>
     <string name="enter_email_address">Enter email address"</string>