Add Scrollable Quiz Menu + QuizStub + Navigation

What_The_Fantasy/app/src/main/java/com/example/what_the_fantasy/data/local/QuizStub.kt

@@ -0,0 +1,126 @@
+package com.example.what_the_fantasy.data.local
+
+import com.example.what_the_fantasy.data.model.Quiz
+
+object QuizStub {
+    val quiz1 = Quiz(
+        id = 1,
+        name = "Quiz Seigneur des Anneaux",
+        questions = listOf(
+            QuestionStub.question1,
+            QuestionStub.question4,
+            QuestionStub.question8,
+            QuestionStub.question9
+        ),
+        img = "lotr"
+    )
+
+    val quiz2 = Quiz(
+        id = 2,
+        name = "Quiz Harry Potter",
+        questions = listOf(
+            QuestionStub.question2,
+            QuestionStub.question7,
+            QuestionStub.question10
+        ),
+        img = "hp"
+    )
+
+    val quiz3 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+    val quiz4 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+
+    val quiz5 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+    val quiz6 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+    val quiz7 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+    val quiz8 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+    val quiz9 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+    val quiz10 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+    val quiz11 = Quiz(
+        id = 3,
+        name = "Quiz Divers Fantasy",
+        questions = listOf(
+            QuestionStub.question3,
+            QuestionStub.question5,
+            QuestionStub.question6
+        ),
+        img = "hp"
+    )
+
+    val allQuizzes: List<Quiz> = listOf(quiz1, quiz2, quiz3, quiz4, quiz5, quiz6, quiz7, quiz8, quiz9, quiz10, quiz11)
+
+    fun getQuizById(id: Int): Quiz? {
+        return allQuizzes.find { it.id == id }
+    }
+}

What_The_Fantasy/app/src/main/java/com/example/what_the_fantasy/data/model/Quiz.kt

@@ -0,0 +1,8 @@
+package com.example.what_the_fantasy.data.model
+
+class Quiz (
+    val id : Int,
+    val name : String,
+    val questions : List<Question>,
+    val img : String
+)

What_The_Fantasy/app/src/main/java/com/example/what_the_fantasy/ui/navigations/AppNavigator.kt

@@ -27,7 +27,10 @@ sealed class Destination(val route: String) {
         fun createRoute(userIndex: Int) = "Profil/$userIndex"  // Fonction pour créer la route avec l'index
     }
     data object QuizMenu : Destination("QuizMenu")
