More styling for End Card
This commit is contained in:
parent
6a381c6b68
commit
6d5a150ee4
3 changed files with 118 additions and 90 deletions
|
@ -6,9 +6,11 @@ import com.github.ajalt.clikt.core.CliktCommand
|
|||
import com.github.ajalt.clikt.parameters.options.default
|
||||
import com.github.ajalt.clikt.parameters.options.option
|
||||
import com.github.ajalt.clikt.parameters.types.file
|
||||
import components.EndCard
|
||||
import components.QuestionResolution
|
||||
import data.*
|
||||
import components.endcard.EndCard
|
||||
import data.Game
|
||||
import data.Player
|
||||
import data.QuestionData
|
||||
import kotlinx.serialization.ExperimentalSerializationApi
|
||||
import kotlinx.serialization.decodeFromString
|
||||
import kotlinx.serialization.json.Json
|
||||
|
|
|
@ -1,88 +0,0 @@
|
|||
package components
|
||||
|
||||
import androidx.compose.foundation.BorderStroke
|
||||
import androidx.compose.foundation.border
|
||||
import androidx.compose.foundation.layout.*
|
||||
import androidx.compose.material.Button
|
||||
import androidx.compose.material.ButtonDefaults
|
||||
import androidx.compose.material.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.em
|
||||
import components.common.BorderBox
|
||||
import data.Player
|
||||
import data.toColor
|
||||
|
||||
@Suppress("FunctionName")
|
||||
@Composable
|
||||
fun EndCard(
|
||||
playerPointMap: MutableMap<Player, Long>,
|
||||
reviewBoard: () -> Unit,
|
||||
close: () -> Unit
|
||||
) {
|
||||
val sortedPlayersPoints = playerPointMap.entries
|
||||
.sortedByDescending { it.value }
|
||||
val firstPlayer = sortedPlayersPoints.first()
|
||||
.key
|
||||
BorderBox(
|
||||
borderColor = firstPlayer.color.toColor()
|
||||
) {
|
||||
Column(
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
verticalArrangement = Arrangement.Center
|
||||
) {
|
||||
Row {
|
||||
Text(text = "Congratulations, ${firstPlayer.name}!", fontSize = 5.em)
|
||||
}
|
||||
Spacer(modifier = Modifier.fillMaxWidth().height(25.dp))
|
||||
Row {
|
||||
Column {
|
||||
for ((index, data) in sortedPlayersPoints.withIndex()) {
|
||||
val player = data.key
|
||||
Box(
|
||||
modifier = Modifier.border(border = BorderStroke(5.dp, player.color.toColor()))
|
||||
.padding(10.dp),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Row(horizontalArrangement = Arrangement.SpaceBetween) {
|
||||
Text(text = "${index + 1}.", fontSize = 3.em)
|
||||
Text(text = "${player.name} (${data.value} Pts.)", fontSize = 3.em)
|
||||
}
|
||||
}
|
||||
Spacer(modifier = Modifier.height(5.dp))
|
||||
}
|
||||
}
|
||||
}
|
||||
Spacer(modifier = Modifier.fillMaxWidth().height(25.dp))
|
||||
Row(
|
||||
horizontalArrangement = Arrangement.SpaceAround,
|
||||
verticalAlignment = Alignment.Bottom
|
||||
) {
|
||||
Button(
|
||||
onClick = reviewBoard,
|
||||
colors = ButtonDefaults.buttonColors(Color.DarkGray)
|
||||
) {
|
||||
Text(
|
||||
text = "Review",
|
||||
fontSize = 5.em,
|
||||
color = Color.White
|
||||
)
|
||||
}
|
||||
Spacer(modifier = Modifier.width(5.dp))
|
||||
Button(
|
||||
onClick = close,
|
||||
colors = ButtonDefaults.buttonColors(Color.Red)
|
||||
) {
|
||||
Text(
|
||||
text = "Close",
|
||||
fontSize = 5.em,
|
||||
color = Color.White
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
114
src/main/kotlin/components/endcard/EndCard.kt
Normal file
114
src/main/kotlin/components/endcard/EndCard.kt
Normal file
|
@ -0,0 +1,114 @@
|
|||
package components.endcard
|
||||
|
||||
import androidx.compose.foundation.BorderStroke
|
||||
import androidx.compose.foundation.border
|
||||
import androidx.compose.foundation.layout.*
|
||||
import androidx.compose.material.Button
|
||||
import androidx.compose.material.ButtonDefaults
|
||||
import androidx.compose.material.Text
|
||||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.ui.Alignment
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.unit.TextUnit
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.em
|
||||
import components.common.BorderBox
|
||||
import data.Player
|
||||
import data.toColor
|
||||
|
||||
@Suppress("FunctionName")
|
||||
@Composable
|
||||
fun EndCard(
|
||||
playerPointMap: Map<Player, Long>,
|
||||
reviewBoard: () -> Unit,
|
||||
close: () -> Unit
|
||||
) {
|
||||
val sortedPlayersPoints = playerPointMap.entries
|
||||
.sortedByDescending { it.value }
|
||||
val firstPlayer = sortedPlayersPoints.first()
|
||||
.key
|
||||
BorderBox(
|
||||
borderColor = firstPlayer.color.toColor()
|
||||
) {
|
||||
Column(
|
||||
horizontalAlignment = Alignment.CenterHorizontally,
|
||||
verticalArrangement = Arrangement.Center
|
||||
) {
|
||||
val fontSizeLarge = 5.em
|
||||
val spacerHeight = 25.dp
|
||||
val fontSizeSmall = 3.em
|
||||
Row {
|
||||
Text(text = "Congratulations, ${firstPlayer.name}!", fontSize = fontSizeLarge)
|
||||
}
|
||||
Spacer(modifier = Modifier.fillMaxWidth().height(spacerHeight))
|
||||
HighScoreList(sortedPlayersPoints, fontSizeSmall)
|
||||
Spacer(modifier = Modifier.fillMaxWidth().height(spacerHeight))
|
||||
EndCardButtons(reviewBoard, close)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Suppress("FunctionName")
|
||||
@Composable
|
||||
fun HighScoreList(sortedPlayersPoints: List<Map.Entry<Player, Long>>, fontSize: TextUnit) {
|
||||
Row {
|
||||
Column {
|
||||
for ((index, data) in sortedPlayersPoints.withIndex()) {
|
||||
HighScoreListEntry(player = data.key, rank = index + 1, points = data.value, fontSize = fontSize)
|
||||
Spacer(modifier = Modifier.height(5.dp))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Suppress("FunctionName")
|
||||
@Composable
|
||||
fun HighScoreListEntry(
|
||||
player: Player,
|
||||
rank: Int,
|
||||
points: Long,
|
||||
fontSize: TextUnit
|
||||
) {
|
||||
Box(
|
||||
modifier = Modifier.border(border = BorderStroke(5.dp, player.color.toColor()))
|
||||
.padding(10.dp),
|
||||
contentAlignment = Alignment.Center
|
||||
) {
|
||||
Row(horizontalArrangement = Arrangement.SpaceBetween) {
|
||||
Text(text = "$rank.", fontSize = fontSize)
|
||||
Text(text = "${player.name} ($points Pts.)", fontSize = 3.em)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Suppress("FunctionName")
|
||||
@Composable
|
||||
fun EndCardButtons(reviewBoard: () -> Unit, close: () -> Unit) {
|
||||
Row(
|
||||
horizontalArrangement = Arrangement.SpaceAround,
|
||||
verticalAlignment = Alignment.Bottom
|
||||
) {
|
||||
Button(
|
||||
onClick = reviewBoard,
|
||||
colors = ButtonDefaults.buttonColors(Color.DarkGray)
|
||||
) {
|
||||
Text(
|
||||
text = "Review",
|
||||
fontSize = 5.em,
|
||||
color = Color.White
|
||||
)
|
||||
}
|
||||
Spacer(modifier = Modifier.width(5.dp))
|
||||
Button(
|
||||
onClick = close,
|
||||
colors = ButtonDefaults.buttonColors(Color.Red)
|
||||
) {
|
||||
Text(
|
||||
text = "Close",
|
||||
fontSize = 5.em,
|
||||
color = Color.White
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue