Feature: dream of becoming Shailushai

app/build.gradle.kts

@@ -59,6 +59,7 @@ dependencies {
     implementation("androidx.compose.ui:ui-graphics")
     implementation("androidx.compose.ui:ui-tooling-preview")
     implementation("androidx.compose.material:material")
+    implementation("androidx.navigation:navigation-runtime-ktx:2.7.4")
     testImplementation("junit:junit:4.13.2")
     androidTestImplementation("androidx.test.ext:junit:1.1.5")
     androidTestImplementation("androidx.test.espresso:espresso-core:3.5.1")

app/src/main/java/com/example/android_programming/Header/HeaderWithLogo.kt

@@ -0,0 +1,40 @@
+package com.example.android_programming.Header
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.example.android_programming.R
+
+@Composable
+fun Header() {
+    Box(
+        modifier = Modifier
+            .fillMaxWidth()
+            .background(Color.White)
+    ) {
+        Image(
+            painter = painterResource(id = R.drawable.logo),
+            contentDescription = "image",
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(50.dp)
+                .padding(0.dp, 10.dp, 0.dp, 0.dp)
+        )
+    }
+}
+
+
+@Composable
+@Preview
+fun NavigatePreview(){
+    Header()
+}

app/src/main/java/com/example/android_programming/HomeScreen/BrandScrollBar/ItemFilterByBrand.kt

@@ -1,5 +0,0 @@
-package com.example.android_programming.HomeScreen.BrandScrollBar
-
-data class ItemFilterByBrand(
-    val imageId: Int,
-)

app/src/main/java/com/example/android_programming/HomeScreen/SneakerRecyclerView/CardSneaker.kt

@@ -1,72 +0,0 @@
-package com.example.android_programming.HomeScreen.SneakerRecyclerView
-
-import androidx.compose.foundation.Image
-import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.padding
-import androidx.compose.foundation.layout.size
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Button
-import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.clip
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.layout.ContentScale
-import androidx.compose.ui.res.painterResource
-import androidx.compose.ui.tooling.preview.Preview
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
-import com.example.android_programming.R
-import com.example.android_programming.SneakerItem
-
-@Composable
-fun CardSneaker(item: SneakerItem) {
-    Column(
-        horizontalAlignment = Alignment.CenterHorizontally,
-        modifier = Modifier
-            .padding(20.dp)
-            .clip(RoundedCornerShape(10.dp))
-            .background(Color.LightGray)
-    ) {
-        Image(
-            painter = painterResource(id = item.imageId),
-            contentDescription = "image",
-            contentScale = ContentScale.Crop,
-            modifier = Modifier
-                .padding(43.dp, 5.dp, 43.dp)
-                .size(70.dp)
-        )
-        Row(
-            horizontalArrangement = Arrangement.SpaceEvenly
-        ){
-            Column(
-                horizontalAlignment = Alignment.Start
-            ) {
-                Text(text = item.name)
-                Text(text = item.price.toString(), color = Color.Red)
-            }
-            Column(
-                horizontalAlignment = Alignment.CenterHorizontally
-            ) {
-                Button(
-                    onClick = { /*TODO*/ },
-                    modifier = Modifier
-                        .size(20.dp)
-                ) {
-                    Text(text = "+", fontSize = 16.sp)
-                }
-            }
-        }
-    }
-}
-
-
-@Composable
-@Preview
-fun CardSneakerPreview(){
-    CardSneaker(SneakerItem(R.drawable.sneaker, "Jordan", 159.99))
-}

app/src/main/java/com/example/android_programming/MainActivity.kt

@@ -3,13 +3,29 @@ package com.example.android_programming
 import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import com.example.android_programming.Header.Header
 import com.example.android_programming.Navigation.Navigate
 
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         setContent {
-            Navigate()
+            MainContent()
         }
     }
 }
+
+@Composable
+fun MainContent() {
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+    ) {
+        Header()
+        Navigate()
+    }
+}

app/src/main/java/com/example/android_programming/Navigation/NavController.kt

