Use Material3 chips

(cherry picked from commit 34f7caa0fc4a0d9b4fcc4dfd69dc9cb52f11bf38)

# Conflicts:
#	app/src/main/java/eu/kanade/presentation/manga/components/MangaInfoHeader.kt
This commit is contained in:
arkon 2023-07-16 09:11:49 -04:00 committed by Jobobby04
parent d6d5703e39
commit 9a9675c16b
6 changed files with 25 additions and 131 deletions

View File

@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.ColumnScope
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.FilterChip
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
@ -36,7 +37,6 @@ import tachiyomi.presentation.core.components.SettingsFlowRow
import tachiyomi.presentation.core.components.SliderItem
import tachiyomi.presentation.core.components.SortItem
import tachiyomi.presentation.core.components.TriStateItem
import tachiyomi.presentation.core.components.material.ChoiceChip
@Composable
fun LibrarySettingsDialog(
@ -229,10 +229,10 @@ private fun ColumnScope.DisplayPage(
val displayMode by screenModel.libraryPreferences.libraryDisplayMode().collectAsState()
SettingsFlowRow(R.string.action_display_mode) {
displayModes.map { (titleRes, mode) ->
ChoiceChip(
isSelected = displayMode == mode,
FilterChip(
selected = displayMode == mode,
onClick = { screenModel.setDisplayMode(mode) },
content = { Text(stringResource(titleRes)) },
label = { Text(stringResource(titleRes)) },
)
}
}

View File

@ -20,9 +20,7 @@ import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import eu.kanade.presentation.components.ChipBorder
import eu.kanade.presentation.components.SuggestionChip
import eu.kanade.presentation.components.SuggestionChipDefaults
import eu.kanade.presentation.theme.TachiyomiTheme
import eu.kanade.tachiyomi.source.Source
import eu.kanade.tachiyomi.source.online.all.EHentai
@ -32,8 +30,6 @@ import exh.metadata.metadata.base.RaisedTag
import exh.source.EH_SOURCE_ID
import exh.source.EXH_SOURCE_ID
import exh.util.SourceTagsUtil
import androidx.compose.material3.ChipBorder as ChipBorderM3
import androidx.compose.material3.SuggestionChipDefaults as SuggestionChipDefaultsM3
@Immutable
data class DisplayTag(
@ -107,7 +103,6 @@ fun NamespaceTags(
modifier = Modifier.padding(top = 4.dp),
text = namespace,
onClick = null,
onLongClick = null,
)
}
FlowRow(
@ -115,17 +110,10 @@ fun NamespaceTags(
horizontalArrangement = Arrangement.spacedBy(4.dp),
) {
tags.forEach { (_, text, search, border) ->
val borderDp = border?.dp
TagsChip(
modifier = Modifier.padding(vertical = 4.dp),
text = text,
onClick = { onClick(search) },
border = borderDp?.let {
SuggestionChipDefaults.suggestionChipBorder(borderWidth = it)
},
borderM3 = borderDp?.let {
SuggestionChipDefaultsM3.suggestionChipBorder(borderWidth = it)
},
)
}
}
@ -139,50 +127,21 @@ fun TagsChip(
modifier: Modifier = Modifier,
text: String,
onClick: (() -> Unit)?,
onLongClick: (() -> Unit)? = null,
border: ChipBorder? = null,
borderM3: ChipBorderM3? = null,
) {
CompositionLocalProvider(LocalMinimumInteractiveComponentEnforcement provides false) {
if (onClick != null) {
if (onLongClick != null) {
SuggestionChip(
modifier = modifier,
onClick = onClick,
onLongClick = onLongClick,
label = {
Text(
text = text,
style = MaterialTheme.typography.bodySmall,
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)
},
border = border,
colors = SuggestionChipDefaults.suggestionChipColors(
containerColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.12f),
labelColor = MaterialTheme.colorScheme.onSurface,
),
)
} else {
SuggestionChip(
modifier = modifier,
onClick = onClick,
label = {
Text(
text = text,
style = MaterialTheme.typography.bodySmall,
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)
},
border = borderM3,
colors = SuggestionChipDefaultsM3.suggestionChipColors(
containerColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.12f),
labelColor = MaterialTheme.colorScheme.onSurface,
),
)
}
SuggestionChip(
modifier = modifier,
onClick = onClick,
label = {
Text(
text = text,
style = MaterialTheme.typography.bodySmall,
maxLines = 1,
overflow = TextOverflow.Ellipsis,
)
},
)
} else {
SuggestionChip(
modifier = modifier,
@ -194,11 +153,6 @@ fun TagsChip(
overflow = TextOverflow.Ellipsis,
)
},
border = border,
colors = SuggestionChipDefaults.suggestionChipColors(
containerColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.12f),
labelColor = MaterialTheme.colorScheme.onSurface,
),
)
}
}

View File

@ -2,6 +2,7 @@ package eu.kanade.presentation.reader.settings
import android.os.Build
import androidx.compose.foundation.layout.ColumnScope
import androidx.compose.material3.FilterChip
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
@ -18,7 +19,6 @@ import tachiyomi.core.preference.getAndSet
import tachiyomi.presentation.core.components.CheckboxItem
import tachiyomi.presentation.core.components.SettingsFlowRow
import tachiyomi.presentation.core.components.SliderItem
import tachiyomi.presentation.core.components.material.ChoiceChip
@Composable
internal fun ColumnScope.ColorFilterPage(screenModel: ReaderSettingsScreenModel) {
@ -126,10 +126,10 @@ internal fun ColumnScope.ColorFilterPage(screenModel: ReaderSettingsScreenModel)
val colorFilterMode by screenModel.preferences.colorFilterMode().collectAsState()
SettingsFlowRow(R.string.pref_color_filter_mode) {
colorFilterModes.mapIndexed { index, it ->
ChoiceChip(
isSelected = colorFilterMode == index,
FilterChip(
selected = colorFilterMode == index,
onClick = { screenModel.preferences.colorFilterMode().set(index) },
content = { Text(it) },
label = { Text(it) },
)
}
}

View File

@ -1,6 +1,7 @@
package eu.kanade.presentation.reader.settings
import androidx.compose.foundation.layout.ColumnScope
import androidx.compose.material3.FilterChip
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
@ -11,7 +12,6 @@ import eu.kanade.tachiyomi.ui.reader.setting.ReaderPreferences
import eu.kanade.tachiyomi.ui.reader.setting.ReaderSettingsScreenModel
import tachiyomi.presentation.core.components.CheckboxItem
import tachiyomi.presentation.core.components.SettingsFlowRow
import tachiyomi.presentation.core.components.material.ChoiceChip
private val themes = listOf(
R.string.black_background to 1,
@ -25,10 +25,10 @@ internal fun ColumnScope.GeneralPage(screenModel: ReaderSettingsScreenModel) {
val readerTheme by screenModel.preferences.readerTheme().collectAsState()
SettingsFlowRow(R.string.pref_reader_theme) {
themes.map { (labelRes, value) ->
ChoiceChip(
isSelected = readerTheme == value,
FilterChip(
selected = readerTheme == value,
onClick = { screenModel.preferences.readerTheme().set(value) },
content = { Text(stringResource(labelRes)) },
label = { Text(stringResource(labelRes)) },
)
}
}

View File

@ -358,7 +358,7 @@ fun SettingsFlowRow(
end = SettingsItemsPaddings.Horizontal,
bottom = SettingsItemsPaddings.Vertical,
),
horizontalArrangement = Arrangement.spacedBy(4.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp),
content = content,
)
}

View File

@ -1,60 +0,0 @@
package tachiyomi.presentation.core.components.material
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.requiredHeight
import androidx.compose.foundation.layout.widthIn
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.ProvideTextStyle
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
@Composable
fun Chip(
modifier: Modifier = Modifier,
backgroundColor: Color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.15f),
contentColor: Color = MaterialTheme.colorScheme.onSurface,
onClick: () -> Unit = {},
content: @Composable () -> Unit,
) {
Surface(
modifier = Modifier,
shape = CircleShape,
color = backgroundColor,
contentColor = contentColor,
onClick = {},
) {
Row(
modifier = modifier.clickable(onClick = onClick)
.widthIn(min = 56.dp)
.requiredHeight(32.dp)
.padding(horizontal = 12.dp),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.Center,
) {
ProvideTextStyle(MaterialTheme.typography.bodySmall, content)
}
}
}
@Composable
fun ChoiceChip(
modifier: Modifier = Modifier,
isSelected: Boolean,
onClick: () -> Unit = {},
selectedBackgroundColor: Color = MaterialTheme.colorScheme.primary,
selectedContentColor: Color = MaterialTheme.colorScheme.onPrimary,
content: @Composable () -> Unit,
) {
if (isSelected) {
Chip(modifier, selectedBackgroundColor, selectedContentColor, onClick, content)
} else {
Chip(modifier, onClick = onClick, content = content)
}
}