Align design of details screen
This commit is contained in:
parent
fb0ae34b4a
commit
a74b32d6e3
7 changed files with 30 additions and 13 deletions
|
|
@ -7,7 +7,6 @@ import androidx.compose.runtime.Stable
|
||||||
data class Quest(
|
data class Quest(
|
||||||
val id: Int,
|
val id: Int,
|
||||||
val title: String,
|
val title: String,
|
||||||
val background: Uri?,
|
|
||||||
val entries: List<QuestEntry>,
|
val entries: List<QuestEntry>,
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -83,7 +83,6 @@ class QuestRepository @Inject constructor(
|
||||||
Quest(
|
Quest(
|
||||||
id = index,
|
id = index,
|
||||||
title = item,
|
title = item,
|
||||||
background = questMap[item]?.mapNotNull { it.background }?.randomOrNull(),
|
|
||||||
entries = questMap[item] ?: emptyList(),
|
entries = questMap[item] ?: emptyList(),
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -62,6 +62,7 @@ import com.pixelized.rplexicon.utilitary.composable.stringResource
|
||||||
import com.pixelized.rplexicon.utilitary.extentions.annotatedSpan
|
import com.pixelized.rplexicon.utilitary.extentions.annotatedSpan
|
||||||
import com.pixelized.rplexicon.utilitary.extentions.annotatedString
|
import com.pixelized.rplexicon.utilitary.extentions.annotatedString
|
||||||
import com.pixelized.rplexicon.utilitary.extentions.highlightRegex
|
import com.pixelized.rplexicon.utilitary.extentions.highlightRegex
|
||||||
|
import com.pixelized.rplexicon.utilitary.extentions.lexicon
|
||||||
import com.pixelized.rplexicon.utilitary.extentions.scrollOffset
|
import com.pixelized.rplexicon.utilitary.extentions.scrollOffset
|
||||||
import com.skydoves.landscapist.ImageOptions
|
import com.skydoves.landscapist.ImageOptions
|
||||||
|
|
||||||
|
|
@ -205,7 +206,10 @@ private fun LexiconDetailContent(
|
||||||
Column(
|
Column(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.verticalScroll(state)
|
.verticalScroll(state)
|
||||||
.padding(top = 64.dp, bottom = 16.dp),
|
.padding(
|
||||||
|
top = MaterialTheme.lexicon.dimens.detailPadding,
|
||||||
|
bottom = 16.dp,
|
||||||
|
),
|
||||||
verticalArrangement = Arrangement.spacedBy(space = 4.dp),
|
verticalArrangement = Arrangement.spacedBy(space = 4.dp),
|
||||||
) {
|
) {
|
||||||
FlowRow(
|
FlowRow(
|
||||||
|
|
|
||||||
|
|
@ -193,7 +193,12 @@ private fun QuestDetailContent(
|
||||||
Column(
|
Column(
|
||||||
modifier = Modifier
|
modifier = Modifier
|
||||||
.verticalScroll(state)
|
.verticalScroll(state)
|
||||||
.padding(top = 248.dp, bottom = 16.dp, start = 16.dp, end = 16.dp),
|
.padding(
|
||||||
|
top = MaterialTheme.lexicon.dimens.detailPadding,
|
||||||
|
end = 16.dp,
|
||||||
|
bottom = 16.dp,
|
||||||
|
start = 16.dp,
|
||||||
|
),
|
||||||
) {
|
) {
|
||||||
Column {
|
Column {
|
||||||
Text(
|
Text(
|
||||||
|
|
@ -268,7 +273,10 @@ private fun QuestDetailContent(
|
||||||
)
|
)
|
||||||
Text(
|
Text(
|
||||||
style = MaterialTheme.typography.bodyMedium,
|
style = MaterialTheme.typography.bodyMedium,
|
||||||
text = it,
|
text = when (quest.giverId) {
|
||||||
|
null -> "◊ $it"
|
||||||
|
else -> "⧫ $it"
|
||||||
|
},
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -25,7 +25,7 @@ class QuestDetailViewModel @Inject constructor(
|
||||||
quest = mutableStateOf(
|
quest = mutableStateOf(
|
||||||
QuestDetailUio(
|
QuestDetailUio(
|
||||||
id = source.id,
|
id = source.id,
|
||||||
background = source.background,
|
background = source.entries.mapNotNull { it.background }.randomOrNull(),
|
||||||
title = source.title,
|
title = source.title,
|
||||||
steps = source.entries.map { entry ->
|
steps = source.entries.map { entry ->
|
||||||
QuestDetailUio.QuestStep(
|
QuestDetailUio.QuestStep(
|
||||||
|
|
|
||||||
|
|
@ -5,8 +5,8 @@ import androidx.compose.animation.ContentTransform
|
||||||
import androidx.compose.animation.ExperimentalAnimationApi
|
import androidx.compose.animation.ExperimentalAnimationApi
|
||||||
import androidx.compose.animation.fadeIn
|
import androidx.compose.animation.fadeIn
|
||||||
import androidx.compose.animation.fadeOut
|
import androidx.compose.animation.fadeOut
|
||||||
import androidx.compose.animation.slideInVertically
|
import androidx.compose.animation.slideInHorizontally
|
||||||
import androidx.compose.animation.slideOutVertically
|
import androidx.compose.animation.slideOutHorizontally
|
||||||
import androidx.compose.animation.with
|
import androidx.compose.animation.with
|
||||||
import androidx.compose.runtime.Stable
|
import androidx.compose.runtime.Stable
|
||||||
import androidx.compose.ui.unit.Density
|
import androidx.compose.ui.unit.Density
|
||||||
|
|
@ -23,6 +23,10 @@ fun lexiconAnimation(
|
||||||
density: Density,
|
density: Density,
|
||||||
): LexiconAnimation = LexiconAnimation(
|
): LexiconAnimation = LexiconAnimation(
|
||||||
itemList = with(density) {
|
itemList = with(density) {
|
||||||
{ fadeIn() + slideInVertically { 8.dp.roundToPx() } with fadeOut() + slideOutVertically { 8.dp.roundToPx() } }
|
{
|
||||||
|
val enter = fadeIn() + slideInHorizontally { 8.dp.roundToPx() }
|
||||||
|
val exit = fadeOut() + slideOutHorizontally { 8.dp.roundToPx() }
|
||||||
|
enter with exit
|
||||||
|
}
|
||||||
},
|
},
|
||||||
)
|
)
|
||||||
|
|
@ -10,16 +10,19 @@ import androidx.compose.ui.unit.dp
|
||||||
@Immutable
|
@Immutable
|
||||||
data class LexiconDimens(
|
data class LexiconDimens(
|
||||||
val item: Dp,
|
val item: Dp,
|
||||||
|
val detailPadding: Dp,
|
||||||
val itemListPadding: PaddingValues,
|
val itemListPadding: PaddingValues,
|
||||||
)
|
)
|
||||||
|
|
||||||
fun lexiconDimen(
|
fun lexiconDimen(
|
||||||
item: Dp = 52.dp,
|
itemHeight: Dp = 52.dp,
|
||||||
|
detailPadding: Dp = 248.dp,
|
||||||
itemListPadding: PaddingValues = PaddingValues(
|
itemListPadding: PaddingValues = PaddingValues(
|
||||||
top = 8.dp,
|
top = 8.dp,
|
||||||
bottom = 8.dp + 16.dp + 56.dp + 16.dp,
|
bottom = 8.dp + 16.dp + 56.dp + 16.dp,
|
||||||
)
|
),
|
||||||
) = LexiconDimens(
|
) = LexiconDimens(
|
||||||
item = item,
|
item = itemHeight,
|
||||||
itemListPadding,
|
detailPadding = detailPadding,
|
||||||
|
itemListPadding = itemListPadding
|
||||||
)
|
)
|
||||||
Loading…
Add table
Add a link
Reference in a new issue