Feature: dream of becoming Shailushai

This commit is contained in:
ArtemEmelyanov 2023-10-08 18:06:10 +04:00
parent a9b847eee0
commit 2438628a56
23 changed files with 786 additions and 150 deletions
app
build.gradle.kts
src/main
java/com/example/android_programming
res

@ -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")

@ -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()
}

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

@ -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))
}

@ -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()
}
}

@ -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.LikeScreen.LikeScreen
import com.example.android_programming.Screens.OrderScreen
import com.example.android_programming.ProfileScreen.Profile.ProfileScreen
import com.example.android_programming.ProfileScreen.SignIn.LoginScreen
import com.example.android_programming.Screens.HomeScreen.HomeScreen
import com.example.android_programming.Screens.LikeScreen.LikeScreen
import com.example.android_programming.Screens.OrderScreen.OrderScreen
import com.example.android_programming.Screens.ProfileScreen.Profile.Person
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()
}
}
}

@ -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)
}

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

@ -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(

@ -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 com.example.android_programming.HomeScreen.BrandScrollBar.ItemRow
import com.example.android_programming.HomeScreen.SearchField.SearchField
import com.example.android_programming.HomeScreen.SneakerRecyclerView.CardSneaker
import androidx.navigation.NavHostController
import androidx.navigation.compose.rememberNavController
import com.example.android_programming.Screens.HomeScreen.BrandScrollBar.ItemFilterByBrand
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)
}
}
}

@ -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(

@ -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))
}

@ -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)
.padding(10.dp)
.size(40.dp, 20.dp)
.padding(end = 16.dp)
) {
Text(text = "X", fontSize = 16.sp)
Text(text = "+", fontSize = 4.sp)
}
}
}

@ -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

@ -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()
}

@ -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()
}

@ -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()
}

@ -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")
}

@ -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")
}

@ -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()
}

Binary file not shown.

After

(image error) Size: 2.6 KiB

Binary file not shown.

After

(image error) Size: 462 KiB

@ -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>