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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 462 KiB

View File

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