Skip to content

Commit

Permalink
Add library status colors and apply them to LibraryNavigationActions
Browse files Browse the repository at this point in the history
  • Loading branch information
Drumber committed Jan 18, 2025
1 parent 2eca445 commit d934689
Show file tree
Hide file tree
Showing 4 changed files with 129 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -33,12 +33,13 @@ import androidx.paging.PagingData
import androidx.paging.compose.collectAsLazyPagingItems
import androidx.paging.compose.itemKey
import io.github.drumber.kitsune.R
import io.github.drumber.kitsune.data.model.library.LibraryStatus
import io.github.drumber.kitsune.data.model.library.LibraryEntryWithModification
import io.github.drumber.kitsune.data.model.library.LibraryEntryWithModificationAndNextUnit
import io.github.drumber.kitsune.data.model.library.LibraryStatus
import io.github.drumber.kitsune.ui.library_new.composables.LibraryEntryWithNextUnitItem
import io.github.drumber.kitsune.ui.library_new.composables.LibraryNavigationActions
import io.github.drumber.kitsune.ui.library_new.composables.toLibraryEntryWithNextUnitData
import io.github.drumber.kitsune.ui.theme.KitsuneTheme
import kotlinx.coroutines.flow.Flow
import kotlinx.coroutines.flow.emptyFlow

