feat : quiz multi style + debut chrono/progressBar
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
parent
3c7f0a02c4
commit
d687d2cf96
@ -0,0 +1,44 @@
|
|||||||
|
package com.example.mathseduc
|
||||||
|
|
||||||
|
import android.os.Bundle
|
||||||
|
import android.os.CountDownTimer
|
||||||
|
import androidx.activity.ComponentActivity
|
||||||
|
import androidx.activity.compose.setContent
|
||||||
|
import androidx.compose.runtime.Composable
|
||||||
|
import androidx.compose.ui.tooling.preview.Preview
|
||||||
|
import com.example.mathseduc.ui.QuizMultiScreen
|
||||||
|
import com.example.mathseduc.ui.theme.MathsEducTheme
|
||||||
|
|
||||||
|
|
||||||
|
class QuizMultiActivity : ComponentActivity() {
|
||||||
|
companion object {
|
||||||
|
var countDownTimer: CountDownTimer? = null
|
||||||
|
}
|
||||||
|
|
||||||
|
override fun onCreate(savedInstanceState: Bundle?) {
|
||||||
|
super.onCreate(savedInstanceState)
|
||||||
|
|
||||||
|
setContent {
|
||||||
|
MathsEducTheme {
|
||||||
|
QuizMultiScreen()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
override fun onDestroy() {
|
||||||
|
super.onDestroy()
|
||||||
|
// Stop the CountDownTimer to avoid memory leaks
|
||||||
|
countDownTimer?.cancel()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
@Preview(showBackground = true)
|
||||||
|
@Composable
|
||||||
|
fun QuizMultiScreenPreview() {
|
||||||
|
MathsEducTheme {
|
||||||
|
QuizMultiScreen()
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
@ -0,0 +1,234 @@
|
|||||||
|
package com.example.mathseduc.ui
|
||||||
|
|
||||||
|
import android.os.CountDownTimer
|
||||||
|
import androidx.compose.foundation.background
|
||||||
|
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.padding
|
||||||
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||||
|
import androidx.compose.material3.Button
|
||||||
|
import androidx.compose.material3.ButtonDefaults
|
||||||
|
import androidx.compose.material3.CircularProgressIndicator
|
||||||
|
import androidx.compose.material3.LinearProgressIndicator
|
||||||
|
import androidx.compose.material3.Text
|
||||||
|
import androidx.compose.runtime.Composable
|
||||||
|
import androidx.compose.runtime.DisposableEffect
|
||||||
|
import androidx.compose.runtime.getValue
|
||||||
|
import androidx.compose.runtime.mutableStateOf
|
||||||
|
import androidx.compose.runtime.remember
|
||||||
|
import androidx.compose.runtime.setValue
|
||||||
|
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 com.example.mathseduc.QuizMultiActivity
|
||||||
|
import com.example.mathseduc.ui.theme.Colors
|
||||||
|
import com.example.mathseduc.ui.theme.MathsEducTheme
|
||||||
|
|
||||||
|
|
||||||
|
@Preview
|
||||||
|
@Composable
|
||||||
|
fun QuizMultiPreview() {
|
||||||
|
MathsEducTheme {
|
||||||
|
QuizMultiScreen()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@Composable
|
||||||
|
fun QuizMultiScreen() {
|
||||||
|
var progressBar1Value by remember { mutableStateOf(0.0f) }
|
||||||
|
var chronoValue by remember { mutableStateOf(0.0f) }
|
||||||
|
|
||||||
|
Column(
|
||||||
|
modifier = Modifier
|
||||||
|
.fillMaxSize()
|
||||||
|
.padding(16.dp),
|
||||||
|
verticalArrangement = Arrangement.SpaceBetween
|
||||||
|
) {
|
||||||
|
// ProgressBar1
|
||||||
|
LinearProgressIndicator(
|
||||||
|
progress = progressBar1Value/100f,
|
||||||
|
modifier = Modifier.fillMaxWidth()
|
||||||
|
)
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.025f))
|
||||||
|
|
||||||
|
LinearProgressIndicator(
|
||||||
|
progress = 0.05f,
|
||||||
|
modifier = Modifier.fillMaxWidth()
|
||||||
|
)
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.025f))
|
||||||
|
|
||||||
|
LinearProgressIndicator(
|
||||||
|
progress = 0.05f,
|
||||||
|
modifier = Modifier.fillMaxWidth()
|
||||||
|
)
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.025f))
|
||||||
|
|
||||||
|
LinearProgressIndicator(
|
||||||
|
progress = 1f,
|
||||||
|
modifier = Modifier.fillMaxWidth()
|
||||||
|
)
|
||||||
|
|
||||||
|
// Chrono ProgressBar
|
||||||
|
CircularProgressIndicator(
|
||||||
|
progress = chronoValue/30f,
|
||||||
|
modifier = Modifier
|
||||||
|
.padding(horizontal = 10.dp)
|
||||||
|
)
|
||||||
|
|
||||||
|
Row(
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(2f)
|
||||||
|
.padding(vertical = 20.dp)
|
||||||
|
) {
|
||||||
|
Spacer(modifier = Modifier.weight(1f))
|
||||||
|
|
||||||
|
Box(
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(5f)
|
||||||
|
.background(color = Color.Gray, shape = RoundedCornerShape(8.dp))
|
||||||
|
) {
|
||||||
|
Text(
|
||||||
|
text = "Question",
|
||||||
|
modifier = Modifier
|
||||||
|
.padding(16.dp),
|
||||||
|
color = Color.White,
|
||||||
|
fontSize = 20.sp,
|
||||||
|
textAlign = TextAlign.Center
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(1f))
|
||||||
|
}
|
||||||
|
|
||||||
|
Column(modifier = Modifier.weight(1f)) {
|
||||||
|
Row(
|
||||||
|
modifier = Modifier
|
||||||
|
.fillMaxWidth()
|
||||||
|
.padding(bottom = 10.dp)
|
||||||
|
) {
|
||||||
|
Spacer(modifier = Modifier.weight(0.25f))
|
||||||
|
|
||||||
|
Button(
|
||||||
|
onClick = { /* Handle button click */ },
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(2f),
|
||||||
|
shape = RoundedCornerShape(15),
|
||||||
|
colors = ButtonDefaults.buttonColors(Colors.Blue),
|
||||||
|
|
||||||
|
) {
|
||||||
|
Text(text = "Answer1")
|
||||||
|
}
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.5f))
|
||||||
|
|
||||||
|
Button(
|
||||||
|
onClick = { /* Handle button click */ },
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(2f),
|
||||||
|
shape = RoundedCornerShape(15),
|
||||||
|
colors = ButtonDefaults.buttonColors(Colors.Green),
|
||||||
|
) {
|
||||||
|
Text(text = "Answer2")
|
||||||
|
}
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.25f))
|
||||||
|
}
|
||||||
|
|
||||||
|
Row(
|
||||||
|
modifier = Modifier
|
||||||
|
.fillMaxWidth()
|
||||||
|
) {
|
||||||
|
Spacer(modifier = Modifier.weight(0.25f))
|
||||||
|
|
||||||
|
Button(
|
||||||
|
onClick = { /* Handle button click */ },
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(2f),
|
||||||
|
shape = RoundedCornerShape(15),
|
||||||
|
colors = ButtonDefaults.buttonColors(Colors.Orange),
|
||||||
|
) {
|
||||||
|
Text(text = "Answer3")
|
||||||
|
}
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.5f))
|
||||||
|
|
||||||
|
Button(
|
||||||
|
onClick = { /* Handle button click */ },
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(2f),
|
||||||
|
shape = RoundedCornerShape(15),
|
||||||
|
colors = ButtonDefaults.buttonColors(Colors.Purple500),
|
||||||
|
) {
|
||||||
|
Text(text = "Answer4")
|
||||||
|
}
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.25f))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Row(
|
||||||
|
modifier = Modifier
|
||||||
|
.fillMaxWidth()
|
||||||
|
.weight(1f)
|
||||||
|
.padding(vertical = 10.dp)
|
||||||
|
) {
|
||||||
|
Spacer(modifier = Modifier.weight(1f))
|
||||||
|
|
||||||
|
Button(
|
||||||
|
onClick = { /* Handle button click (Passer) */ },
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(2f),
|
||||||
|
shape = RoundedCornerShape(15),
|
||||||
|
colors = ButtonDefaults.buttonColors(Colors.Red),
|
||||||
|
) {
|
||||||
|
Text(text = "Passer")
|
||||||
|
}
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(0.15f))
|
||||||
|
|
||||||
|
Button(
|
||||||
|
onClick = {
|
||||||
|
progressBar1Value += 3f
|
||||||
|
},
|
||||||
|
modifier = Modifier
|
||||||
|
.weight(2f),
|
||||||
|
shape = RoundedCornerShape(15),
|
||||||
|
colors = ButtonDefaults.buttonColors(Colors.Green),
|
||||||
|
) {
|
||||||
|
Text(text = "Valider")
|
||||||
|
}
|
||||||
|
|
||||||
|
Spacer(modifier = Modifier.weight(1f))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// CountDownTimer
|
||||||
|
DisposableEffect(Unit) {
|
||||||
|
QuizMultiActivity.countDownTimer = object : CountDownTimer(30 * 1000, 1000) {
|
||||||
|
override fun onTick(millisUntilFinished: Long) {
|
||||||
|
progressBar1Value += 1f // Increment ProgressBar1 value every second
|
||||||
|
chronoValue += 1.0f // Increment Chrono value every second
|
||||||
|
}
|
||||||
|
|
||||||
|
override fun onFinish() {
|
||||||
|
// Code to execute when the timer is finished
|
||||||
|
}
|
||||||
|
}
|
||||||
|
QuizMultiActivity.countDownTimer?.start()
|
||||||
|
|
||||||
|
onDispose {
|
||||||
|
// Stop the CountDownTimer to avoid memory leaks
|
||||||
|
QuizMultiActivity.countDownTimer?.cancel()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in new issue