@@ -4,11 +4,13 @@ import androidx.compose.runtime.Composable
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
-import com.example.android_programming.HomeScreen.HomeScreen
+import com.example.android_programming.Screens.HomeScreen.HomeScreen
-import com.example.android_programming.LikeScreen.LikeScreen
+import com.example.android_programming.Screens.LikeScreen.LikeScreen
-import com.example.android_programming.Screens.OrderScreen
+import com.example.android_programming.Screens.OrderScreen.OrderScreen
-import com.example.android_programming.ProfileScreen.Profile.ProfileScreen
+import com.example.android_programming.Screens.ProfileScreen.Profile.Person
-import com.example.android_programming.ProfileScreen.SignIn.LoginScreen
+import com.example.android_programming.Screens.ProfileScreen.Profile.ProfileScreen
+import com.example.android_programming.Screens.ProfileScreen.SignIn.LoginScreen
+import com.example.android_programming.Screens.ProfileScreen.SignUp.SignUpScreen
 
 @Composable
 fun NavController(navController: NavHostController){
@@ -31,5 +33,11 @@ fun NavController(navController: NavHostController){
         composable(NavItem.SignIn.route){
             LoginScreen()
         }
+        composable(NavItem.SignUp.route){
+            SignUpScreen()
+        }
+        composable(NavItem.Person.route){
+            Person()
+        }
     }
 }

app/src/main/java/com/example/android_programming/Navigation/NavItem.kt

@@ -13,4 +13,6 @@ sealed class NavItem(val route: String, val icon: ImageVector?){
     object Order : NavItem("order", Icons.Default.ShoppingCart)
     object Profile : NavItem("profile", Icons.Default.Person)
     object SignIn : NavItem("login", null)
+    object SignUp : NavItem("signup", null)
+    object Person : NavItem("person", null)
 }

app/src/main/java/com/example/android_programming/Screens/HomeScreen/BrandScrollBar/ItemFilterByBrand.kt

@@ -0,0 +1,5 @@
+package com.example.android_programming.Screens.HomeScreen.BrandScrollBar
+
+data class ItemFilterByBrand(
+    val imageId: Int,
+)

app/src/main/java/com/example/android_programming/Screens/HomeScreen/BrandScrollBar/ItemRow.kt

@@ -1,4 +1,4 @@
-package com.example.android_programming.HomeScreen.BrandScrollBar
+package com.example.android_programming.Screens.HomeScreen.BrandScrollBar
 
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
@@ -12,18 +12,20 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.example.android_programming.R
 