Expand Down Expand Up @@ -213,5 +214,7 @@ private fun PlannedLibraryEntriesShelf(modifier: Modifier = Modifier) {
@Preview(showBackground = true)
@Composable
private fun LibraryContentPreview() {
LibraryContent()
KitsuneTheme {
LibraryContent()
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.Card
import androidx.compose.material3.CardColors
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.ElevatedCard
import androidx.compose.material3.Icon
Expand All @@ -19,13 +20,17 @@ import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.compositeOver
import androidx.compose.ui.graphics.painter.Painter
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import io.github.drumber.kitsune.R
import io.github.drumber.kitsune.data.model.library.LibraryStatus
import io.github.drumber.kitsune.ui.theme.KitsuneTheme
import io.github.drumber.kitsune.ui.theme.LibraryStatusColors
import io.github.drumber.kitsune.ui.theme.LocalLibraryStatusColors

@Composable
fun LibraryNavigationActions(
Expand Down Expand Up @@ -104,6 +109,7 @@ fun LibraryNavigationActions(
.weight(1f)
.fillMaxHeight(),
painter = action.icon,
colors = LocalLibraryStatusColors.current.getCardColorsFor(action.status),
text = stringResource(action.labelAnime),
onClick = { onActionClick(action.status) }
)
Expand All @@ -112,6 +118,7 @@ fun LibraryNavigationActions(
.weight(1f)
.fillMaxHeight(),
painter = action.icon,
colors = LocalLibraryStatusColors.current.getCardColorsFor(action.status),
text = stringResource(action.labelManga),
onClick = { onActionClick(action.status) }
)
Expand All @@ -133,11 +140,13 @@ private fun LibraryActionCard(
modifier: Modifier = Modifier,
painter: Painter,
text: String,
colors: CardColors = CardDefaults.elevatedCardColors(),
onClick: () -> Unit
) {
ElevatedCard(
modifier = modifier,
shape = CardDefaults.elevatedShape,
colors = colors,
onClick = onClick,
) {
Row(
Expand All @@ -156,6 +165,23 @@ private fun LibraryActionCard(
}
}

@Composable
private fun LibraryStatusColors.getCardColorsFor(status: LibraryStatus): CardColors {
val (containerColor, contentColor) = when (status) {
LibraryStatus.Current -> currentContainer to onCurrentContainer
LibraryStatus.Planned -> plannedContainer to onPlannedContainer
LibraryStatus.Completed -> completedContainer to onCompletedContainer
LibraryStatus.OnHold -> onHoldContainer to onOnHoldContainer
LibraryStatus.Dropped -> droppedContainer to onDroppedContainer
}

return CardDefaults.elevatedCardColors(
containerColor = containerColor.copy(alpha = 0.7f)
.compositeOver(CardDefaults.elevatedCardColors().containerColor),
contentColor = contentColor
)
}

private data class LibraryAction(
val icon: Painter,
val status: LibraryStatus,
Expand All @@ -166,5 +192,7 @@ private data class LibraryAction(
@Preview(showBackground = true)
@Composable
private fun LibraryNavigationActionsPreview() {
LibraryNavigationActions()
KitsuneTheme(darkTheme = false) {
LibraryNavigationActions()
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
package io.github.drumber.kitsune.ui.theme

import androidx.compose.material3.ColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.Immutable
import androidx.compose.runtime.staticCompositionLocalOf
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.toArgb
import com.google.android.material.color.ColorRoles
import com.google.android.material.color.MaterialColors

private val current_seed = Color(0xFF00BCD4)
private val planned_seed = Color(0xFF2196F3)
private val completed_seed = Color(0xFF4CAF50)
private val onHold_seed = Color(0xFFFF9800)
private val dropped_seed = Color(0xFFF44336)

@Immutable
data class LibraryStatusColors(
val current: Color = Color.Unspecified,
val onCurrent: Color = Color.Unspecified,
val currentContainer: Color = Color.Unspecified,
val onCurrentContainer: Color = Color.Unspecified,
val planned: Color = Color.Unspecified,
val onPlanned: Color = Color.Unspecified,
val plannedContainer: Color = Color.Unspecified,
val onPlannedContainer: Color = Color.Unspecified,
val completed: Color = Color.Unspecified,
val onCompleted: Color = Color.Unspecified,
val completedContainer: Color = Color.Unspecified,
val onCompletedContainer: Color = Color.Unspecified,
val onHold: Color = Color.Unspecified,
val onOnHold: Color = Color.Unspecified,
val onHoldContainer: Color = Color.Unspecified,
val onOnHoldContainer: Color = Color.Unspecified,
val dropped: Color = Color.Unspecified,
val onDropped: Color = Color.Unspecified,
val droppedContainer: Color = Color.Unspecified,
val onDroppedContainer: Color = Color.Unspecified
)

val LocalLibraryStatusColors = staticCompositionLocalOf { LibraryStatusColors() }

@Composable
fun getLibraryStatusColors(isDarkTheme: Boolean, colorScheme: ColorScheme): LibraryStatusColors {
val primary = colorScheme.primary

val current = current_seed.getHarmonizedColorRoles(isDarkTheme, primary)
val planned = planned_seed.getHarmonizedColorRoles(isDarkTheme, primary)
val completed = completed_seed.getHarmonizedColorRoles(isDarkTheme, primary)
val onHold = onHold_seed.getHarmonizedColorRoles(isDarkTheme, primary)
val dropped = dropped_seed.getHarmonizedColorRoles(isDarkTheme, primary)

return LibraryStatusColors(
current = Color(current.accent),
onCurrent = Color(current.onAccent),
currentContainer = Color(current.accentContainer),
onCurrentContainer = Color(current.onAccentContainer),
planned = Color(planned.accent),
onPlanned = Color(planned.onAccent),
plannedContainer = Color(planned.accentContainer),
onPlannedContainer = Color(planned.onAccentContainer),
completed = Color(completed.accent),
onCompleted = Color(completed.onAccent),
completedContainer = Color(completed.accentContainer),
onCompletedContainer = Color(completed.onAccentContainer),
onHold = Color(onHold.accent),
onOnHold = Color(onHold.onAccent),
onHoldContainer = Color(onHold.accentContainer),
onOnHoldContainer = Color(onHold.onAccentContainer),
dropped = Color(dropped.accent),
onDropped = Color(dropped.onAccent),
droppedContainer = Color(dropped.accentContainer),
onDroppedContainer = Color(dropped.onAccentContainer)
)
}

private fun Color.getHarmonizedColorRoles(
isDarkTheme: Boolean,
colorToHarmonizeWith: Color
): ColorRoles {
val harmonizedColor = MaterialColors.harmonize(this.toArgb(), colorToHarmonizeWith.toArgb())
return MaterialColors.getColorRoles(harmonizedColor, !isDarkTheme)
}
17 changes: 11 additions & 6 deletions app/src/main/java/io/github/drumber/kitsune/ui/theme/Theme.kt
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.dynamicDarkColorScheme
import androidx.compose.material3.dynamicLightColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalLayoutDirection
import com.google.accompanist.themeadapter.material3.createMdc3Theme
Expand All @@ -31,10 +32,14 @@ fun KitsuneTheme(
else -> obtainColorScheme(context)
}

MaterialTheme(
colorScheme = colorScheme,
typography = typography!!,
shapes = shapes!!,
content = content
)
val libraryStatusColors = getLibraryStatusColors(darkTheme, colorScheme)

CompositionLocalProvider(LocalLibraryStatusColors provides libraryStatusColors) {
MaterialTheme(
colorScheme = colorScheme,
typography = typography!!,
shapes = shapes!!,
content = content
)
}
}

0 comments on commit d934689

Please sign in to comment.