-    data object Quiz : Destination("Quiz")
+    data object Quiz : Destination("Quiz/{idQuiz}") {
+        // Ajout paramètre idQuiz
+        fun createId(idQuiz : Int) = "Quiz/$idQuiz"
+    }
     data object QuizEnd : Destination("QuizEnd/{idQuiz}/{pts}") {
         // Ajout paramètres idQuiz et pts
         fun createIdAndPts(idQuiz : Int, pts : Int) = "QuizEnd/$idQuiz/$pts"
@@ -56,15 +59,19 @@ fun AppNavigator() {
         composable(Destination.Favorite.route) { FavoritePage() }
         composable(Destination.QuizMenu.route) {
             QuizMenu(
-                navControllerQuiz = { navController.navigate(Destination.Quiz.route) }
+                navControllerQuiz = { id ->
+                    navController.navigate(Destination.Quiz.createId(id))
+                }
             )
         }
-        composable(Destination.Quiz.route) {
+        composable(Destination.Quiz.route) { backStackEntry ->
+            val idQuiz = backStackEntry.arguments?.getString("idQuiz")?.toInt() ?: 0
             QuizPage(
                 navControllerQuizEnd = { idQuiz, pts ->
                     navController.navigate(Destination.QuizEnd.createIdAndPts(idQuiz, pts))
                 },
-                navControllerQuizMenu = { navController.navigate(Destination.QuizMenu.route) }
+                navControllerQuizMenu = { navController.navigate(Destination.QuizMenu.route) },
+                idQuiz
             )
         }
         composable(Destination.QuizEnd.route) { backStackEntry ->

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

@@ -2,116 +2,159 @@ package com.example.what_the_fantasy.ui.screens
 
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
+import androidx.compose.foundation.border
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.scrollable
+import androidx.compose.foundation.horizontalScroll
+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.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.layout.size
-import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.verticalScroll
+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.clip
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.TextStyle
+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 com.example.what_the_fantasy.R
+import com.example.what_the_fantasy.data.local.QuizStub
 
 
 @Composable
-fun QuizMenu(navControllerQuiz: () -> Unit) {
-    Row(
-        modifier = Modifier
-            .fillMaxSize()
-            .background(Color(0xFF100C1B))
-            .padding(top = 100.dp)
-    ) {
-        Spacer(modifier = Modifier.weight(0.1f))
+fun QuizMenu(navControllerQuiz: (Int) -> Unit) {
 
-        Column(
-            modifier = Modifier
-                .weight(0.9f)
-                .fillMaxHeight(),
-            horizontalAlignment = Alignment.CenterHorizontally
+    Column (
+        modifier = Modifier.fillMaxSize().background(Color(0xFF100C1B))
     ) {
-            Box(
+        // Bandeau supérieur
+        Row(
             modifier = Modifier
-                    .size(width = 150.dp, height = 100.dp)
-                    .padding(8.dp)
-                    .clickable {
-                        navControllerQuiz()
-                    }
+                .fillMaxWidth()
+                .weight(0.1f)
+                //background(Color(0xFF300052))
+                .padding(20.dp),
+            horizontalArrangement = Arrangement.SpaceBetween,
+            verticalAlignment = Alignment.CenterVertically
         ) {
             Image(
-                    painter = painterResource(id = R.drawable.quiz),
-                    contentDescription = "Quiz 1",
-                    modifier = Modifier.fillMaxSize(),
-                    contentScale = ContentScale.Crop
+                painter = painterResource(id = R.drawable.profile_icon),
+                contentDescription = "Profil"
             )
-            }
-
-            Box(
-                modifier = Modifier
-                    .size(width = 150.dp, height = 100.dp)
-                    .padding(8.dp)
-                    .clickable {
-                        navControllerQuiz()
-                    }
-            ) {
             Image(
-                    painter = painterResource(id = R.drawable.quiz),
-                    contentDescription = "Quiz 2",
-                    modifier = Modifier.fillMaxSize(),
-                    contentScale = ContentScale.Crop
+                painter = painterResource(id = R.drawable.toggle),
+                contentDescription = "Profil"
             )
         }
-        }
-
-        Spacer(modifier = Modifier.width(10.dp))
 
+        // Contenu princiapl
         Column(
             modifier = Modifier
                 .weight(0.9f)
-                .fillMaxHeight(),
+                .fillMaxSize()
+                .padding(20.dp),
             horizontalAlignment = Alignment.CenterHorizontally
         ) {
-            Box(
+            Text(
+                text = "▶ Menu des Quiz ◀",
+                color = Color.White,
+                style = TextStyle(fontSize = 25.sp, fontWeight = FontWeight.Bold, textAlign = TextAlign.Center)
+            )
+            Spacer(Modifier.height(20.dp))
+            Column (
                 modifier = Modifier
-                    .size(width = 150.dp, height = 100.dp)
-                    .padding(8.dp)
-                    .clickable {
-                        navControllerQuiz()
-                    }
+                    .background(brush = gradient, shape = RoundedCornerShape(20.dp))
+                    .fillMaxSize()
+                    .padding(vertical = 30.dp)
+                    .verticalScroll(rememberScrollState()),
+                horizontalAlignment = Alignment.CenterHorizontally
+            ) {
+                val quizzes = QuizStub.allQuizzes.chunked(2)
+                val context = LocalContext.current
+                for (rowQuizzes in quizzes) {
+                    Row(
+                        modifier = Modifier.fillMaxWidth(),
+                        horizontalArrangement = Arrangement.SpaceEvenly
+                    ) {
+                        for (quiz in rowQuizzes) {
+                            val imageResId = context.resources.getIdentifier(
+                                quiz.img,
+                                "drawable",
+                                context.packageName
+                            )
+                            Column (
+                                modifier = Modifier
+                                    .size(width = 150.dp, height = 145.dp)
+                                    .clickable { navControllerQuiz(quiz.id) },
                             ) {
                                 Image(
-                    painter = painterResource(id = R.drawable.quiz),
-                    contentDescription = "Quiz 3",
-                    modifier = Modifier.fillMaxSize(),
+                                    painter = painterResource(id = imageResId),
+                                    contentDescription = quiz.name,
+                                    modifier = Modifier
+                                        .size(width = 150.dp, height = 100.dp)
+                                        .clip(shape = RoundedCornerShape(20.dp)),
                                     contentScale = ContentScale.Crop
                                 )
+                                Spacer(Modifier.height(10.dp))
+                                Text(
+                                    text = quiz.name,
+                                    style = TextStyle(
+                                        fontSize = 17.sp,
+                                        fontWeight = FontWeight.Medium,
+                                        textAlign = TextAlign.Center,
+                                        color = Color.White
+                                    )
+                                )
+                            }
+                        }
+                    }
+                    Spacer(Modifier.height(30.dp))
+                }
+            }
         }
 
-            Box(
+        // Bandeau inférieur
+        Row(
             modifier = Modifier
-                    .size(width = 150.dp, height = 100.dp)
-                    .padding(8.dp)
-                    .clickable {
-                        navControllerQuiz()
-                    }
+                .fillMaxWidth()
+                .weight(0.1f)
+                .background(Color(0xFF300052))
+                .padding(20.dp),
+            horizontalArrangement = Arrangement.SpaceAround,
+            verticalAlignment = Alignment.CenterVertically
         ) {
+            // Bouton Likes
             Image(
-                    painter = painterResource(id = R.drawable.quiz),
-                    contentDescription = "Quiz 4",
-                    modifier = Modifier.fillMaxSize(),
-                    contentScale = ContentScale.Crop
+                painter = painterResource(id = R.drawable.like_icon),
+                contentDescription = "Bouton"
+            )
+            // Bouton WhatTheFantasy
+            Image(
+                painter = painterResource(R.drawable.wf_logo),
+                contentDescription = "Menu Button",
+                Modifier.clickable { }
+            )
+            // Bouton Quiz
+            Image(
+                painter = painterResource(id = R.drawable.quiz_icon),
+                contentDescription = "Bouton"
             )
         }
     }
-
-        Spacer(modifier = Modifier.weight(0.1f))
-    }
 }

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

@@ -25,7 +25,8 @@ import com.example.what_the_fantasy.data.local.QuestionStub
 @Composable
 fun QuizPage(
     navControllerQuizEnd: (Int, Int) -> Unit,
-    navControllerQuizMenu: () -> Unit
+    navControllerQuizMenu: () -> Unit,
+    id: Int
     ) {
     val questions = QuestionStub.allQuestions
     var idCurrentQuestion by remember { mutableIntStateOf(0) }