Add collapsable section to the summary page.

This commit is contained in:
Thomas Andres Gomez 2023-12-23 18:11:42 +01:00
parent ff88c99342
commit 0281260912
10 changed files with 339 additions and 177 deletions

View file

@ -76,9 +76,11 @@ fun HomeNavHost(
Text(text = stringResource(id = R.string.app_name))
},
actions = {
IconButton(onClick = { screen.navigateToSummary() }) {
IconButton(
onClick = { screen.navigateToSummary() },
) {
Icon(
painter = painterResource(id = R.drawable.ic_d20_24),
painter = painterResource(id = R.drawable.ic_crowned_skull_24),
contentDescription = null,
)
}

View file

@ -28,6 +28,7 @@ import androidx.compose.runtime.Composable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
@ -59,6 +60,12 @@ fun SummaryScreen(
refreshing = false,
onRefresh = { },
)
val extendAttribute = rememberSaveable { mutableStateOf(true) }
val extendCharacteristic = rememberSaveable { mutableStateOf(true) }
val extendSavingThrows = rememberSaveable { mutableStateOf(true) }
val extendProficiencies = rememberSaveable { mutableStateOf(true) }
val extendPassives = rememberSaveable { mutableStateOf(true) }
val extendSpells = rememberSaveable { mutableStateOf(true) }
Surface(
modifier = Modifier.fillMaxSize(),
@ -75,12 +82,24 @@ fun SummaryScreen(
statistics = {
StatisticSummary(
summary = statisticsViewModel.summary,
extendAttribute = extendAttribute,
extendCharacteristic = extendCharacteristic,
extendSavingThrows = extendSavingThrows,
extendProficiencies = extendProficiencies,
extendPassives = extendPassives,
extendSpells = extendSpells,
onClass = {
screen.navigateToCharacterSheet(name = it.label)
},
onDice = {
statisticsViewModel.showDetail(dice = it)
},
onAttribute = { extendAttribute.value = it },
onCharacteristic = { extendCharacteristic.value = it },
onSavingThrows = { extendSavingThrows.value = it },
onProficiencies = { extendProficiencies.value = it },
onPassives = { extendPassives.value = it },
onSpells = { extendSpells.value = it },
)
},
)

View file

@ -1,6 +1,8 @@
package com.pixelized.rplexicon.ui.screens.summary.composable
import android.content.res.Configuration
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CutCornerShape
@ -10,6 +12,8 @@ import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -36,6 +40,8 @@ data class AttributesSummaryUio(
fun AttributesSummary(
modifier: Modifier = Modifier,
attributes: AttributesSummaryUio,
extended: State<Boolean>,
onClick: () -> Unit,
) {
Column(
modifier = Modifier
@ -43,10 +49,15 @@ fun AttributesSummary(
inner = remember { RoundedCornerShape(size = 8.dp) },
outline = remember { CutCornerShape(size = 16.dp) },
)
.clickable(onClick = onClick)
.padding(start = 8.dp, top = 4.dp, bottom = 4.dp)
.then(other = modifier),
horizontalAlignment = Alignment.CenterHorizontally,
) {
AnimatedVisibility(
visible = extended.value,
) {
Column {
SummaryRow(
row = attributes.hp,
color = MaterialTheme.colorScheme.primary,
@ -63,6 +74,8 @@ fun AttributesSummary(
SummaryRow(
row = attributes.speed,
)
}
}
Text(
modifier = Modifier.padding(vertical = 4.dp),
style = MaterialTheme.typography.labelSmall,
@ -78,7 +91,9 @@ private fun StatsSummaryPreview() {
LexiconTheme {
Surface {
AttributesSummary(
attributes = rememberAttributesSummary()
attributes = rememberAttributesSummary(),
extended = remember { mutableStateOf(true) },
onClick = { },
)
}
}

View file

@ -1,6 +1,8 @@
package com.pixelized.rplexicon.ui.screens.summary.composable
import android.content.res.Configuration
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.padding
@ -11,6 +13,8 @@ import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -39,6 +43,8 @@ fun CharacteristicsSummary(
modifier: Modifier = Modifier,
padding: PaddingValues = PaddingValues(start = 8.dp, top = 4.dp, bottom = 4.dp),
characteristics: CharacteristicsSummaryUio,
extended: State<Boolean>,
onClick: () -> Unit,
) {
Column(
modifier = Modifier
@ -46,10 +52,15 @@ fun CharacteristicsSummary(
inner = remember { RoundedCornerShape(size = 8.dp) },
outline = remember { CutCornerShape(size = 16.dp) },
)
.clickable(onClick = onClick)
.padding(paddingValues = padding)
.then(other = modifier),
horizontalAlignment = Alignment.CenterHorizontally,
) {
AnimatedVisibility(
visible = extended.value,
) {
Column {
SummaryRow(
row = characteristics.strength,
)
@ -68,6 +79,8 @@ fun CharacteristicsSummary(
SummaryRow(
row = characteristics.charisma,
)
}
}
Text(
modifier = Modifier.padding(vertical = 4.dp),
style = MaterialTheme.typography.labelSmall,
@ -84,6 +97,8 @@ private fun CharacteristicsSummaryPreview() {
Surface {
CharacteristicsSummary(
characteristics = rememberCharacteristicsSummary(),
extended = remember { mutableStateOf(false) },
onClick = { },
)
}
}

View file

@ -1,6 +1,8 @@
package com.pixelized.rplexicon.ui.screens.summary.composable
import android.content.res.Configuration
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CutCornerShape
@ -10,6 +12,8 @@ import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -34,6 +38,8 @@ data class PassivesSummaryUio(
fun PassivesSummary(
modifier: Modifier = Modifier,
passives: PassivesSummaryUio,
extended: State<Boolean>,
onClick: () -> Unit,
) {
Column(
modifier = Modifier
@ -41,10 +47,15 @@ fun PassivesSummary(
inner = remember { RoundedCornerShape(size = 8.dp) },
outline = remember { CutCornerShape(size = 16.dp) },
)
.clickable(onClick = onClick)
.padding(start = 8.dp, top = 4.dp, bottom = 4.dp)
.then(other = modifier),
horizontalAlignment = Alignment.CenterHorizontally,
) {
AnimatedVisibility(
visible = extended.value,
) {
Column {
SummaryRow(
row = passives.perception,
)
@ -54,6 +65,8 @@ fun PassivesSummary(
SummaryRow(
row = passives.insight,
)
}
}
Text(
modifier = Modifier.padding(vertical = 4.dp),
style = MaterialTheme.typography.labelSmall,
@ -70,6 +83,8 @@ private fun PassivesSummaryPreview() {
Surface {
PassivesSummary(
passives = rememberPassivesSummary(),
extended = remember { mutableStateOf(true) },
onClick = { },
)
}
}

View file

@ -1,6 +1,8 @@
package com.pixelized.rplexicon.ui.screens.summary.composable
import android.content.res.Configuration
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CutCornerShape
@ -10,6 +12,8 @@ import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -49,6 +53,8 @@ data class ProficiencySummaryUio(
fun ProficiencySummary(
modifier: Modifier = Modifier,
proficiencies: ProficiencySummaryUio,
extended: State<Boolean>,
onClick: () -> Unit,
) {
Column(
modifier = Modifier
@ -56,10 +62,15 @@ fun ProficiencySummary(
inner = remember { RoundedCornerShape(size = 8.dp) },
outline = remember { CutCornerShape(size = 16.dp) },
)
.clickable(onClick = onClick)
.padding(start = 8.dp, top = 4.dp, bottom = 4.dp)
.then(other = modifier),
horizontalAlignment = Alignment.CenterHorizontally,
) {
AnimatedVisibility(
visible = extended.value,
) {
Column {
SummaryRow(
row = proficiencies.acrobatics,
)
@ -114,6 +125,8 @@ fun ProficiencySummary(
SummaryRow(
row = proficiencies.deception,
)
}
}
Text(
modifier = Modifier.padding(vertical = 4.dp),
style = MaterialTheme.typography.labelSmall,
@ -130,6 +143,8 @@ private fun ProficiencySummaryPreview() {
Surface {
ProficiencySummary(
proficiencies = rememberProficienciesSummary(),
extended = remember { mutableStateOf(true) },
onClick = { },
)
}
}

View file

@ -1,6 +1,8 @@
package com.pixelized.rplexicon.ui.screens.summary.composable
import android.content.res.Configuration
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CutCornerShape
@ -10,6 +12,8 @@ import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -36,7 +40,9 @@ data class SavingThrowsSummaryUio(
@Composable
fun SavingThrowsSummary(
modifier: Modifier = Modifier,
savingThrows: SavingThrowsSummaryUio
savingThrows: SavingThrowsSummaryUio,
extended: State<Boolean>,
onClick: () -> Unit,
) {
Column(
modifier = Modifier
@ -44,10 +50,15 @@ fun SavingThrowsSummary(
inner = remember { RoundedCornerShape(size = 8.dp) },
outline = remember { CutCornerShape(size = 16.dp) },
)
.clickable(onClick = onClick)
.padding(start = 8.dp, top = 4.dp, bottom = 4.dp)
.then(other = modifier),
horizontalAlignment = Alignment.CenterHorizontally,
) {
AnimatedVisibility(
visible = extended.value,
) {
Column {
SummaryRow(
row = savingThrows.strength,
)
@ -66,6 +77,8 @@ fun SavingThrowsSummary(
SummaryRow(
row = savingThrows.charisma,
)
}
}
Text(
modifier = Modifier.padding(vertical = 4.dp),
style = MaterialTheme.typography.labelSmall,
@ -82,6 +95,8 @@ private fun SavingThrowsSummaryPreview() {
Surface {
SavingThrowsSummary(
savingThrows = rememberSavingThrowsSummary(),
extended = remember { mutableStateOf(true) },
onClick = { },
)
}
}

View file

@ -1,6 +1,8 @@
package com.pixelized.rplexicon.ui.screens.summary.composable
import android.content.res.Configuration
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CutCornerShape
@ -11,6 +13,7 @@ import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
@ -45,6 +48,8 @@ fun SpellSummary(
modifier: Modifier = Modifier,
color: Color = MaterialTheme.colorScheme.primary,
spells: SpellSummaryUio,
extended: State<Boolean>,
onClick: () -> Unit,
) {
Column(
modifier = Modifier
@ -52,10 +57,15 @@ fun SpellSummary(
inner = remember { RoundedCornerShape(size = 8.dp) },
outline = remember { CutCornerShape(size = 16.dp) },
)
.clickable(onClick = onClick)
.padding(start = 8.dp, top = 4.dp, bottom = 4.dp)
.then(other = modifier),
horizontalAlignment = Alignment.CenterHorizontally,
) {
AnimatedVisibility(
visible = extended.value,
) {
Column {
SummaryRow(
row = spells.extra,
color = color,
@ -114,6 +124,8 @@ fun SpellSummary(
color = color,
)
}
}
}
Text(
modifier = Modifier.padding(vertical = 4.dp),
style = MaterialTheme.typography.labelSmall,
@ -130,6 +142,8 @@ private fun SpellSummaryPreview() {
Surface {
SpellSummary(
spells = rememberSpellsSummary(),
extended = remember { mutableStateOf(true) },
onClick = { },
)
}
}

View file

@ -20,6 +20,7 @@ import androidx.compose.material3.Surface
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Stable
import androidx.compose.runtime.State
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
@ -71,6 +72,18 @@ fun StatisticSummary(
summary: StatisticSummaryUio,
onClass: (ClassHeaderSummaryUio.Header) -> Unit,
onDice: (ClassHeaderSummaryUio.Dice) -> Unit,
extendAttribute: State<Boolean>,
extendCharacteristic: State<Boolean>,
extendSavingThrows: State<Boolean>,
extendProficiencies: State<Boolean>,
extendPassives: State<Boolean>,
extendSpells: State<Boolean>,
onAttribute: (Boolean) -> Unit,
onCharacteristic: (Boolean) -> Unit,
onSavingThrows: (Boolean) -> Unit,
onProficiencies: (Boolean) -> Unit,
onPassives: (Boolean) -> Unit,
onSpells: (Boolean) -> Unit,
) {
Column(
modifier = Modifier
@ -103,7 +116,10 @@ fun StatisticSummary(
enter = enterTransition(),
) {
AttributesSummary(
modifier = Modifier.fillMaxWidth(),
attributes = summary.attributes,
extended = extendAttribute,
onClick = { onAttribute(extendAttribute.value.not()) },
)
}
AnimatedVisibility(
@ -111,7 +127,10 @@ fun StatisticSummary(
enter = enterTransition(),
) {
CharacteristicsSummary(
modifier = Modifier.fillMaxWidth(),
characteristics = summary.characteristics,
extended = extendCharacteristic,
onClick = { onCharacteristic(extendCharacteristic.value.not()) },
)
}
AnimatedVisibility(
@ -119,7 +138,10 @@ fun StatisticSummary(
enter = enterTransition(),
) {
SavingThrowsSummary(
modifier = Modifier.fillMaxWidth(),
savingThrows = summary.savingThrows,
extended = extendSavingThrows,
onClick = { onSavingThrows(extendSavingThrows.value.not()) },
)
}
AnimatedVisibility(
@ -127,7 +149,10 @@ fun StatisticSummary(
enter = enterTransition(),
) {
ProficiencySummary(
modifier = Modifier.fillMaxWidth(),
proficiencies = summary.proficiencies,
extended = extendProficiencies,
onClick = { onProficiencies(extendProficiencies.value.not()) },
)
}
AnimatedVisibility(
@ -135,7 +160,10 @@ fun StatisticSummary(
enter = enterTransition(),
) {
PassivesSummary(
modifier = Modifier.fillMaxWidth(),
passives = summary.passives,
extended = extendPassives,
onClick = { onPassives(extendPassives.value.not()) },
)
}
AnimatedVisibility(
@ -143,7 +171,10 @@ fun StatisticSummary(
enter = enterTransition(),
) {
SpellSummary(
modifier = Modifier.fillMaxWidth(),
spells = summary.spells,
extended = extendSpells,
onClick = { onSpells(extendSpells.value.not()) },
)
}
}
@ -154,7 +185,7 @@ fun StatisticSummary(
private fun enterTransition(
density: Density = LocalDensity.current,
): EnterTransition {
return fadeIn() + slideInVertically { with(density) { 24.dp.roundToPx() } }
return fadeIn() + slideInVertically { with(density) { 16.dp.roundToPx() } }
}
@Composable
@ -183,6 +214,18 @@ fun StatisticSummaryPreview() {
summary = rememberStatisticSummary(),
onClass = { },
onDice = { },
extendAttribute = remember { mutableStateOf(true) },
extendCharacteristic = remember { mutableStateOf(true) },
extendSavingThrows = remember { mutableStateOf(true) },
extendProficiencies = remember { mutableStateOf(true) },
extendPassives = remember { mutableStateOf(true) },
extendSpells = remember { mutableStateOf(true) },
onAttribute = { },
onCharacteristic = { },
onSavingThrows = { },
onProficiencies = { },
onPassives = { },
onSpells = { },
)
}
}

View file

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="512"
android:viewportHeight="512">
<path
android:fillColor="#000000"
android:pathData="M92.41,13.02l-0.16,156.35c3.06,0.51 6.21,1.38 9.39,2.63 36.5,14.31 74.21,22.43 111.86,25.47l43.4,-60.42 42.32,58.91c36.81,-4.13 72.57,-12.5 105.97,-24.09 3.75,-1.3 7.37,-2.18 10.82,-2.6l1.52,-156.25 -75.82,95.55 -34.08,-95.55 -53.72,103.74 -53.72,-103.74 -35.44,95.55 -72.32,-95.55h-0.01zM256.9,169.09l-28.64,39.86 28.63,39.86 28.64,-39.86 -28.64,-39.86zM86.76,187.55c-2.17,-0.08 -3.84,0.27 -5.01,0.76 -2.35,0.98 -3.17,2.19 -3.5,4.2 -0.64,4.01 2.83,14.35 23.03,21.36 41.7,14.47 84.26,23.75 126.78,26.83l-17.75,-24.7c-38.77,-3.29 -77.69,-11.77 -115.5,-26.6 -3.2,-1.25 -5.88,-1.77 -8.05,-1.85zM420.04,187.74c-2.16,0.05 -5.05,0.51 -8.73,1.79 -33.58,11.65 -69.49,20.22 -106.52,24.65l-19.26,26.82c40.43,-2.6 80.43,-11.29 119.22,-26.96 15.91,-6.43 21.46,-17.81 21.36,-22.36 -0.05,-2.28 -0.28,-2.57 -1.75,-3.27 -0.74,-0.35 -2.16,-0.71 -4.31,-0.66zM401.92,235.18c-42.5,15.87 -86.26,23.86 -130.26,25.12l-14.76,20.55 -14.88,-20.71c-44.99,-1.75 -89.98,-10.23 -133.9,-24.31 -12.78,28.51 -18.94,61.14 -19.6,93.44 37.52,17.5 62.13,39.82 75.56,64.63C177,417.8 179.28,443.62 174.18,467.98c7.72,5.01 16.13,9.14 24.98,12.43l5.56,-47.89 18.56,2.15 -5.93,51.16c9.57,2.21 19.44,3.53 29.38,3.98v-54.67h18.69v54.49c9.9,-0.64 19.7,-2.13 29.16,-4.48l-5.86,-50.47 18.56,-2.15 5.44,46.85c8.75,-3.42 17,-7.64 24.51,-12.69 -5.76,-24.41 -3.77,-49.67 9.01,-72.99 13.28,-24.23 37.72,-46 74.8,-64.29 -0.62,-33.53 -6.69,-66.12 -19.11,-94.23zM135.19,282.18c34.6,0.23 68.41,12.24 101.36,36.87 -46.6,33.15 -129.79,34.37 -108.29,-36.76 2.32,-0.09 4.63,-0.13 6.93,-0.11zM378.01,282.18c2.31,-0.02 4.62,0.02 6.93,0.11 21.51,71.13 -61.68,69.9 -108.29,36.76 32.95,-24.63 66.76,-36.64 101.36,-36.87zM255.16,332.14c11.77,21.73 19.19,43.45 25.37,65.18h-50.74c4.57,-21.73 13.77,-43.45 25.37,-65.18z" />
</vector>