diff --git a/src/.idea/deploymentTargetDropDown.xml b/src/.idea/deploymentTargetDropDown.xml index 06a90ad..ff3b5aa 100644 --- a/src/.idea/deploymentTargetDropDown.xml +++ b/src/.idea/deploymentTargetDropDown.xml @@ -7,11 +7,11 @@ - + - + \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/MainActivity.kt b/src/app/src/main/java/fr/iut/alldev/allin/MainActivity.kt index ede8137..51bf842 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/MainActivity.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/MainActivity.kt @@ -4,7 +4,7 @@ import android.os.Bundle import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import com.google.accompanist.systemuicontroller.rememberSystemUiController -import fr.iut.alldev.allin.ui.navigation.drawer.AllInDrawer +import fr.iut.alldev.allin.ui.navigation.AllInNavHost import fr.iut.alldev.allin.ui.theme.AllInTheme class MainActivity : ComponentActivity() { @@ -16,11 +16,11 @@ class MainActivity : ComponentActivity() { AllInTheme{ systemUiController.setStatusBarColor(AllInTheme.colors.allIn_Dark) - systemUiController.setNavigationBarColor(AllInTheme.colors.allIn_White) + systemUiController.setNavigationBarColor(AllInTheme.themeColors.main_surface) systemUiController.isNavigationBarVisible = false systemUiController.isStatusBarVisible = false - AllInDrawer() + AllInNavHost() } } } diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ext/Modifier.kt b/src/app/src/main/java/fr/iut/alldev/allin/ext/Modifier.kt new file mode 100644 index 0000000..34f1b70 --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ext/Modifier.kt @@ -0,0 +1,94 @@ +package fr.iut.alldev.allin.ext + +import android.graphics.BlurMaskFilter +import android.graphics.Shader +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.drawBehind +import androidx.compose.ui.geometry.Offset +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.LinearGradientShader +import androidx.compose.ui.graphics.Paint +import androidx.compose.ui.graphics.drawscope.drawIntoCanvas +import androidx.compose.ui.graphics.toArgb +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp + +@Composable +fun Modifier.shadow( + color: Color = Color.Black, + offsetX: Dp = 0.dp, + offsetY: Dp = 0.dp, + blurRadius: Dp = 0.dp, + alpha: Float = 1f, + cornerRadius: Dp = 0.dp +) = then( + drawBehind { + drawIntoCanvas { canvas -> + val paint = Paint() + val frameworkPaint = paint.asFrameworkPaint() + if (blurRadius != 0.dp) { + frameworkPaint.maskFilter = + BlurMaskFilter(blurRadius.toPx(), BlurMaskFilter.Blur.NORMAL) + } + frameworkPaint.color = color.toArgb() + frameworkPaint.alpha = (255*alpha).toInt() + val leftPixel = offsetX.toPx() + val topPixel = offsetY.toPx() + val rightPixel = size.width + topPixel + val bottomPixel = size.height + leftPixel + + canvas.drawRoundRect( + left = leftPixel, + top = topPixel, + right = rightPixel, + bottom = bottomPixel, + paint = paint, + radiusX = cornerRadius.toPx(), + radiusY = cornerRadius.toPx() + ) + } + } +) + +fun Modifier.shadow( + colors: List = listOf(Color.Black), + offsetX: Dp = 0.dp, + offsetY: Dp = 0.dp, + blurRadius: Dp = 0.dp, + cornerRadius: Dp = 0.dp, + alpha: Float = 1f +) = then( + drawBehind { + drawIntoCanvas { canvas -> + val shader: Shader = + LinearGradientShader( + Offset(0f, 0f), + Offset(size.width, 0f), + colors + ) + val paint = Paint() + val frameworkPaint = paint.asFrameworkPaint() + if (blurRadius != 0.dp) { + frameworkPaint.maskFilter = + BlurMaskFilter(blurRadius.toPx(), BlurMaskFilter.Blur.NORMAL) + } + frameworkPaint.shader = shader + frameworkPaint.alpha = (255*alpha).toInt() + val leftPixel = offsetX.toPx() + val topPixel = offsetY.toPx() + val rightPixel = size.width + topPixel + val bottomPixel = size.height + leftPixel + + canvas.drawRoundRect( + left = leftPixel, + top = topPixel, + right = rightPixel, + bottom = bottomPixel, + paint = paint, + radiusX = cornerRadius.toPx(), + radiusY = cornerRadius.toPx() + ) + } + } +) \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/home.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/bet/betScreen.kt similarity index 64% rename from src/app/src/main/java/fr/iut/alldev/allin/ui/home/home.kt rename to src/app/src/main/java/fr/iut/alldev/allin/ui/bet/betScreen.kt index b0db113..965e4e6 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/home.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/bet/betScreen.kt @@ -1,7 +1,8 @@ -package fr.iut.alldev.allin.ui.home +package fr.iut.alldev.allin.ui.bet import androidx.compose.foundation.ExperimentalFoundationApi import androidx.compose.foundation.background +import androidx.compose.foundation.isSystemInDarkTheme import androidx.compose.foundation.layout.* import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyRow @@ -13,23 +14,45 @@ import androidx.compose.ui.graphics.Color import androidx.compose.ui.res.stringResource import androidx.compose.ui.unit.dp import fr.iut.alldev.allin.R +import fr.iut.alldev.allin.ext.shadow +import fr.iut.alldev.allin.ui.bet.components.BetScreenCard +import fr.iut.alldev.allin.ui.bet.components.BetScreenPopularCard import fr.iut.alldev.allin.ui.core.AllInChip -import fr.iut.alldev.allin.ui.home.components.HomeBetCard -import fr.iut.alldev.allin.ui.home.components.HomePopularCards import fr.iut.alldev.allin.ui.theme.AllInTheme @OptIn(ExperimentalFoundationApi::class) @Composable -fun Home(){ +fun BetScreen(){ val horizontalPadding = 23.dp LazyColumn{ item { - HomePopularCards( + BetScreenPopularCard( modifier = Modifier + .fillMaxWidth() .padding(horizontal = horizontalPadding) - .padding(top = 23.dp), + .padding(top = 23.dp, bottom = 10.dp) + .let { + if(isSystemInDarkTheme()){ + it.shadow( + colors = listOf( + AllInTheme.colors.allIn_Pink, + AllInTheme.colors.allIn_Blue + ), + blurRadius = 10.dp, + alpha = .5f, + cornerRadius = 15.dp + ) + }else{ + it.shadow( + color = Color.Black, + blurRadius = 10.dp, + alpha = .3f, + cornerRadius = 15.dp + ) + } + }, nbPlayers = 12, points = 2.35f, pointUnit = "k", @@ -41,11 +64,11 @@ fun Home(){ modifier = Modifier .background( Brush.verticalGradient( - 0.5f to AllInTheme.colors.allIn_White, + 0.5f to AllInTheme.themeColors.main_surface, 1f to Color.Transparent ) ) - .padding(vertical = 19.dp), + .padding(top = 5.dp, bottom = 19.dp), horizontalArrangement = Arrangement.spacedBy(9.dp) ) { item { @@ -64,7 +87,7 @@ fun Home(){ } } items(5){ - HomeBetCard( + BetScreenCard( creator = "Lucas", category = "Études", title = "Emre va réussir son TP de CI/CD mercredi?", diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homeBetCard.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/bet/components/betScreenCard.kt similarity index 78% rename from src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homeBetCard.kt rename to src/app/src/main/java/fr/iut/alldev/allin/ui/bet/components/betScreenCard.kt index bb9a6dc..16f3417 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homeBetCard.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/bet/components/betScreenCard.kt @@ -1,5 +1,6 @@ -package fr.iut.alldev.allin.ui.home.components +package fr.iut.alldev.allin.ui.bet.components +import android.content.res.Configuration import androidx.compose.foundation.background import androidx.compose.foundation.layout.* import androidx.compose.material.ripple.LocalRippleTheme @@ -7,6 +8,7 @@ import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.CompositionLocalProvider +import androidx.compose.runtime.remember import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment.Companion.CenterEnd import androidx.compose.ui.Alignment.Companion.CenterHorizontally @@ -28,7 +30,7 @@ import fr.iut.alldev.allin.ui.theme.AllInRippleTheme import fr.iut.alldev.allin.ui.theme.AllInTheme @Composable -fun HomeBetCard( +fun BetScreenCard( creator: String, category: String, title: String, @@ -40,7 +42,7 @@ fun HomeBetCard( ) { AllInCard( modifier = modifier, - radius = 7 + radius = 16.dp ){ Column(Modifier.fillMaxWidth()) { Row( @@ -50,22 +52,26 @@ fun HomeBetCard( HighlightedText( text = stringResource(id = R.string.Proposed_by_x, creator), query = creator, - highlightStyle = SpanStyle(fontWeight = FontWeight.Bold, color = AllInTheme.colors.allIn_Dark), + highlightStyle = SpanStyle( + fontWeight = FontWeight.Bold, + color = AllInTheme.themeColors.on_main_surface + ), fontSize = 12.sp, style = AllInTheme.typography.s, - color = AllInTheme.colors.allIn_LightGrey300 + color = AllInTheme.themeColors.on_background_2 ) } Column(Modifier.padding(horizontal = 19.dp, vertical = 11.dp)) { Text( text = category, fontSize = 15.sp, - color = AllInTheme.colors.allIn_LightGrey300, + color = AllInTheme.themeColors.on_background_2, style = AllInTheme.typography.m ) Text( text = title, fontSize = 20.sp, + color = AllInTheme.themeColors.on_main_surface, style = AllInTheme.typography.h1 ) Spacer(modifier = Modifier.height(11.dp)) @@ -76,22 +82,22 @@ fun HomeBetCard( text = stringResource(id = R.string.Starting), fontSize = 15.sp, style = AllInTheme.typography.m, - color = AllInTheme.colors.allIn_LightGrey300, + color = AllInTheme.themeColors.on_background_2 ) - HomeBetCardDateTimeChip( + DateTimeChip( text = date, modifier = Modifier.padding(horizontal = 8.dp) ) - HomeBetCardDateTimeChip(time) + DateTimeChip(time) } } HorizontalDivider( thickness = 1.dp, - color = AllInTheme.colors.allIn_LightGrey100 + color = AllInTheme.themeColors.border ) Column( Modifier - .background(AllInTheme.colors.allIn_LightGrey50) + .background(AllInTheme.themeColors.background_2) ) { Row( modifier = Modifier @@ -99,16 +105,19 @@ fun HomeBetCard( .padding(7.dp), verticalAlignment = Alignment.CenterVertically ){ - val nRepeat = if (nbPlayer > 5) 5 else nbPlayer + val nRepeat = remember{ + if (nbPlayer > 5) 5 else nbPlayer + } + Box( - Modifier.width((nRepeat*15).dp) + Modifier.width((nRepeat*17).dp) ){ repeat(nRepeat) { ProfilePicture( - size = 30.dp, + size = 35.dp, modifier = Modifier .align(CenterEnd) - .offset(x = (it * -15).dp) + .offset(x = (it * -17).dp) .zIndex(-it.toFloat()) ) } @@ -121,7 +130,7 @@ fun HomeBetCard( nbPlayer ), style = AllInTheme.typography.m, - color = AllInTheme.colors.allIn_LightGrey300 + color = AllInTheme.themeColors.on_background_2 ) } CompositionLocalProvider( @@ -139,10 +148,11 @@ fun HomeBetCard( } @Preview +@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES) @Composable -private fun HomeBetCardPreview() { +private fun BetScreenCardPreview() { AllInTheme { - HomeBetCard( + BetScreenCard( creator = "Lucas", category = "Études", title = "Emre va réussir son TP de CI/CD mercredi?", diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/bet/components/betScreenPopularCard.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/bet/components/betScreenPopularCard.kt new file mode 100644 index 0000000..334add5 --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/bet/components/betScreenPopularCard.kt @@ -0,0 +1,131 @@ +package fr.iut.alldev.allin.ui.bet.components + +import androidx.compose.foundation.layout.* +import androidx.compose.material3.Icon +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.res.pluralStringResource +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.SpanStyle +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 fr.iut.alldev.allin.R +import fr.iut.alldev.allin.ui.core.AllInCard +import fr.iut.alldev.allin.ui.core.HighlightedText +import fr.iut.alldev.allin.ui.theme.AllInTheme +import kotlin.math.ceil + +@Composable +fun BetScreenPopularCard( + nbPlayers: Int, + points: Float, + pointUnit: String, + title: String, + modifier: Modifier = Modifier +) { + AllInCard( + modifier = modifier, + backgroundColor = AllInTheme.colors.allIn_Dark, + borderWidth = 2.dp, + borderBrush = AllInTheme.colors.allIn_MainGradient + ) { + Column(modifier = Modifier.padding(13.dp)) { + Row(verticalAlignment = Alignment.CenterVertically) { + Icon( + painter = painterResource(id = R.drawable.allin_fire), + modifier = Modifier.size(15.dp), + contentDescription = null, + tint = AllInTheme.colors.allIn_Pink + ) + Spacer(modifier = Modifier.width(3.dp)) + Text( + text = stringResource(id = R.string.Popular), + color = AllInTheme.colors.allIn_Pink, + fontSize = 17.sp, + style = AllInTheme.typography.h2 + ) + } + Text( + text = title, + color = AllInTheme.colors.white, + fontSize = 20.sp, + style = AllInTheme.typography.h1, + modifier = Modifier.padding(vertical = 22.dp) + ) + Row(modifier = Modifier.align(alignment = Alignment.CenterHorizontally)) { + HighlightedText( + text = pluralStringResource( + id = R.plurals.n_players, + nbPlayers, + nbPlayers + ), + query = nbPlayers.toString(), + highlightStyle = SpanStyle( + fontWeight = FontWeight.Bold, + color = AllInTheme.colors.allIn_Pink + ), + color = AllInTheme.colors.white, + style = AllInTheme.typography.r, + fontSize = 15.sp + ) + Text( + text = " - ", + color = AllInTheme.colors.white, + style = AllInTheme.typography.r, + fontSize = 15.sp + ) + val pointsText = if (points % 1 == 0f){ + stringResource(id = R.string.int_and_unit, points.toInt(), pointUnit) + }else{ + stringResource(id = R.string.float_and_unit, points, pointUnit) + } + HighlightedText( + text = pluralStringResource( + id = R.plurals.n_points_at_stake, + if(pointUnit.isEmpty()) ceil(points).toInt() else 2, + pointsText + ), + query = pointsText, + highlightStyle = SpanStyle( + fontWeight = FontWeight.Bold, + color = AllInTheme.colors.allIn_Pink + ), + color = AllInTheme.colors.white, + style = AllInTheme.typography.r, + fontSize = 15.sp + ) + } + } + } +} + +@Preview +@Composable +private fun BetScreenPopularCardPreview() { + AllInTheme { + BetScreenPopularCard( + nbPlayers = 12, + points = 2.35f, + pointUnit = "k", + title = "Emre va réussir son TP de CI/CD mercredi?" + ) + } +} + +@Preview +@Composable +private fun BetScreenPopularCardSingularPreview() { + AllInTheme { + BetScreenPopularCard( + nbPlayers = 1, + points = 1.0f, + pointUnit = "", + title = "Emre va réussir son TP de CI/CD mercredi?" + ) + } +} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInButton.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInButton.kt new file mode 100644 index 0000000..8dcb31d --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInButton.kt @@ -0,0 +1,49 @@ +package fr.iut.alldev.allin.ui.core + +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import fr.iut.alldev.allin.ui.theme.AllInTheme + +@Composable +fun AllInButton( + color: Color, + text: String, + textColor: Color, + modifier: Modifier = Modifier, + onClick: ()->Unit +) { + AllInCard(onClick = onClick, modifier = modifier, radius = 50.dp, backgroundColor = color) { + Text( + text = text, + textAlign = TextAlign.Center, + style = AllInTheme.typography.h2, + color = textColor, + fontSize = 20.sp, + modifier = Modifier + .padding(vertical = 15.dp) + .fillMaxWidth(), + ) + } +} + +@Preview +@Composable +private fun AllInButtonPreview() { + AllInTheme { + AllInButton( + color = AllInTheme.colors.allIn_LoginPurple, + text = "Connexion", + textColor = Color.White + ) { + + } + } +} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInCard.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInCard.kt index 6740a52..238c8dc 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInCard.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInCard.kt @@ -1,50 +1,67 @@ package fr.iut.alldev.allin.ui.core import androidx.compose.foundation.BorderStroke +import androidx.compose.foundation.background import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.shape.AbsoluteRoundedCornerShape import androidx.compose.material3.Card import androidx.compose.material3.CardDefaults import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Color import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.dp import fr.iut.alldev.allin.ui.theme.AllInTheme +import racra.compose.smooth_corner_rect_library.AbsoluteSmoothCornerShape @OptIn(ExperimentalMaterial3Api::class) @Composable fun AllInCard( modifier: Modifier = Modifier, onClick: (()->Unit)? = null, - radius: Int = 15, - backgroundColor: Color = AllInTheme.colors.white, + radius: Dp = 15.dp, + backgroundColor: Color = AllInTheme.themeColors.background, + backgroundBrush: Brush? = null, borderWidth: Dp? = null, - borderColor: Color = AllInTheme.colors.allIn_LightGrey100, + borderColor: Color = AllInTheme.themeColors.border, borderBrush: Brush? = null, content: @Composable ()->Unit ) { + + val cardShape = AbsoluteSmoothCornerShape(radius, smoothnessAsPercent = 100) + val cardModifier = modifier.fillMaxWidth() + .run { + backgroundBrush?.let{ + this.clip(cardShape).background(it) + } ?: this + } + val cardBorders = borderWidth?.let{ + width -> borderBrush?.let{BorderStroke(width, it)} + ?: BorderStroke(width, borderColor) + } + val cardColors = CardDefaults.cardColors( + containerColor = if(backgroundBrush!=null) Color.Transparent else backgroundColor + ) onClick?.let { Card( - modifier = modifier.fillMaxWidth(), + modifier = cardModifier, onClick = it, - shape = AbsoluteRoundedCornerShape(radius), - border = borderWidth?.let{ width -> borderBrush?.let{BorderStroke(width, it)} ?: BorderStroke(width, borderColor)}, - colors = CardDefaults.cardColors(containerColor = backgroundColor) + shape = cardShape, + border = cardBorders, + colors = cardColors, ) { content() } } ?: run { Card( - modifier = modifier.fillMaxWidth(), - shape = AbsoluteRoundedCornerShape(radius), - border = borderWidth?.let{ width -> borderBrush?.let{BorderStroke(width, it)} ?: BorderStroke(width, borderColor)}, - colors = CardDefaults.cardColors(containerColor = backgroundColor) + modifier = cardModifier, + shape = cardShape, + border = cardBorders, + colors = cardColors ) { content() } } - } - diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInChip.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInChip.kt index 94726d2..57fd70b 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInChip.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInChip.kt @@ -1,8 +1,8 @@ package fr.iut.alldev.allin.ui.core +import android.content.res.Configuration import androidx.compose.foundation.BorderStroke import androidx.compose.foundation.layout.padding -import androidx.compose.foundation.layout.wrapContentSize import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material3.Card import androidx.compose.material3.CardDefaults @@ -24,12 +24,12 @@ fun AllInChip( modifier: Modifier = Modifier ) { Card( - modifier = modifier.wrapContentSize(), + modifier = modifier, shape = RoundedCornerShape(50), onClick = onClick, - border = if(!isSelected) BorderStroke(1.dp, AllInTheme.colors.allIn_LightGrey100) else null, - colors = CardDefaults.cardColors(containerColor = with(AllInTheme.colors){ - if(isSelected) allIn_Purple else white + border = if(!isSelected) BorderStroke(1.dp, AllInTheme.themeColors.border) else null, + colors = CardDefaults.cardColors(containerColor = with(AllInTheme){ + if(isSelected) colors.allIn_Purple else themeColors.background }) ) { Text( @@ -39,8 +39,8 @@ fun AllInChip( style = with(AllInTheme.typography) { if (isSelected) h1 else r }, - color = with(AllInTheme.colors){ - if(isSelected) white else allIn_LightGrey300 + color = with(AllInTheme){ + if(isSelected) colors.white else themeColors.on_background_2 } ) @@ -48,6 +48,7 @@ fun AllInChip( } @Preview +@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES) @Composable private fun AllInChipPreviewUnselected() { AllInTheme { diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInGradientButton.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInGradientButton.kt new file mode 100644 index 0000000..65f081f --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInGradientButton.kt @@ -0,0 +1,58 @@ +package fr.iut.alldev.allin.ui.core + +import androidx.compose.foundation.layout.fillMaxWidth +import androidx.compose.foundation.layout.padding +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Modifier +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import fr.iut.alldev.allin.ext.shadow +import fr.iut.alldev.allin.ui.theme.AllInTheme + +@Composable +fun AllInGradientButton( + text: String, + modifier: Modifier = Modifier, + onClick: ()->Unit +) { + AllInCard( + onClick = onClick, + modifier = modifier.shadow( + colors = listOf( + AllInTheme.colors.allIn_Pink, + AllInTheme.colors.allIn_Blue + ), + blurRadius = 20.dp, + alpha = .5f, + cornerRadius = 15.dp + ), + radius = 10.dp, + backgroundBrush = AllInTheme.colors.allIn_MainGradient + ) { + Text( + text = text, + textAlign = TextAlign.Center, + style = AllInTheme.typography.h2, + color = AllInTheme.colors.white, + fontSize = 20.sp, + modifier = Modifier + .padding(vertical = 15.dp) + .fillMaxWidth(), + ) + } +} + +@Preview +@Composable +private fun AllInGradientButtonPreview() { + AllInTheme { + AllInGradientButton( + text = "Connexion" + ) { + + } + } +} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInTextField.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInTextField.kt new file mode 100644 index 0000000..00635a1 --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/AllInTextField.kt @@ -0,0 +1,188 @@ +package fr.iut.alldev.allin.ui.core + +import androidx.compose.foundation.ExperimentalFoundationApi +import androidx.compose.foundation.relocation.BringIntoViewRequester +import androidx.compose.foundation.shape.AbsoluteRoundedCornerShape +import androidx.compose.foundation.text.KeyboardActions +import androidx.compose.foundation.text.KeyboardOptions +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.filled.Visibility +import androidx.compose.material.icons.filled.VisibilityOff +import androidx.compose.material3.* +import androidx.compose.runtime.* +import androidx.compose.ui.Modifier +import androidx.compose.ui.focus.onFocusChanged +import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.text.TextRange +import androidx.compose.ui.text.input.KeyboardType +import androidx.compose.ui.text.input.PasswordVisualTransformation +import androidx.compose.ui.text.input.TextFieldValue +import androidx.compose.ui.text.input.VisualTransformation +import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.sp +import fr.iut.alldev.allin.ui.theme.AllInTheme +import kotlinx.coroutines.launch + +@OptIn(ExperimentalFoundationApi::class) +@Composable +fun AllInTextField( + placeholder: String, + value: String, + maxChar: Int? = null, + modifier: Modifier = Modifier, + enabled: Boolean = true, + trailingIcon: ImageVector? = null, + trailingContent: @Composable (() -> Unit)? = null, + onValueChange: (String)->Unit, + bringIntoViewRequester: BringIntoViewRequester, + visualTransformation: VisualTransformation = VisualTransformation.None, + keyboardType: KeyboardType = KeyboardType.Text, + keyboardActions: KeyboardActions = KeyboardActions.Default +) { + val scope = rememberCoroutineScope() + var hasFocus by remember { mutableStateOf(false) } + + var textFieldValue by remember { + mutableStateOf(TextFieldValue(text = value, selection = TextRange(value.length))) + } + + LaunchedEffect(key1 = value, block = { + textFieldValue = TextFieldValue(text = value, selection = TextRange(value.length)) + }) + + + OutlinedTextField( + modifier = modifier + .onFocusChanged { + hasFocus = it.hasFocus + if (it.isFocused) { + scope.launch { + bringIntoViewRequester.bringIntoView() + } + } + }, + visualTransformation = visualTransformation, + value = textFieldValue, + onValueChange = { + if(maxChar==null || it.text.length<=maxChar) { + textFieldValue = it + onValueChange(it.text) + } + }, + placeholder = { + Text( + text = placeholder, + fontSize = 18.sp, + style = AllInTheme.typography.r, + color = AllInTheme.colors.allIn_LightGrey300 + ) + }, + trailingIcon = trailingContent ?: trailingIcon?.let{ + @Composable { + Icon( + imageVector = it, + contentDescription = null, + tint = AllInTheme.colors.allIn_LightGrey300 + ) + } + }, + textStyle = AllInTheme.typography.r, + singleLine = true, + enabled = enabled, + keyboardOptions = KeyboardOptions(keyboardType = keyboardType), + keyboardActions = keyboardActions, + shape = AbsoluteRoundedCornerShape(20), + colors = OutlinedTextFieldDefaults.colors( + cursorColor = AllInTheme.colors.allIn_Dark, + focusedBorderColor = AllInTheme.colors.allIn_LightGrey300, + unfocusedBorderColor = AllInTheme.colors.allIn_LightGrey300, + focusedTextColor = AllInTheme.colors.allIn_Dark, + unfocusedTextColor = AllInTheme.colors.allIn_Dark, + focusedContainerColor = AllInTheme.colors.white, + unfocusedContainerColor = AllInTheme.colors.white + + ) + ) +} + +@OptIn(ExperimentalFoundationApi::class) +@Composable +fun AllInPasswordField( + placeholder: String, + value: String, + modifier: Modifier = Modifier, + keyboardType: KeyboardType = KeyboardType.Password, + keyboardActions: KeyboardActions = KeyboardActions.Default, + onValueChange: (String)->Unit, + bringIntoViewRequester: BringIntoViewRequester, + isHiddenByDefault: Boolean = true +){ + var hidden by remember{ + mutableStateOf(isHiddenByDefault) + } + AllInTextField( + modifier = modifier, + placeholder = placeholder, + keyboardActions = keyboardActions, + visualTransformation = if (hidden) PasswordVisualTransformation() else VisualTransformation.None, + value = value, + onValueChange = onValueChange, + bringIntoViewRequester = bringIntoViewRequester, + trailingContent = { + IconButton( + onClick = { hidden = !hidden } + ) { + Icon( + imageVector = if (hidden) Icons.Default.VisibilityOff else Icons.Default.Visibility, + contentDescription = null, + tint = AllInTheme.colors.allIn_LightGrey300 + ) + } + }, + keyboardType = keyboardType + ) +} + +@OptIn(ExperimentalFoundationApi::class) +@Preview +@Composable +private fun AllInTextFieldPlaceholderPreview() { + AllInTheme { + AllInTextField( + placeholder = "Email", + value = "", + onValueChange = { }, + bringIntoViewRequester = BringIntoViewRequester() + ) + } +} + + +@OptIn(ExperimentalFoundationApi::class) +@Preview +@Composable +private fun AllInTextFieldValuePreview() { + AllInTheme { + AllInTextField( + placeholder = "Email", + value = "JohnDoe@mail.com", + onValueChange = { }, + bringIntoViewRequester = BringIntoViewRequester() + ) + } +} + +@OptIn(ExperimentalFoundationApi::class) +@Preview +@Composable +private fun AllInTextFieldPasswordPreview() { + AllInTheme { + val (value, setValue) = mutableStateOf("") + AllInPasswordField( + placeholder = "Password", + value = value, + onValueChange = setValue, + bringIntoViewRequester = BringIntoViewRequester() + ) + } +} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homeBetCardDateTimeChip.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/DateTimeChip.kt similarity index 80% rename from src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homeBetCardDateTimeChip.kt rename to src/app/src/main/java/fr/iut/alldev/allin/ui/core/DateTimeChip.kt index d4e41e5..44f37a7 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homeBetCardDateTimeChip.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/core/DateTimeChip.kt @@ -1,5 +1,6 @@ -package fr.iut.alldev.allin.ui.home.components +package fr.iut.alldev.allin.ui.bet.components +import android.content.res.Configuration import androidx.compose.foundation.BorderStroke import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.wrapContentSize @@ -15,15 +16,15 @@ import androidx.compose.ui.unit.dp import fr.iut.alldev.allin.ui.theme.AllInTheme @Composable -fun HomeBetCardDateTimeChip( +fun DateTimeChip( text: String, modifier: Modifier = Modifier ) { Card( modifier = modifier.wrapContentSize(), shape = RoundedCornerShape(50), - border = BorderStroke(1.dp, AllInTheme.colors.allIn_LightGrey100), - colors = CardDefaults.cardColors(containerColor = AllInTheme.colors.white) + border = BorderStroke(1.dp, AllInTheme.themeColors.border), + colors = CardDefaults.cardColors(containerColor = AllInTheme.themeColors.background) ) { Text( text = text, @@ -36,9 +37,10 @@ fun HomeBetCardDateTimeChip( } @Preview +@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES) @Composable private fun HomeBetCardDateTimeChipPreview() { AllInTheme { - HomeBetCardDateTimeChip("11 Sept.") + DateTimeChip("11 Sept.") } } \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homePopularCard.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homePopularCard.kt deleted file mode 100644 index 2ee9aa4..0000000 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/home/components/homePopularCard.kt +++ /dev/null @@ -1,142 +0,0 @@ -package fr.iut.alldev.allin.ui.home.components - -import androidx.compose.foundation.layout.* -import androidx.compose.foundation.shape.AbsoluteRoundedCornerShape -import androidx.compose.material3.Icon -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.Alignment -import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.shadow -import androidx.compose.ui.res.painterResource -import androidx.compose.ui.res.pluralStringResource -import androidx.compose.ui.res.stringResource -import androidx.compose.ui.text.SpanStyle -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 fr.iut.alldev.allin.R -import fr.iut.alldev.allin.ui.core.AllInCard -import fr.iut.alldev.allin.ui.core.HighlightedText -import fr.iut.alldev.allin.ui.theme.AllInTheme -import kotlin.math.ceil - -@Composable -fun HomePopularCards( - nbPlayers: Int, - points: Float, - pointUnit: String, - title: String, - modifier: Modifier = Modifier -) { - Box(modifier.padding(3.dp)) { - AllInCard( - modifier = Modifier - .fillMaxWidth() - .shadow( - elevation = 2.dp, - shape = AbsoluteRoundedCornerShape(15) - ) - .padding(2.dp), - backgroundColor = AllInTheme.colors.allIn_Dark, - borderWidth = 2.dp, - borderBrush = AllInTheme.colors.allIn_MainGradient - ) { - Column(modifier = Modifier.padding(13.dp)) { - Row(verticalAlignment = Alignment.CenterVertically) { - Icon( - painter = painterResource(id = R.drawable.allin_fire), - modifier = Modifier.size(20.dp), - contentDescription = null, - tint = AllInTheme.colors.allIn_Pink - ) - Spacer(modifier = Modifier.width(3.dp)) - Text( - text = stringResource(id = R.string.Popular), - color = AllInTheme.colors.allIn_Pink, - fontSize = 17.sp, - style = AllInTheme.typography.h2 - ) - } - Text( - text = title, - color = AllInTheme.colors.white, - fontSize = 20.sp, - style = AllInTheme.typography.h1, - modifier = Modifier.padding(vertical = 22.dp) - ) - Row(modifier = Modifier.align(alignment = Alignment.CenterHorizontally)) { - HighlightedText( - text = pluralStringResource( - id = R.plurals.n_players, - nbPlayers, - nbPlayers - ), - query = nbPlayers.toString(), - highlightStyle = SpanStyle( - fontWeight = FontWeight.Bold, - color = AllInTheme.colors.allIn_Pink - ), - color = AllInTheme.colors.white, - style = AllInTheme.typography.r, - fontSize = 15.sp - ) - Text( - text = " - ", - color = AllInTheme.colors.white, - style = AllInTheme.typography.r, - fontSize = 15.sp - ) - val pointsText = if (points % 1 == 0f){ - stringResource(id = R.string.int_and_unit, points.toInt(), pointUnit) - }else{ - stringResource(id = R.string.float_and_unit, points, pointUnit) - } - HighlightedText( - text = pluralStringResource( - id = R.plurals.n_points_at_stake, - if(pointUnit.isEmpty()) ceil(points).toInt() else 2, - pointsText - ), - query = pointsText, - highlightStyle = SpanStyle( - fontWeight = FontWeight.Bold, - color = AllInTheme.colors.allIn_Pink - ), - color = AllInTheme.colors.white, - style = AllInTheme.typography.r, - fontSize = 15.sp - ) - } - } - - } - } -} - -@Preview -@Composable -private fun HomePopularCardsPreview() { - AllInTheme { - HomePopularCards( - nbPlayers = 12, - points = 2.35f, - pointUnit = "k", - title = "Emre va réussir son TP de CI/CD mercredi?" - ) - } -} - -@Preview -@Composable -private fun HomePopularCardsSingularPreview() { - AllInTheme { - HomePopularCards( - nbPlayers = 1, - points = 1.0f, - pointUnit = "", - title = "Emre va réussir son TP de CI/CD mercredi?" - ) - } -} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/login/loginScreen.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/login/loginScreen.kt new file mode 100644 index 0000000..dc77538 --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/login/loginScreen.kt @@ -0,0 +1,128 @@ +package fr.iut.alldev.allin.ui.login + +import androidx.compose.foundation.* +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.relocation.BringIntoViewRequester +import androidx.compose.foundation.text.ClickableText +import androidx.compose.material3.Text +import androidx.compose.runtime.* +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.AnnotatedString +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import fr.iut.alldev.allin.R +import fr.iut.alldev.allin.ui.core.AllInGradientButton +import fr.iut.alldev.allin.ui.core.AllInPasswordField +import fr.iut.alldev.allin.ui.core.AllInTextField +import fr.iut.alldev.allin.ui.theme.AllInTheme + +@OptIn(ExperimentalFoundationApi::class) +@Composable +fun LoginScreen( + onClickLogin: ()->Unit, + onClickRegister: ()->Unit +) { + + val bringIntoViewRequester = BringIntoViewRequester() + + Box( + Modifier + .fillMaxSize() + .background(AllInTheme.themeColors.main_surface) + .padding(horizontal = 44.dp) + .verticalScroll(rememberScrollState()) + ) { + Column( + Modifier.align(Alignment.Center) + ) { + Text( + modifier = Modifier.fillMaxWidth(), + text = stringResource(id = R.string.Login_title), + color = AllInTheme.themeColors.on_main_surface, + style = AllInTheme.typography.h3, + textAlign = TextAlign.Center, + fontSize = 40.sp + ) + Spacer(modifier = Modifier.height(23.dp)) + Text( + modifier = Modifier.fillMaxWidth(), + text = stringResource(id = R.string.Login_subtitle), + color = AllInTheme.themeColors.on_main_surface, + style = AllInTheme.typography.r, + textAlign = TextAlign.Center, + fontSize = 30.sp + ) + Spacer(modifier = Modifier.height(83.dp)) + Column( + verticalArrangement = Arrangement.spacedBy(20.dp) + ) { + AllInTextField( + modifier = Modifier.fillMaxWidth(), + placeholder = stringResource(id = R.string.username), + value = "", + onValueChange = { }, + bringIntoViewRequester = bringIntoViewRequester + ) + AllInPasswordField( + modifier = Modifier.fillMaxWidth(), + placeholder = stringResource(id = R.string.password), + value = "", + onValueChange = { }, + bringIntoViewRequester = bringIntoViewRequester + ) + } + ClickableText( + text = AnnotatedString(stringResource(id = R.string.forgot_password)), + style = AllInTheme.typography.m.copy( + color = AllInTheme.themeColors.on_main_surface, + fontSize = 15.sp, + ), + modifier = Modifier + .align(Alignment.End) + .padding(top = 15.dp) + ){ + // TODO : Forgot password + } + Spacer(modifier = Modifier.height(67.dp)) + } + Column( + Modifier + .align(Alignment.BottomCenter) + .padding(bottom = 32.dp) + ) { + AllInGradientButton( + text = stringResource(id = R.string.Login), + onClick = onClickLogin, + modifier = Modifier + ) + Spacer(modifier = Modifier.height(30.dp)) + Row( + horizontalArrangement = Arrangement.Center, + modifier = Modifier + .fillMaxWidth() + ) { + Text( + text = stringResource(id = R.string.no_account), + color = AllInTheme.themeColors.on_main_surface, + fontSize = 15.sp, + style = AllInTheme.typography.r, + modifier = Modifier.padding(end = 5.dp) + ) + ClickableText( + text = AnnotatedString(stringResource(id = R.string.Register)), + style = AllInTheme.typography.r.copy( + color = AllInTheme.colors.allIn_Purple, + fontSize = 15.sp, + fontWeight = FontWeight.Bold + ) + ) { + onClickRegister() + } + } + } + } +} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/NavHost.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/NavHost.kt index 69c0b06..8480f68 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/NavHost.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/NavHost.kt @@ -1,7 +1,8 @@ package fr.iut.alldev.allin.ui.navigation -import androidx.compose.animation.EnterTransition -import androidx.compose.animation.ExitTransition +import androidx.compose.animation.* +import androidx.compose.animation.core.tween +import androidx.compose.foundation.background import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier @@ -9,23 +10,107 @@ import androidx.navigation.NavHostController import androidx.navigation.compose.NavHost import androidx.navigation.compose.composable import androidx.navigation.compose.rememberNavController -import fr.iut.alldev.allin.ui.home.Home +import fr.iut.alldev.allin.ui.bet.BetScreen +import fr.iut.alldev.allin.ui.login.LoginScreen +import fr.iut.alldev.allin.ui.navigation.drawer.AllInDrawer import fr.iut.alldev.allin.ui.profile.Profile +import fr.iut.alldev.allin.ui.register.RegisterScreen +import fr.iut.alldev.allin.ui.theme.AllInTheme +import fr.iut.alldev.allin.ui.welcome.WelcomeScreen object Routes { - const val HOME = "home" - const val PROFILE = "profile" + const val WELCOME = "WELCOME" + const val REGISTER = "REGISTER" + const val LOGIN = "LOGIN" const val BET = "BET" const val BET_HISTORY = "BET_HISTORY" const val FRIENDS = "FRIENDS" const val CURRENT_BETS = "CURRENT_BETS" + const val DASHBOARD = "DASHBOARD" } +private fun NavHostController.popUpTo(route: String, baseRoute: String){ + this.navigate(route) { + launchSingleTop = true + popUpTo(baseRoute) { + saveState = true + inclusive = true + } + restoreState = true + } +} + @Composable fun AllInNavHost(modifier: Modifier = Modifier, navController: NavHostController = rememberNavController(), - startDestination: String = Routes.BET + startDestination: String = Routes.WELCOME +) { + NavHost( + navController = navController, + startDestination = startDestination, + enterTransition = + { + if(navController.currentDestination?.route != Routes.DASHBOARD) + slideInHorizontally(initialOffsetX = { it }) + else + fadeIn(animationSpec = tween(1500)) + }, + exitTransition = + { + if(navController.currentDestination?.route != Routes.DASHBOARD) + slideOutHorizontally(targetOffsetX = { -it/2 }) + else + fadeOut( + animationSpec = tween(1500) + ) + + }, + modifier = modifier.fillMaxSize().background(AllInTheme.themeColors.main_surface), + ) { + + composable(route = Routes.WELCOME){ + WelcomeScreen( + onClickJoin = { + navController.popUpTo(Routes.REGISTER, Routes.WELCOME) + }, + onClickLogin = { + navController.popUpTo(Routes.LOGIN, Routes.WELCOME) + } + ) + } + composable(route = Routes.REGISTER){ + RegisterScreen( + onClickRegister = { + navController.popUpTo(Routes.DASHBOARD, Routes.REGISTER) + }, + onClickLogin = { + navController.popUpTo(Routes.LOGIN, Routes.REGISTER) + } + ) + } + composable(route = Routes.LOGIN){ + LoginScreen( + onClickRegister = { + navController.popUpTo(Routes.REGISTER, Routes.LOGIN) + }, + onClickLogin = { + navController.popUpTo(Routes.DASHBOARD, Routes.LOGIN) + } + ) + } + composable( + route = Routes.DASHBOARD, + ){ + AllInDrawer() + } + } +} +@Composable +fun AllInDashboard( + modifier: Modifier = Modifier, + navController: NavHostController = rememberNavController(), + startDestination: String = Routes.BET ) { NavHost( navController = navController, @@ -34,9 +119,7 @@ fun AllInNavHost(modifier: Modifier = Modifier, enterTransition = { EnterTransition.None }, exitTransition = { ExitTransition.None } ) { - composable(route = Routes.BET){ Home() } - composable(route = Routes.BET_HISTORY){ Profile() } + composable(route = Routes.BET) { BetScreen() } + composable(route = Routes.BET_HISTORY) { Profile() } } -} - - +} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/drawer/drawer.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/drawer/drawer.kt index e0819fd..144eaf1 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/drawer/drawer.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/navigation/drawer/drawer.kt @@ -17,7 +17,7 @@ import androidx.navigation.NavHostController import androidx.navigation.compose.rememberNavController import fr.iut.alldev.allin.R import fr.iut.alldev.allin.ui.core.topbar.AllInTopBar -import fr.iut.alldev.allin.ui.navigation.AllInNavHost +import fr.iut.alldev.allin.ui.navigation.AllInDashboard import fr.iut.alldev.allin.ui.navigation.Routes import fr.iut.alldev.allin.ui.theme.AllInTheme import kotlinx.coroutines.launch @@ -145,13 +145,11 @@ fun AllInDrawer( modifier = Modifier .padding(it) .fillMaxSize() - .background(AllInTheme.colors.allIn_White), + .background(AllInTheme.themeColors.main_surface), horizontalAlignment = Alignment.CenterHorizontally ) { - AllInNavHost( - modifier = Modifier.fillMaxSize(), - navController = navController, - startDestination = startDestination + AllInDashboard( + navController = navController ) } } diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/register/registerScreen.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/register/registerScreen.kt new file mode 100644 index 0000000..d917387 --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/register/registerScreen.kt @@ -0,0 +1,145 @@ +package fr.iut.alldev.allin.ui.register + +import androidx.compose.foundation.* +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.relocation.BringIntoViewRequester +import androidx.compose.foundation.text.ClickableText +import androidx.compose.material3.Text +import androidx.compose.runtime.* +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.AnnotatedString +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.input.KeyboardType +import androidx.compose.ui.text.style.TextAlign +import androidx.compose.ui.text.style.TextOverflow +import androidx.compose.ui.unit.dp +import androidx.compose.ui.unit.sp +import fr.iut.alldev.allin.R +import fr.iut.alldev.allin.ui.core.AllInGradientButton +import fr.iut.alldev.allin.ui.core.AllInPasswordField +import fr.iut.alldev.allin.ui.core.AllInTextField +import fr.iut.alldev.allin.ui.theme.AllInTheme + +@OptIn(ExperimentalFoundationApi::class) +@Composable +fun RegisterScreen( + onClickRegister: ()->Unit, + onClickLogin: ()->Unit +) { + var username by remember{ + mutableStateOf("") + } + val bringIntoViewRequester = remember { BringIntoViewRequester() } + + Box( + Modifier + .fillMaxSize() + .background(AllInTheme.themeColors.main_surface) + .padding(horizontal = 44.dp) + .verticalScroll(rememberScrollState()) + ) { + Column( + Modifier.align(Alignment.Center) + ) { + Text( + modifier = Modifier.fillMaxWidth(), + text = stringResource(id = R.string.Hello_x, username), + color = AllInTheme.themeColors.on_main_surface, + style = AllInTheme.typography.h3, + textAlign = TextAlign.Center, + fontSize = 40.sp, + overflow = TextOverflow.Ellipsis, + maxLines = 1 + ) + Text( + modifier = Modifier.fillMaxWidth(), + text = stringResource(id = R.string.Register_title), + color = AllInTheme.themeColors.on_main_surface, + style = AllInTheme.typography.h3, + textAlign = TextAlign.Center, + fontSize = 40.sp + ) + Spacer(modifier = Modifier.height(23.dp)) + Text( + modifier = Modifier.fillMaxWidth(), + text = stringResource(id = R.string.Register_subtitle), + color = AllInTheme.themeColors.on_main_surface, + style = AllInTheme.typography.r, + textAlign = TextAlign.Center, + fontSize = 30.sp + ) + Spacer(modifier = Modifier.height(83.dp)) + Column( + verticalArrangement = Arrangement.spacedBy(20.dp) + ) { + AllInTextField( + modifier = Modifier.fillMaxWidth(), + placeholder = stringResource(id = R.string.username), + value = username, + onValueChange = { username = it }, + maxChar = 20, + bringIntoViewRequester = bringIntoViewRequester + ) + AllInTextField( + modifier = Modifier.fillMaxWidth(), + placeholder = stringResource(id = R.string.email), + value = "", + onValueChange = { }, + keyboardType = KeyboardType.Email, + bringIntoViewRequester = bringIntoViewRequester + ) + AllInPasswordField( + modifier = Modifier.fillMaxWidth(), + placeholder = stringResource(id = R.string.password), + value = "", + onValueChange = { }, + bringIntoViewRequester = bringIntoViewRequester + ) + AllInPasswordField( + modifier = Modifier.fillMaxWidth(), + placeholder = stringResource(id = R.string.confirm_password), + value = "", + onValueChange = { }, + bringIntoViewRequester = bringIntoViewRequester + ) + } + Spacer(modifier = Modifier.height(67.dp)) + } + Column( + Modifier + .align(Alignment.BottomCenter) + .padding(bottom = 32.dp) + ) { + AllInGradientButton( + text = stringResource(id = R.string.Register), + onClick = onClickRegister + ) + Spacer(modifier = Modifier.height(30.dp)) + Row( + horizontalArrangement = Arrangement.Center, + modifier = Modifier + .fillMaxWidth() + ) { + Text( + text = stringResource(id = R.string.already_have_account), + color = AllInTheme.themeColors.on_main_surface, + fontSize = 15.sp, + style = AllInTheme.typography.r, + modifier = Modifier.padding(end = 5.dp) + ) + ClickableText( + text = AnnotatedString(stringResource(id = R.string.Login)), + style = AllInTheme.typography.r.copy( + color = AllInTheme.colors.allIn_Purple, + fontSize = 15.sp, + fontWeight = FontWeight.Bold + ) + ) { + onClickLogin() + } + } + } + } +} \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Color.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Color.kt index e71c358..ba9a037 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Color.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Color.kt @@ -9,6 +9,8 @@ import androidx.compose.ui.graphics.Color @Immutable data class AllInColors( val allIn_Dark: Color, + val allIn_DarkGrey300: Color, + val allIn_DarkGrey200: Color, val allIn_DarkGrey100: Color, val allIn_DarkGrey50: Color, val allIn_Grey: Color, @@ -18,20 +20,26 @@ data class AllInColors( val allIn_LightGrey50: Color, val allIn_White: Color, val white: Color, + val black: Color, val allIn_Pink: Color, val allIn_Purple: Color, + val allIn_LoginPurple: Color, val allIn_Blue: Color, + val allIn_DarkBlue: Color, val allIn_BarPurple: Color, val allIn_BarPink: Color, val allIn_MainGradient: Brush, val allIn_Bar1stGradient: Brush, val allIn_Bar2ndGradient: Brush, - val allIn_TextGradient: Brush + val allIn_TextGradient: Brush, + val allIn_LoginGradient: Brush ) internal val LocalColors = staticCompositionLocalOf { AllInColors( allIn_Dark = Color.Unspecified, + allIn_DarkGrey300 = Color.Unspecified, + allIn_DarkGrey200 = Color.Unspecified, allIn_DarkGrey100 = Color.Unspecified, allIn_DarkGrey50 = Color.Unspecified, allIn_Grey = Color.Unspecified, @@ -41,11 +49,14 @@ internal val LocalColors = staticCompositionLocalOf { allIn_LightGrey50 = Color.Unspecified, allIn_White = Color.Unspecified, white = Color.Unspecified, + black = Color.Unspecified, allIn_Pink = Color.Unspecified, allIn_Purple = Color.Unspecified, + allIn_LoginPurple = Color.Unspecified, allIn_BarPurple = Color.Unspecified, allIn_BarPink = Color.Unspecified, allIn_Blue = Color.Unspecified, + allIn_DarkBlue = Color.Unspecified, allIn_MainGradient = Brush.linearGradient( 0.0f to Color(0xFFf951a8), @@ -65,6 +76,37 @@ internal val LocalColors = staticCompositionLocalOf { allIn_TextGradient = Brush.horizontalGradient( 0.0f to Color(0xFFF876C1), 1.0f to Color(0xFF2399F8) + ), + allIn_LoginGradient = Brush.linearGradient( + 0.0f to Color(0xFFEC1794), + 0.5f to Color(0xFFaa7ef3), + 1.0f to Color(0xFF00EEEE), + start = Offset(0f, Float.POSITIVE_INFINITY), + end = Offset(Float.POSITIVE_INFINITY, 0f) ) ) +} +@Immutable +data class AllInThemeColors( + val main_surface: Color, + val on_main_surface: Color, + val background: Color, + val on_background: Color, + val tint_1: Color, + val background_2: Color, + val on_background_2: Color, + val border: Color +) + +internal val LocalThemeColors = staticCompositionLocalOf { + AllInThemeColors( + main_surface = Color.Unspecified, + on_main_surface = Color.Unspecified, + background = Color.Unspecified, + on_background = Color.Unspecified, + tint_1 = Color.Unspecified, + background_2 = Color.Unspecified, + on_background_2 = Color.Unspecified, + border = Color.Unspecified + ) } \ No newline at end of file diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Theme.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Theme.kt index f78319d..62edd50 100644 --- a/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Theme.kt +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/theme/Theme.kt @@ -19,6 +19,8 @@ fun AllInTheme( ) { val customColors = AllInColors( allIn_Dark = Color(0xFF2A2A2A), + allIn_DarkGrey300 = Color(0xFF1c1c1c), + allIn_DarkGrey200 = Color(0xFF262626), allIn_DarkGrey100 = Color(0xFF393939), allIn_DarkGrey50 = Color(0xFF454545), allIn_Grey = Color(0xFF525252), @@ -28,11 +30,14 @@ fun AllInTheme( allIn_LightGrey50 = Color(0XFFF7F7F7), allIn_White = Color(0xFFEBEBF6), white = Color(0xFFFFFFFF), + black = Color(0xFF000000), allIn_Pink = Color(0xFFFF2A89), allIn_Purple = Color(0xFF7D79FF), + allIn_LoginPurple = Color(0xFF7F7BFB), allIn_BarPurple = Color(0xFF846AC9), allIn_BarPink = Color(0xFFFE2B8A), allIn_Blue = Color(0xFF6a89fa), + allIn_DarkBlue = Color(0xFF323078), allIn_MainGradient = Brush.linearGradient( 0.0f to Color(0xFFf951a8), @@ -52,8 +57,16 @@ fun AllInTheme( allIn_TextGradient = Brush.horizontalGradient( 0.0f to Color(0xFFF876C1), 1.0f to Color(0xFF2399F8) + ), + allIn_LoginGradient = Brush.linearGradient( + 0.0f to Color(0xFFEC1794), + 0.5f to Color(0xFFaa7ef3), + 1.0f to Color(0xFF00EEEE), + start = Offset(0f, Float.POSITIVE_INFINITY), + end = Offset(Float.POSITIVE_INFINITY, 0f) ) ) + val customTypography = AllInTypography( h1 = TextStyle( fontFamily = PlusJakartaSans, @@ -84,9 +97,36 @@ fun AllInTheme( fontWeight = FontWeight.ExtraLight, ) ) + + val customTheme = if(isSystemInDarkTheme()){ + AllInThemeColors( + main_surface = customColors.allIn_DarkGrey300, + on_main_surface = customColors.allIn_White, + background = customColors.allIn_DarkGrey200, + on_background = customColors.white, + tint_1 = customColors.white, + background_2 = customColors.allIn_Dark, + on_background_2 = customColors.allIn_LightGrey200, + border = customColors.allIn_DarkGrey100 + ) + }else{ + AllInThemeColors( + main_surface = customColors.allIn_White, + on_main_surface = customColors.allIn_Dark, + background = customColors.white, + on_background = customColors.allIn_DarkBlue, + tint_1 = customColors.allIn_LoginPurple, + background_2 = customColors.allIn_LightGrey50, + on_background_2 = customColors.allIn_LightGrey300, + border = customColors.allIn_LightGrey100 + ) + } + CompositionLocalProvider( LocalColors provides customColors, - LocalTypography provides customTypography + LocalTypography provides customTypography, + LocalThemeColors provides customTheme + ){ content() } @@ -102,6 +142,11 @@ object AllInTheme { @Composable @ReadOnlyComposable get() = LocalTypography.current + + val themeColors: AllInThemeColors + @Composable + @ReadOnlyComposable + get() = LocalThemeColors.current } diff --git a/src/app/src/main/java/fr/iut/alldev/allin/ui/welcome/welcomeScreen.kt b/src/app/src/main/java/fr/iut/alldev/allin/ui/welcome/welcomeScreen.kt new file mode 100644 index 0000000..3e78d00 --- /dev/null +++ b/src/app/src/main/java/fr/iut/alldev/allin/ui/welcome/welcomeScreen.kt @@ -0,0 +1,114 @@ +package fr.iut.alldev.allin.ui.welcome + +import android.content.res.Configuration +import androidx.compose.foundation.ExperimentalFoundationApi +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.* +import androidx.compose.foundation.text.ClickableText +import androidx.compose.material3.Text +import androidx.compose.runtime.Composable +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.graphics.Brush +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.AnnotatedString +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 fr.iut.alldev.allin.R +import fr.iut.alldev.allin.ui.core.AllInButton +import fr.iut.alldev.allin.ui.theme.AllInTheme + +@OptIn(ExperimentalFoundationApi::class) +@Composable +fun WelcomeScreen( + onClickJoin: ()->Unit, + onClickLogin: ()->Unit +) { + Box( + Modifier + .fillMaxWidth() + .fillMaxHeight(.5f) + .background(AllInTheme.colors.allIn_LoginGradient) + ) + Box( + Modifier + .fillMaxSize() + .background( + Brush.verticalGradient( + .2f to Color.Transparent, + .5f to AllInTheme.themeColors.background + ) + ) + ){ + Column( + Modifier + .align(Alignment.BottomCenter) + .fillMaxWidth() + .fillMaxHeight(.5f) + .padding(horizontal = 45.dp) + ){ + Text( + text = stringResource(id = R.string.welcome_title), + color = AllInTheme.themeColors.on_background, + fontSize = 30.sp, + style = AllInTheme.typography.h1 + ) + Text( + text = stringResource(id = R.string.welcome_appname), + fontSize = 60.sp, + style = AllInTheme.typography.h1.copy( + brush = AllInTheme.colors.allIn_MainGradient + ) + ) + Spacer(modifier = Modifier.height(43.dp)) + Text( + text = stringResource(id = R.string.welcome_subtitle), + color = AllInTheme.themeColors.on_background, + fontSize = 15.sp, + style = AllInTheme.typography.r + ) + Spacer(modifier = Modifier.height(78.dp)) + AllInButton( + color = AllInTheme.themeColors.tint_1, + text = stringResource(id = R.string.join), + textColor = AllInTheme.themeColors.background, + onClick = onClickJoin, + modifier = Modifier.padding(bottom = 13.dp) + ) + Row( + horizontalArrangement = Arrangement.Center, + modifier = Modifier.fillMaxWidth() + ) { + Text( + text = stringResource(id = R.string.already_have_account), + color = AllInTheme.themeColors.tint_1, + fontSize = 15.sp, + style = AllInTheme.typography.r, + modifier = Modifier.padding(end = 5.dp) + ) + ClickableText( + text = AnnotatedString(stringResource(id = R.string.Login)), + style = AllInTheme.typography.r.copy( + color = AllInTheme.themeColors.tint_1, + fontSize = 15.sp, + fontWeight = FontWeight.Bold + ) + ){ + onClickLogin() + } + } + } + } +} + +@Preview +@Preview(uiMode = Configuration.UI_MODE_NIGHT_YES) +@Composable +private fun WelcomeScreenPreview() { + AllInTheme{ + WelcomeScreen(onClickJoin = {}, onClickLogin = {}) + } +} \ No newline at end of file diff --git a/src/app/src/main/res/values-fr/strings.xml b/src/app/src/main/res/values-fr/strings.xml index dbaf646..b593452 100644 --- a/src/app/src/main/res/values-fr/strings.xml +++ b/src/app/src/main/res/values-fr/strings.xml @@ -1,5 +1,14 @@ + Pseudo + Email + Mot de passe + Confirmation du mot de passe + Se connecter + Tu as déjà un compte ? + Mot de passe oublié ? + Pas encore inscrit ? + S\'inscrire Bets Meilleur gain @@ -11,7 +20,18 @@ Défiez vos porches en les ajoutant en amis. Bets en cours Gérez vos bets et récompensez les gagnants. - + + Bienvenue sur + Récupère tes Allcoins et viens parier avec tes amis pour prouver qui est le meilleur. + Rejoindre + + Bonjour, %s + On a besoins de ça! + Promis c\'est rapide. + + Te revoilà ! + Bon retour parmis nous tu nous as manqué ! + Populaire Public Invitation diff --git a/src/app/src/main/res/values/strings.xml b/src/app/src/main/res/values/strings.xml index 63ccabd..d1ca58b 100644 --- a/src/app/src/main/res/values/strings.xml +++ b/src/app/src/main/res/values/strings.xml @@ -3,6 +3,16 @@ Allin %.2g%s %d%s + Username + Email + Password + Confirm password + Login + Already have an account ? + Forgot password ? + Don\'t have an account ? + Register + Bets Best win @@ -14,7 +24,19 @@ Challenge your folks by adding them as friends. Current bets Manage your bets and reward the winners. - + + Welcome to + Allin. + Collect your Allcoins and come bet with your friend to prove who\'s best. + Join + + Hello, %s + We need this! + Don\'t worry it\'s fast. + + Welcome back ! + We missed you. + Popular Public Invitation diff --git a/src/build.gradle b/src/build.gradle index 777c586..ddeebca 100644 --- a/src/build.gradle +++ b/src/build.gradle @@ -5,7 +5,7 @@ buildscript { } }// Top-level build file where you can add configuration options common to all sub-projects/modules. plugins { - id 'com.android.application' version '7.4.1' apply false - id 'com.android.library' version '7.4.1' apply false + id 'com.android.application' version '7.4.2' apply false + id 'com.android.library' version '7.4.2' apply false id 'org.jetbrains.kotlin.android' version '1.7.0' apply false } \ No newline at end of file diff --git a/src/gradle/wrapper/gradle-wrapper.properties b/src/gradle/wrapper/gradle-wrapper.properties index 1395970..6d60ff6 100644 --- a/src/gradle/wrapper/gradle-wrapper.properties +++ b/src/gradle/wrapper/gradle-wrapper.properties @@ -1,6 +1,6 @@ -#Mon Sep 18 15:30:53 CEST 2023 +#Mon Sep 25 00:27:11 CEST 2023 distributionBase=GRADLE_USER_HOME -distributionUrl=https\://services.gradle.org/distributions/gradle-7.5-bin.zip +distributionUrl=https\://services.gradle.org/distributions/gradle-8.3-bin.zip distributionPath=wrapper/dists zipStorePath=wrapper/dists zipStoreBase=GRADLE_USER_HOME