+
 @Composable
 fun ItemRow(item: ItemFilterByBrand) {
     Column(
         horizontalAlignment = Alignment.CenterHorizontally,
         modifier = Modifier
             .clip(RoundedCornerShape(10.dp))
-            .background(Color.LightGray)
+            .background(colorResource(id = R.color.figma))
 
     ) {
         Image(

app/src/main/java/com/example/android_programming/Screens/HomeScreen/HomeScreen.kt

@@ -1,4 +1,4 @@
-package com.example.android_programming.HomeScreen
+package com.example.android_programming.Screens.HomeScreen
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
@@ -17,15 +17,18 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import com.example.android_programming.HomeScreen.BrandScrollBar.ItemFilterByBrand
+import androidx.navigation.NavHostController
-import com.example.android_programming.HomeScreen.BrandScrollBar.ItemRow
+import androidx.navigation.compose.rememberNavController
-import com.example.android_programming.HomeScreen.SearchField.SearchField
+import com.example.android_programming.Screens.HomeScreen.BrandScrollBar.ItemFilterByBrand
-import com.example.android_programming.HomeScreen.SneakerRecyclerView.CardSneaker
+import com.example.android_programming.Screens.HomeScreen.BrandScrollBar.ItemRow
+import com.example.android_programming.Screens.HomeScreen.SearchField.SearchField
+import com.example.android_programming.Screens.HomeScreen.SneakerRecyclerView.CardSneaker
 import com.example.android_programming.SneakerItem
 import com.example.android_programming.R
 
 @Composable
 fun HomeScreen() {
+    val navController = rememberNavController()
     Column(
         modifier = Modifier
             .fillMaxSize()
@@ -104,7 +107,7 @@ fun HomeScreen() {
                     ) {
                         for (item in chunkedListItem) {
                             // Создайте карточку для каждого элемента
-                            CardSneaker(item = item)
+                            CardSneaker(item = item, navController = navController)
                         }
                     }
                 }

app/src/main/java/com/example/android_programming/Screens/HomeScreen/SearchField/SearchField.kt

@@ -1,4 +1,4 @@
-package com.example.android_programming.HomeScreen.SearchField;
+package com.example.android_programming.Screens.HomeScreen.SearchField;
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
@@ -19,8 +19,10 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.dp
+import com.example.android_programming.R
 
 @Composable
 fun SearchField(
@@ -32,7 +34,7 @@ fun SearchField(
     Box(
         modifier = modifier
             .fillMaxWidth()
-            .background(Color.LightGray)
+            .background(colorResource(id = R.color.figma))
             .padding(horizontal = 16.dp, vertical = 8.dp)
     ) {
         Row(

app/src/main/java/com/example/android_programming/Screens/HomeScreen/SneakerRecyclerView/CardSneaker.kt

@@ -0,0 +1,95 @@
+package com.example.android_programming.Screens.HomeScreen.SneakerRecyclerView
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.layout.widthIn
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Button
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalConfiguration
+import androidx.compose.ui.res.colorResource
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.navigation.NavHostController
+import com.example.android_programming.R
+import com.example.android_programming.SneakerItem
+
+@Composable
+fun CardSneaker(item: SneakerItem, navController: NavHostController) {
+    val maxWidth = (LocalConfiguration.current.screenWidthDp / 2).dp
+
+    Box(
+        modifier = Modifier
+            .padding(4.dp)
+            .widthIn(maxWidth)
+            .clickable {
+                navController.navigate("signup")
+            }
+    ) {
+        Column(
+            horizontalAlignment = Alignment.CenterHorizontally,
+            modifier = Modifier
+                .clip(RoundedCornerShape(10.dp))
+                .background(colorResource(id = R.color.figma))
+                .widthIn(maxWidth)
+        ) {
+            Image(
+                painter = painterResource(id = item.imageId),
+                contentDescription = "image",
+                contentScale = ContentScale.FillWidth,
+                modifier = Modifier
+                    .size(100.dp)
+            )
+
+            Column {
+                Row(
+                    modifier = Modifier
+                        .widthIn(maxWidth),
+                    horizontalArrangement = Arrangement.SpaceBetween,
+                ) {
+                    Column(
+                        horizontalAlignment = Alignment.Start,
+                        modifier = Modifier
+                            .padding(10.dp, 0.dp)
+                    ) {
+                        Text(text = item.name)
+                        Text(text = item.price.toString(), color = Color.Red)
+                    }
+                    Column(
+                        modifier = Modifier
+                            .padding(10.dp)
+                    ) {
+                        Button(
+                            onClick = { /*TODO*/ },
+                            modifier = Modifier
+                                .size(40.dp, 20.dp)
+                        ) {
+                            Text(text = "+", fontSize = 4.sp)
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+@Composable
+@Preview
+fun CardSneakerPreview(){
+//    CardSneaker(SneakerItem(R.drawable.sneaker, "Air Jordan 1", 159.99))
+}

app/src/main/java/com/example/android_programming/Screens/LikeScreen/CardSneaker.kt

@@ -1,4 +1,4 @@
-package com.example.android_programming.LikeScreen
+package com.example.android_programming.Screens.LikeScreen
 
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
@@ -17,6 +17,7 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
@@ -31,14 +32,14 @@ fun CardSneakerLike(item: SneakerItem) {
             .fillMaxWidth()
             .padding(10.dp)
             .clip(RoundedCornerShape(10.dp))
-            .background(Color.LightGray),
+            .background(colorResource(id = R.color.figma)),
         verticalAlignment = Alignment.CenterVertically,
         horizontalArrangement = Arrangement.SpaceBetween
     ) {
         Image(
             painter = painterResource(id = item.imageId),
             contentDescription = "image",
-            contentScale = ContentScale.Crop,
+            contentScale = ContentScale.FillWidth,
             modifier = Modifier
                 .size(70.dp)
                 .padding(10.dp)
@@ -54,14 +55,13 @@ fun CardSneakerLike(item: SneakerItem) {
             Text(text = "${item.price} USD", color = Color.Red, fontSize = 16.sp)
         }
 
-        // Кнопка для удаления
         Button(
-            onClick = {  },
+            onClick = { /*TODO*/ },
             modifier = Modifier
-                .size(40.dp)
+                .size(40.dp, 20.dp)
-                .padding(10.dp)
+                .padding(end = 16.dp)
         ) {
-            Text(text = "X", fontSize = 16.sp)
+            Text(text = "+", fontSize = 4.sp)
         }
     }
 }

app/src/main/java/com/example/android_programming/Screens/LikeScreen/LikeScreen.kt

@@ -1,4 +1,4 @@
-package com.example.android_programming.LikeScreen;
+package com.example.android_programming.Screens.LikeScreen;
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement

app/src/main/java/com/example/android_programming/Screens/OrderScreen.kt

@@ -1,36 +0,0 @@
-package com.example.android_programming.Screens
-
-import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.fillMaxSize
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
-import androidx.compose.runtime.Composable
-import androidx.compose.ui.Alignment
-import androidx.compose.ui.Modifier
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.tooling.preview.Preview
-
-@Composable
-fun OrderScreen() {
-    Box(
-        modifier = Modifier
-            .fillMaxSize()
-            .background(Color.White),
-        contentAlignment = Alignment.Center
-    ) {
-        Text(
-            text = "Order",
-            fontSize = MaterialTheme.typography.h3.fontSize,
-            fontWeight = FontWeight.Bold,
-            color = Color.Black
-        )
-    }
-}
-
-@Composable
-@Preview
-fun OrderScreenPreview(){
-    OrderScreen()
-}

app/src/main/java/com/example/android_programming/Screens/OrderScreen/OrderScreen.kt

@@ -0,0 +1,245 @@
+package com.example.android_programming.Screens.OrderScreen
+
+import android.widget.ScrollView
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.BoxWithConstraints
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material.Button
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.Text
+import androidx.compose.material.TextField
+import androidx.compose.runtime.Composable
+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.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.colorResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.example.android_programming.R
+import com.example.android_programming.Screens.LikeScreen.CardSneakerLike
+import com.example.android_programming.SneakerItem
+
+
+@Composable
+fun OrderScreen() {
+
+    var address by remember { mutableStateOf("") }
+    var city by remember { mutableStateOf("") }
+    var number by remember { mutableStateOf("") }
+
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+            .background(Color.White)
+            .padding(16.dp),
+    ){
+        Row(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(colorResource(id = R.color.figma)),
+            horizontalArrangement = Arrangement.Center
+        ) {
+            Column(
+                modifier = Modifier
+                    .padding(16.dp),
+                horizontalAlignment = Alignment.CenterHorizontally
+
+            ) {
+                Text(text = "Delivery Address", fontSize = 24.sp, fontWeight = FontWeight.Bold)
+
+                Spacer(modifier = Modifier.height(16.dp))
+
+                TextField(
+                    value = address,
+                    onValueChange = { address = it },
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .height(50.dp)
+                        .border(1.dp, Color.Gray, RoundedCornerShape(4.dp)),
+                    singleLine = true,
+                    keyboardOptions = KeyboardOptions(
+                        keyboardType = KeyboardType.Text,
+                        imeAction = ImeAction.Next
+                    ),
+                    keyboardActions = KeyboardActions(
+                        onNext = {
+
+                        }
+                    ),
+                    placeholder = {
+                        Text(
+                            text = "Address",
+                            style = TextStyle(fontSize = 12.sp)
+                        )
+                    }
+                )
+
+                Spacer(modifier = Modifier.height(16.dp))
+
+                TextField(
+                    value = city,
+                    onValueChange = { city = it },
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .height(50.dp)
+                        .border(1.dp, Color.Gray, RoundedCornerShape(4.dp)),
+                    singleLine = true,
+                    keyboardOptions = KeyboardOptions(
+                        keyboardType = KeyboardType.Text,
+                        imeAction = ImeAction.Next
+                    ),
+                    keyboardActions = KeyboardActions(
+                        onNext = {
+
+                        }
+                    ),
+                    placeholder = {
+                        Text(
+                            text = "City",
+                            style = TextStyle(fontSize = 12.sp)
+                        )
+                    }
+                )
+
+                Spacer(modifier = Modifier.height(16.dp))
+
+                TextField(
+                    value = number,
+                    onValueChange = { number = it },
+                    modifier = Modifier
+                        .fillMaxWidth()
+                        .height(50.dp)
+                        .border(1.dp, Color.Gray, RoundedCornerShape(4.dp)),
+                    singleLine = true,
+                    keyboardOptions = KeyboardOptions(
+                        keyboardType = KeyboardType.Text,
+                        imeAction = ImeAction.Next
+                    ),
+                    keyboardActions = KeyboardActions(
+                        onNext = {
+
+                        }
+                    ),
+                    placeholder = {
+                        Text(
+                            text = "Number",
+                            style = TextStyle(fontSize = 12.sp)
+                        )
+                    }
+                )
+            }
+        }
+        Row {
+            LazyColumn {
+                itemsIndexed(
+                    listOf(
+                        SneakerItem(R.drawable.sneaker, "Jordan", 159.99),
+                    )
+                ){_, item->
+                    CardSneakerLike(item = item)
+                }
+            }
+        }
+        Row(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(colorResource(id = R.color.figma)),
+            horizontalArrangement = Arrangement.SpaceBetween
+        ){
+            Row(
+                modifier = Modifier.weight(1f),
+                horizontalArrangement = Arrangement.Start
+            ){
+                Text(text = "Sub total", fontSize = 15.sp)
+            }
+            Row(
+                modifier = Modifier.weight(1f),
+                horizontalArrangement = Arrangement.End
+            ){
+                Text(text = "319.99 $", fontSize = 15.sp)
+            }
+        }
+        Row(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(colorResource(id = R.color.figma)),
+            horizontalArrangement = Arrangement.SpaceBetween
+        ){
+            Row(
+                modifier = Modifier.weight(1f),
+                horizontalArrangement = Arrangement.Start
+            ){
+                Text(text = "Taxes", fontSize = 15.sp)
+            }
+            Row(
+                modifier = Modifier.weight(1f),
+                horizontalArrangement = Arrangement.End
+            ){
+                Text(text = "180 $", fontSize = 15.sp)
+            }
+        }
+        Row(
+            modifier = Modifier
+                .fillMaxWidth()
+                .background(colorResource(id = R.color.figma)),
+            horizontalArrangement = Arrangement.SpaceBetween
+        ){
+            Row(
+                modifier = Modifier.weight(1f),
+                horizontalArrangement = Arrangement.Start
+            ){
+                Text(text = "Total", fontSize = 15.sp)
+            }
+            Row(
+                modifier = Modifier.weight(1f),
+                horizontalArrangement = Arrangement.End
+            ){
+                Text(text = "1900 $", fontSize = 15.sp)
+            }
+        }
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        Button(
+            onClick = {
+
+            },
+            modifier = Modifier
+                .fillMaxWidth()
+                .clip(RoundedCornerShape(20.dp))
+        ) {
+            Text("Confirm order")
+        }
+    }
+}
+
+@Composable
+@Preview
+fun OrderScreenPreview(){
+    OrderScreen()
+}

app/src/main/java/com/example/android_programming/Screens/ProfileScreen/Profile/Profile.kt

@@ -0,0 +1,74 @@
+package com.example.android_programming.Screens.ProfileScreen.Profile
+
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.shape.CircleShape
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.example.android_programming.R
+
+@Composable
+fun Person() {
+    Column(
+        modifier = Modifier
+            .background(Color.White)
+            .fillMaxSize()
+            .padding(16.dp),
+        verticalArrangement = Arrangement.Top,
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        Image(
+            contentScale = ContentScale.FillBounds,
+            painter = painterResource(id = R.drawable.shailushai),
+            contentDescription = null,
+            modifier = Modifier
+                .size(120.dp)
+                .clip(CircleShape)
+                .border(2.dp, Color.Gray, CircleShape)
+                .background(Color.Gray)
+                .padding(8.dp)
+        )
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        Text(
+            text = "Шайлушай",
+            fontSize = 18.sp,
+            fontWeight = FontWeight.Bold
+        )
+
+        Text(
+            text = "shailushai@example.com",
+            fontSize = 16.sp,
+            color = Color.Gray
+        )
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+    }
+}
+
+
+@Preview
+@Composable
+fun PersonPreview(){
+    Person()
+}

app/src/main/java/com/example/android_programming/Screens/ProfileScreen/Profile/ProfileScreen.kt

@@ -1,24 +1,28 @@
-package com.example.android_programming.ProfileScreen.Profile;
+package com.example.android_programming.Screens.ProfileScreen.Profile;
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredSize
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Button
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable;
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.navigation.NavHostController
 import androidx.navigation.compose.rememberNavController
 import com.example.android_programming.Navigation.NavController
-import com.example.android_programming.ProfileScreen.SignIn.LoginScreen
+import com.example.android_programming.Screens.ProfileScreen.SignIn.LoginScreen
 
 @Composable
 fun ProfileScreen(navController: NavHostController) {
@@ -30,23 +34,45 @@ fun ProfileScreen(navController: NavHostController) {
         horizontalAlignment = Alignment.CenterHorizontally
     ){
         Row(
-            modifier = Modifier.padding(vertical = 16.dp)
+            modifier = Modifier
+                .clip(RoundedCornerShape(20.dp))
+        ){
+            Button(
+                onClick = {
+                    navController.navigate("person")
+                },
+                modifier = Modifier
+                    .requiredSize(300.dp, 40.dp)
+            ) {
+                Text(text = "Profile")
+            }
+        }
+        Spacer(modifier = Modifier.height(16.dp))
+        Row(
+            modifier = Modifier
+                .clip(RoundedCornerShape(20.dp))
         ){
             Button(
                 onClick = {
                     navController.navigate("login")
                 },
                 modifier = Modifier
-                    .requiredSize(100.dp, 40.dp)
+                    .requiredSize(300.dp, 40.dp)
             ) {
                 Text(text = "Sign In")
             }
         }
-        Row{
+        Spacer(modifier = Modifier.height(16.dp))
+        Row(
+            modifier = Modifier
+                .clip(RoundedCornerShape(20.dp))
+        ){
             Button(
-                onClick = { /*TODO*/ },
+                onClick = {
+                    navController.navigate("signup")
+                },
                 modifier = Modifier
-                    .requiredSize(100.dp, 40.dp)
+                    .requiredSize(300.dp, 40.dp)
                 ) {
                 Text(text = "Sign Up")
             }

app/src/main/java/com/example/android_programming/Screens/ProfileScreen/SignIn/SignInScreen.kt

@@ -1,4 +1,4 @@
-package com.example.android_programming.ProfileScreen.SignIn
+package com.example.android_programming.Screens.ProfileScreen.SignIn
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.border
@@ -12,8 +12,10 @@ import androidx.compose.material.Text
 import androidx.compose.runtime.*
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.input.pointer.PointerIcon.Companion.Text
+import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.semantics.SemanticsProperties.Text
 import androidx.compose.ui.text.Placeholder
 import androidx.compose.ui.text.font.FontWeight
@@ -25,17 +27,19 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.navigation.NavController
 import androidx.navigation.NavHostController
+import com.example.android_programming.R
 import androidx.compose.material.Text as Text1
 
 @Composable
-fun LoginScreen(navController : NavHostController) {
+fun LoginScreen() {
     var username by remember { mutableStateOf("") }
     var password by remember { mutableStateOf("") }
 
     Column(
         modifier = Modifier
             .fillMaxSize()
-            .background(Color.White)
+            .clip(RoundedCornerShape(25.dp))
+            .background(colorResource(id = R.color.figma))
             .padding(15.dp, 0.dp)
         ,
         verticalArrangement = Arrangement.Center,
@@ -93,9 +97,12 @@ fun LoginScreen(navController : NavHostController) {
 
         Button(
             onClick = {
-                navController.navigate("login")
+
             },
-            modifier = Modifier.fillMaxWidth()
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(8.dp, 0.dp, 8.dp, 0.dp)
+                .clip(RoundedCornerShape(20.dp))
         ) {
             Text1("Sign In")
         }

app/src/main/java/com/example/android_programming/Screens/ProfileScreen/SignUp/SignUpScreen.kt

@@ -0,0 +1,222 @@
+package com.example.android_programming.Screens.ProfileScreen.SignUp
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.text.BasicTextField
+import androidx.compose.foundation.text.KeyboardActions
+import androidx.compose.foundation.text.KeyboardOptions
+import androidx.compose.material.Button
+import androidx.compose.material.DropdownMenu
+import androidx.compose.material.Text
+import androidx.compose.material.TextField
+import androidx.compose.runtime.Composable
+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.draw.clip
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.res.colorResource
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.input.ImeAction
+import androidx.compose.ui.text.input.KeyboardType
+import androidx.compose.ui.text.input.PasswordVisualTransformation
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.example.android_programming.Screens.ProfileScreen.SignIn.LoginScreen
+import com.example.android_programming.R
+
+@Composable
+fun SignUpScreen() {
+    var username by remember { mutableStateOf("") }
+    var password by remember { mutableStateOf("") }
+    var sex by remember { mutableStateOf("") }
+    var name by remember { mutableStateOf("") }
+    var surname by remember { mutableStateOf("") }
+
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+            .clip(RoundedCornerShape(25.dp))
+            .background(colorResource(id = R.color.figma))
+            .padding(15.dp, 0.dp)
+        ,
+        verticalArrangement = Arrangement.Center,
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        Text(text = "Sign Up", fontSize = 24.sp, fontWeight = FontWeight.Bold)
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        TextField(
+            value = username,
+            onValueChange = { username = it },
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(50.dp)
+                .border(1.dp, Color.Gray, RoundedCornerShape(4.dp))
+                .padding(0.dp),
+            singleLine = true,
+            keyboardOptions = KeyboardOptions(
+                keyboardType = KeyboardType.Text,
+                imeAction = ImeAction.Next
+            ),
+            keyboardActions = KeyboardActions(
+                onNext = {
+
+                }
+            ),
+            placeholder = {
+                Text(
+                    text = "Username",
+                    style = TextStyle(fontSize = 12.sp)
+                )
+            }
+        )
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        TextField(
+            value = name,
+            onValueChange = { name = it },
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(50.dp)
+                .border(1.dp, Color.Gray, RoundedCornerShape(4.dp)),
+            singleLine = true,
+            keyboardOptions = KeyboardOptions(
+                keyboardType = KeyboardType.Text,
+                imeAction = ImeAction.Next
+            ),
+            keyboardActions = KeyboardActions(
+                onNext = {
+
+                }
+            ),
+            placeholder = {
+                Text(
+                    text = "Name",
+                    style = TextStyle(fontSize = 12.sp)
+                )
+            }
+        )
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        TextField(
+            value = surname,
+            onValueChange = { surname = it },
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(50.dp)
+                .border(1.dp, Color.Gray, RoundedCornerShape(4.dp))
+                .padding(0.dp),
+            singleLine = true,
+            keyboardOptions = KeyboardOptions(
+                keyboardType = KeyboardType.Text,
+                imeAction = ImeAction.Next
+            ),
+            keyboardActions = KeyboardActions(
+                onNext = {
+
+                }
+            ),
+            placeholder = {
+                Text(
+                    text = "Surname",
+                    style = TextStyle(fontSize = 12.sp)
+                )
+            }
+        )
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        TextField(
+            value = sex,
+            onValueChange = { sex = it },
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(50.dp)
+                .border(1.dp, Color.Gray, RoundedCornerShape(4.dp))
+                .padding(0.dp),
+            singleLine = true,
+            keyboardOptions = KeyboardOptions(
+                keyboardType = KeyboardType.Text,
+                imeAction = ImeAction.Next
+            ),
+            keyboardActions = KeyboardActions(
+                onNext = {
+
+                }
+            ),
+            placeholder = {
+                Text(
+                    text = "Sex",
+                    style = TextStyle(fontSize = 12.sp)
+                )
+            }
+        )
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        TextField(
+            value = password,
+            onValueChange = { password = it },
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(50.dp)
+                .border(1.dp, Color.Gray, RoundedCornerShape(4.dp))
+                .padding(0.dp),
+            singleLine = true,
+            visualTransformation = PasswordVisualTransformation(),
+            keyboardOptions = KeyboardOptions(
+                keyboardType = KeyboardType.Text,
+                imeAction = ImeAction.Next
+            ),
+
+            keyboardActions = KeyboardActions(
+                onNext = {
+
+                }
+            ),
+            placeholder = {
+                Text(
+                    text = "Password",
+                    style = TextStyle(fontSize = 12.sp)
+                )
+            }
+        )
+
+        Spacer(modifier = Modifier.height(16.dp))
+
+        Button(
+            onClick = {
+
+            },
+            modifier = Modifier
+                .fillMaxWidth()
+                .clip(RoundedCornerShape(20.dp))
+        ) {
+            Text("Sign Up")
+        }
+    }
+}
+
+
+@Composable
+@Preview
+fun SignUpScreenPreview(){
+    SignUpScreen()
+}

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

@@ -7,4 +7,5 @@
     <color name="teal_700">#FF018786</color>
     <color name="black">#FF000000</color>
     <color name="white">#FFFFFFFF</color>
+    <color name="figma">#F4F4F4</color>
 </resources>