From 14951c5d017fad65fc83c5588c677b7c029975d2 Mon Sep 17 00:00:00 2001 From: "maxence.guitard" Date: Sun, 17 Mar 2024 00:42:00 +0100 Subject: [PATCH] feat : Mainpage et connexionpage responsive --- .../mathseduc/ConnexionPlayerActivity.kt | 51 +++++++++++-------- .../com/example/mathseduc/MainActivity.kt | 3 -- .../com/example/mathseduc/ui/activity_main.kt | 25 +++++++-- 3 files changed, 51 insertions(+), 28 deletions(-) diff --git a/Android/app/src/main/java/com/example/mathseduc/ConnexionPlayerActivity.kt b/Android/app/src/main/java/com/example/mathseduc/ConnexionPlayerActivity.kt index ca9d0e1..5310e85 100644 --- a/Android/app/src/main/java/com/example/mathseduc/ConnexionPlayerActivity.kt +++ b/Android/app/src/main/java/com/example/mathseduc/ConnexionPlayerActivity.kt @@ -1,6 +1,7 @@ package com.example.mathseduc import android.content.Intent +import android.content.res.Configuration import android.os.Bundle import android.widget.Toast import androidx.activity.ComponentActivity @@ -17,23 +18,23 @@ import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.platform.LocalConfiguration import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource 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.core.view.WindowCompat +import androidx.core.view.WindowInsetsCompat import com.example.mathseduc.controllers.ControllerPlayer -import com.example.mathseduc.ui.theme.MathsEducTheme class ConnexionPlayerActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { - MathsEducTheme { ConnexionPlayerContent(activity = this@ConnexionPlayerActivity) - } } } } @@ -46,9 +47,18 @@ fun ConnexionPlayerContent(activity: ConnexionPlayerActivity) { var showDialog by rememberSaveable { mutableStateOf(false) } val context = LocalContext.current + val isPortrait = LocalConfiguration.current.orientation == Configuration.ORIENTATION_PORTRAIT + + WindowCompat.setDecorFitsSystemWindows(activity.window, false) + + val windowInsetsController = remember { + WindowCompat.getInsetsController(activity.window, activity.window.decorView) + } + + // Hide the status bar + windowInsetsController?.hide(WindowInsetsCompat.Type.statusBars()) - Column(modifier = Modifier.fillMaxSize()) { - TopAppBar( + TopAppBar( colors = TopAppBarDefaults.topAppBarColors( containerColor = Color.Transparent, ), @@ -69,9 +79,8 @@ fun ConnexionPlayerContent(activity: ConnexionPlayerActivity) { ) Column( modifier = Modifier - .fillMaxWidth() - .padding(16.dp) - .weight(1f), + .fillMaxSize() + .padding(16.dp,0.dp), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally ) { @@ -79,19 +88,19 @@ fun ConnexionPlayerContent(activity: ConnexionPlayerActivity) { Image( painter = painterResource(id = R.drawable.logo), contentDescription = null, - modifier = Modifier - .size(160.dp, 130.dp) + modifier = Modifier.padding(0.dp, 2.dp, 0.dp) + .size(if (isPortrait) 120.dp else 90.dp) ) - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(if (isPortrait) 16.dp else 4.dp)) OutlinedTextField( value = nickname, onValueChange = { nickname = it }, label = { Text("Nickname") }, modifier = Modifier - .fillMaxWidth() - .padding(8.dp), + .fillMaxWidth(if (isPortrait) 1f else 0.5f) + .padding(if (isPortrait) 8.dp else 8.dp,3.dp), colors = OutlinedTextFieldDefaults.colors( focusedContainerColor = Color.White, unfocusedContainerColor = Color.White, @@ -110,7 +119,7 @@ fun ConnexionPlayerContent(activity: ConnexionPlayerActivity) { keyboardType = KeyboardType.Password ), modifier = Modifier - .fillMaxWidth() + .fillMaxWidth(if (isPortrait) 1f else 0.5f) .padding(8.dp), colors = OutlinedTextFieldDefaults.colors( focusedContainerColor = Color.White, @@ -121,7 +130,7 @@ fun ConnexionPlayerContent(activity: ConnexionPlayerActivity) { shape = RoundedCornerShape(8.dp) ) - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(if (isPortrait) 16.dp else 7.dp)) Button( onClick = { @@ -136,18 +145,18 @@ fun ConnexionPlayerContent(activity: ConnexionPlayerActivity) { } }, modifier = Modifier - .fillMaxWidth() + .width(230.dp) .height(48.dp) ) { Text("Login") } - Spacer(modifier = Modifier.height(16.dp)) + Spacer(modifier = Modifier.height(if (isPortrait) 16.dp else 10.dp)) Button( onClick = { showDialog = true }, modifier = Modifier - .fillMaxWidth() + .width(230.dp) .height(48.dp), colors = ButtonDefaults.buttonColors( containerColor = Color(0xFF40E0D0)) @@ -160,7 +169,7 @@ fun ConnexionPlayerContent(activity: ConnexionPlayerActivity) { } } } -} + @Composable fun RegisterDialog(onDismiss: () -> Unit) { @@ -229,7 +238,5 @@ fun RegisterDialog(onDismiss: () -> Unit) { @Composable fun ConnexionPlayerPreview() { val fakeActivity = ConnexionPlayerActivity() - MathsEducTheme { - ConnexionPlayerContent(activity = fakeActivity) - } + ConnexionPlayerContent(activity = fakeActivity) } \ No newline at end of file diff --git a/Android/app/src/main/java/com/example/mathseduc/MainActivity.kt b/Android/app/src/main/java/com/example/mathseduc/MainActivity.kt index 8b25357..427313e 100644 --- a/Android/app/src/main/java/com/example/mathseduc/MainActivity.kt +++ b/Android/app/src/main/java/com/example/mathseduc/MainActivity.kt @@ -7,7 +7,6 @@ import androidx.activity.compose.setContent import androidx.compose.runtime.Composable import androidx.compose.ui.tooling.preview.Preview import com.example.mathseduc.ui.HomePage -import com.example.mathseduc.ui.theme.MathsEducTheme class MainActivity : ComponentActivity() { companion object { @@ -17,9 +16,7 @@ class MainActivity : ComponentActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { - MathsEducTheme { HomePage() - } } } } diff --git a/Android/app/src/main/java/com/example/mathseduc/ui/activity_main.kt b/Android/app/src/main/java/com/example/mathseduc/ui/activity_main.kt index 7349c65..bff198d 100644 --- a/Android/app/src/main/java/com/example/mathseduc/ui/activity_main.kt +++ b/Android/app/src/main/java/com/example/mathseduc/ui/activity_main.kt @@ -1,6 +1,8 @@ package com.example.mathseduc.ui +import android.app.Activity import android.content.Intent +import android.content.res.Configuration import android.widget.Toast import androidx.compose.foundation.Image import androidx.compose.foundation.layout.Arrangement @@ -16,14 +18,19 @@ import androidx.compose.material3.Button import androidx.compose.material3.ButtonDefaults import androidx.compose.material3.Text import androidx.compose.runtime.Composable +import androidx.compose.runtime.remember 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.platform.LocalConfiguration import androidx.compose.ui.platform.LocalContext +import androidx.compose.ui.platform.LocalView import androidx.compose.ui.res.painterResource import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp +import androidx.core.view.WindowCompat +import androidx.core.view.WindowInsetsCompat import com.example.mathseduc.ConnexionPlayerActivity import com.example.mathseduc.MainActivity import com.example.mathseduc.MultiActivity @@ -39,6 +46,18 @@ fun HomePage() { .fillMaxSize() .padding(16.dp) + val view = LocalView.current + val isPortrait = LocalConfiguration.current.orientation == Configuration.ORIENTATION_PORTRAIT + val window = (view.context as Activity).window + WindowCompat.setDecorFitsSystemWindows(window, false) + + val windowInsetsController = remember { + WindowCompat.getInsetsController(window, window.decorView) + } + + // Hide the status bar + windowInsetsController?.hide(WindowInsetsCompat.Type.statusBars()) + Column( modifier = modifier, verticalArrangement = Arrangement.Center, @@ -62,7 +81,7 @@ fun HomePage() { shape = RoundedCornerShape(15), colors = ButtonDefaults.buttonColors(Colors.Green), modifier = Modifier - .fillMaxWidth() + .fillMaxWidth(if (isPortrait) 1f else 0.5f) .height(48.dp) ) { @@ -90,7 +109,7 @@ fun HomePage() { shape = RoundedCornerShape(15), colors = ButtonDefaults.buttonColors(Colors.Orange), modifier = Modifier - .fillMaxWidth() + .fillMaxWidth(if (isPortrait) 1f else 0.5f) .height(48.dp) ) { Text( @@ -108,7 +127,7 @@ fun HomePage() { shape = RoundedCornerShape(15), colors = ButtonDefaults.buttonColors(Colors.Grey), modifier = Modifier - .fillMaxWidth() + .fillMaxWidth(if (isPortrait) 1f else 0.5f) .height(48.dp) .padding(horizontal = 16.dp) ) {