page Quizz

What_The_Fantasy/app/src/main/java/com/example/what_the_fantasy/MainActivity.kt

@@ -15,6 +15,7 @@ import com.example.what_the_fantasy.ui.screens.AppNavigator
 import com.example.what_the_fantasy.ui.theme.What_The_FantasyTheme
 import com.example.what_the_fantasy.ui.screens.LoginPage
 import com.example.what_the_fantasy.ui.screens.ProfilPage
+import com.example.what_the_fantasy.ui.screens.QuizPage
 
 class MainActivity : ComponentActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
@@ -31,7 +32,8 @@ class MainActivity : ComponentActivity() {
                     }
                 }
                 //AppNavigator() // Accès à la page login et SingUp (pour le moment)
-                ProfilPage()    //Accès à la page profil
+                //ProfilPage()    //Accès à la page profil
+                QuizPage()
             }
         }
     }

What_The_Fantasy/app/src/main/java/com/example/what_the_fantasy/ui/screens/QuizPage.kt

@@ -1,6 +1,107 @@
 package com.example.what_the_fantasy.ui.screens
 
+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.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.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Button
+import androidx.compose.material3.ButtonColors
+import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.graphics.Brush
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import com.example.what_the_fantasy.data.local.QuestionStub
+import com.example.what_the_fantasy.data.model.Question
 
 @Composable
-fun QuizPage() {}
+fun QuizPage() {
+    val gradient = Brush.linearGradient(
+        colors = listOf(Color(0xFF7B1FA2), Color(0xFF311B92)), // Violet clair → Violet foncé
+        start = Offset(0f, 1000f), // Départ en bas à gauche
+        end = Offset(1000f, 0f) // Fin en haut à droite
+    )
+
+    val questions = QuestionStub.allQuestions
+
+    Box(
+        modifier = Modifier
+            .fillMaxSize()
+            .background(Color(0xFF100C1B)) // Fond global de l'écran
+            .padding(16.dp) // Marges autour de tout le contenu
+    ) {
+        // Numéro de la question en haut
+        Text(
+            text = "Question numéro : " + questions.first().id.toString(),
+            color = Color.White,
+            fontSize = 18.sp, // Taille réduite pour tenir sur un écran portrait
+            modifier = Modifier
+                .align(Alignment.TopCenter) // Position en haut au centre
+                .padding(top = 16.dp) // Un peu d'espace en haut
+        )
+
+        // Contenu centré, mais avec une gestion plus équilibrée du placement
+        Column(
+            modifier = Modifier
+                .fillMaxSize()
+                .padding(top = 48.dp), // Réduit l'espace entre le numéro de la question et la question elle-même
+            verticalArrangement = Arrangement.Center, // Centre verticalement
+            horizontalAlignment = Alignment.CenterHorizontally // Centre horizontalement
+        ) {
+            // Question principale
+            Text(
+                text = questions.first().question,
+                color = Color.White,
+                fontSize = 22.sp, // Taille plus petite pour tenir sur un écran portrait
+                modifier = Modifier.padding(bottom = 16.dp) // Réduit l'espacement entre la question et les réponses
+            )
+
+            // Liste des réponses
+            val answers = listOf(
+                questions.first().ansA,
+                questions.first().ansB,
+                questions.first().ansC,
+                questions.first().ansD
+            )
+
+            // Pour chaque réponse, on applique une Box avec un espacement uniforme
+            answers.forEach { answer ->
+                Box(
+                    modifier = Modifier
+                        .width(220.dp) // Largeur plus petite pour que ça tienne mieux
+                        .height(50.dp) // Hauteur ajustée
+                        .background(
+                            brush = gradient,
+                            shape = RoundedCornerShape(16.dp) // Coins arrondis
+                        )
+                        .clickable { /* Action pour la réponse */ }
+                        .padding(horizontal = 8.dp), // Padding interne
+                    contentAlignment = Alignment.Center
+                ) {
+                    Text(
+                        text = answer,
+                        color = Color.White,
+                        fontSize = 18.sp // Taille du texte ajustée pour un écran portrait
+                    )
+                }
+                Spacer(modifier = Modifier.height(16.dp)) // Espacement réduit entre les réponses
+            }
+        }
+    }
+}
+
+