pref: 优化动态取色顶栏颜色
This commit is contained in:
parent
27486515bd
commit
0154bcbfdd
|
|
@ -21,6 +21,7 @@ import com.huanchengfly.tieba.post.App
|
|||
import com.huanchengfly.tieba.post.R
|
||||
import com.huanchengfly.tieba.post.rememberPreferenceAsState
|
||||
import com.huanchengfly.tieba.post.utils.ThemeUtil
|
||||
import com.huanchengfly.tieba.post.utils.appPreferences
|
||||
import com.huanchengfly.tieba.post.utils.compose.darken
|
||||
|
||||
@Stable
|
||||
|
|
@ -108,21 +109,165 @@ private fun getDynamicColor(
|
|||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun getDynamicTopBarColor(
|
||||
tonalPalette: TonalPalette,
|
||||
isNightMode: Boolean,
|
||||
): Color {
|
||||
val topBarUsePrimaryColor =
|
||||
LocalContext.current.appPreferences.toolbarPrimaryColor && !isNightMode
|
||||
val primaryColor = if (isNightMode) {
|
||||
tonalPalette.primary80
|
||||
} else {
|
||||
tonalPalette.primary40
|
||||
}
|
||||
val backgroundColor = if (isNightMode) {
|
||||
tonalPalette.neutralVariant10
|
||||
} else {
|
||||
tonalPalette.neutralVariant99
|
||||
}
|
||||
return if (topBarUsePrimaryColor) {
|
||||
primaryColor
|
||||
} else {
|
||||
backgroundColor
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun getDynamicOnTopBarColor(
|
||||
tonalPalette: TonalPalette,
|
||||
isNightMode: Boolean,
|
||||
): Color {
|
||||
val topBarUsePrimaryColor =
|
||||
LocalContext.current.appPreferences.toolbarPrimaryColor && !isNightMode
|
||||
val onPrimaryColor = if (isNightMode) {
|
||||
tonalPalette.primary20
|
||||
} else {
|
||||
tonalPalette.primary100
|
||||
}
|
||||
val onBackgroundColor = if (isNightMode) {
|
||||
tonalPalette.neutralVariant90
|
||||
} else {
|
||||
tonalPalette.neutralVariant10
|
||||
}
|
||||
return if (topBarUsePrimaryColor) {
|
||||
onPrimaryColor
|
||||
} else {
|
||||
onBackgroundColor
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun getDynamicOnTopBarSecondaryColor(
|
||||
tonalPalette: TonalPalette,
|
||||
isNightMode: Boolean,
|
||||
): Color {
|
||||
val topBarUsePrimaryColor =
|
||||
LocalContext.current.appPreferences.toolbarPrimaryColor && !isNightMode
|
||||
val primaryColor = if (isNightMode) {
|
||||
tonalPalette.primary20
|
||||
} else {
|
||||
tonalPalette.primary80
|
||||
}
|
||||
val backgroundColor = if (isNightMode) {
|
||||
tonalPalette.neutralVariant70
|
||||
} else {
|
||||
tonalPalette.neutralVariant40
|
||||
}
|
||||
return if (topBarUsePrimaryColor) {
|
||||
primaryColor
|
||||
} else {
|
||||
backgroundColor
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun getDynamicOnTopBarActiveColor(
|
||||
tonalPalette: TonalPalette,
|
||||
isNightMode: Boolean,
|
||||
): Color {
|
||||
val topBarUsePrimaryColor =
|
||||
LocalContext.current.appPreferences.toolbarPrimaryColor && !isNightMode
|
||||
val primaryColor = if (isNightMode) {
|
||||
tonalPalette.primary0
|
||||
} else {
|
||||
tonalPalette.primary100
|
||||
}
|
||||
val backgroundColor = if (isNightMode) {
|
||||
tonalPalette.neutralVariant100
|
||||
} else {
|
||||
tonalPalette.neutralVariant0
|
||||
}
|
||||
return if (topBarUsePrimaryColor) {
|
||||
primaryColor
|
||||
} else {
|
||||
backgroundColor
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun getDynamicTopBarSurfaceColor(
|
||||
tonalPalette: TonalPalette,
|
||||
isNightMode: Boolean,
|
||||
): Color {
|
||||
val topBarUsePrimaryColor =
|
||||
LocalContext.current.appPreferences.toolbarPrimaryColor && !isNightMode
|
||||
val primaryColor = if (isNightMode) {
|
||||
tonalPalette.primary30
|
||||
} else {
|
||||
tonalPalette.primary90
|
||||
}
|
||||
val backgroundColor = if (isNightMode) {
|
||||
tonalPalette.neutralVariant20
|
||||
} else {
|
||||
tonalPalette.neutralVariant95
|
||||
}
|
||||
return if (topBarUsePrimaryColor) {
|
||||
primaryColor
|
||||
} else {
|
||||
backgroundColor
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun getDynamicOnTopBarSurfaceColor(
|
||||
tonalPalette: TonalPalette,
|
||||
isNightMode: Boolean,
|
||||
): Color {
|
||||
val topBarUsePrimaryColor =
|
||||
LocalContext.current.appPreferences.toolbarPrimaryColor && !isNightMode
|
||||
val primaryColor = if (isNightMode) {
|
||||
tonalPalette.primary90
|
||||
} else {
|
||||
tonalPalette.primary10
|
||||
}
|
||||
val backgroundColor = if (isNightMode) {
|
||||
tonalPalette.neutralVariant70
|
||||
} else {
|
||||
tonalPalette.neutralVariant30
|
||||
}
|
||||
return if (topBarUsePrimaryColor) {
|
||||
primaryColor
|
||||
} else {
|
||||
backgroundColor
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun getLightDynamicColor(tonalPalette: TonalPalette): ExtendedColors {
|
||||
return ExtendedColors(
|
||||
theme = "dynamic",
|
||||
isNightMode = false,
|
||||
primary = tonalPalette.primary40,
|
||||
textOnPrimary = tonalPalette.primary100,
|
||||
textOnPrimary = tonalPalette.primary90,
|
||||
accent = tonalPalette.secondary40,
|
||||
onAccent = tonalPalette.secondary100,
|
||||
topBar = tonalPalette.neutralVariant99,
|
||||
onTopBar = tonalPalette.neutralVariant10,
|
||||
onTopBarSecondary = tonalPalette.neutralVariant40,
|
||||
onTopBarActive = tonalPalette.neutralVariant0,
|
||||
topBarSurface = tonalPalette.neutralVariant95,
|
||||
onTopBarSurface = tonalPalette.neutralVariant30,
|
||||
topBar = getDynamicTopBarColor(tonalPalette, false),
|
||||
onTopBar = getDynamicOnTopBarColor(tonalPalette, false),
|
||||
onTopBarSecondary = getDynamicOnTopBarSecondaryColor(tonalPalette, false),
|
||||
onTopBarActive = getDynamicOnTopBarActiveColor(tonalPalette, false),
|
||||
topBarSurface = getDynamicTopBarSurfaceColor(tonalPalette, false),
|
||||
onTopBarSurface = getDynamicOnTopBarSurfaceColor(tonalPalette, false),
|
||||
bottomBar = tonalPalette.neutralVariant99,
|
||||
bottomBarSurface = tonalPalette.neutralVariant95,
|
||||
onBottomBarSurface = tonalPalette.neutralVariant30,
|
||||
|
|
@ -149,16 +294,15 @@ private fun getDarkDynamicColor(tonalPalette: TonalPalette): ExtendedColors {
|
|||
theme = "dynamic",
|
||||
isNightMode = true,
|
||||
primary = tonalPalette.primary80,
|
||||
textOnPrimary = tonalPalette.primary20,
|
||||
textOnPrimary = tonalPalette.primary10,
|
||||
accent = tonalPalette.secondary80,
|
||||
onAccent = tonalPalette.secondary20,
|
||||
topBar = tonalPalette.neutralVariant10,
|
||||
onTopBar = tonalPalette.neutralVariant90,
|
||||
onTopBarSecondary = tonalPalette.neutralVariant70,
|
||||
onTopBarActive = tonalPalette.neutralVariant100,
|
||||
topBarSurface = tonalPalette.neutralVariant20,
|
||||
onTopBarSurface = tonalPalette.neutralVariant70,
|
||||
bottomBar = tonalPalette.neutralVariant10,
|
||||
topBar = getDynamicTopBarColor(tonalPalette, true),
|
||||
onTopBar = getDynamicOnTopBarColor(tonalPalette, true),
|
||||
onTopBarSecondary = getDynamicOnTopBarSecondaryColor(tonalPalette, true),
|
||||
onTopBarActive = getDynamicOnTopBarActiveColor(tonalPalette, true),
|
||||
topBarSurface = getDynamicTopBarSurfaceColor(tonalPalette, true),
|
||||
onTopBarSurface = getDynamicOnTopBarSurfaceColor(tonalPalette, true),
|
||||
bottomBarSurface = tonalPalette.neutralVariant20,
|
||||
onBottomBarSurface = tonalPalette.neutralVariant70,
|
||||
text = tonalPalette.neutralVariant90,
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ import androidx.compose.material.rememberScaffoldState
|
|||
import androidx.compose.runtime.Composable
|
||||
import androidx.compose.runtime.LaunchedEffect
|
||||
import androidx.compose.runtime.getValue
|
||||
import androidx.compose.runtime.mutableStateOf
|
||||
import androidx.compose.runtime.mutableIntStateOf
|
||||
import androidx.compose.runtime.remember
|
||||
import androidx.compose.runtime.rememberCoroutineScope
|
||||
import androidx.compose.runtime.setValue
|
||||
|
|
@ -676,7 +676,7 @@ fun ForumPage(
|
|||
},
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(horizontal = 16.dp)
|
||||
.padding(16.dp)
|
||||
// enable event when scroll image.
|
||||
.scrollable(
|
||||
orientation = Orientation.Vertical,
|
||||
|
|
@ -719,7 +719,7 @@ fun ForumPage(
|
|||
val menuState = rememberMenuState()
|
||||
val interactionSource = remember { MutableInteractionSource() }
|
||||
var currentSortType by remember {
|
||||
mutableStateOf(
|
||||
mutableIntStateOf(
|
||||
getSortType(
|
||||
context,
|
||||
forumName
|
||||
|
|
@ -780,7 +780,7 @@ fun ForumPage(
|
|||
}
|
||||
},
|
||||
selectedContentColor = ExtendedTheme.colors.primary,
|
||||
unselectedContentColor = ExtendedTheme.colors.onTopBarSecondary,
|
||||
unselectedContentColor = ExtendedTheme.colors.textSecondary,
|
||||
interactionSource = interactionSource,
|
||||
) {
|
||||
Row(
|
||||
|
|
@ -812,7 +812,7 @@ fun ForumPage(
|
|||
}
|
||||
},
|
||||
selectedContentColor = ExtendedTheme.colors.primary,
|
||||
unselectedContentColor = ExtendedTheme.colors.onTopBarSecondary
|
||||
unselectedContentColor = ExtendedTheme.colors.textSecondary
|
||||
) {
|
||||
Row(
|
||||
verticalAlignment = Alignment.CenterVertically,
|
||||
|
|
@ -881,7 +881,7 @@ fun LoadingPlaceholder(
|
|||
forumName = forumName,
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.padding(horizontal = 16.dp)
|
||||
.padding(16.dp)
|
||||
)
|
||||
Row(modifier = Modifier.height(48.dp)) {
|
||||
repeat(2) {
|
||||
|
|
|
|||
|
|
@ -120,7 +120,7 @@ fun HistoryPage(
|
|||
pagerState.animateScrollToPage(0)
|
||||
}
|
||||
},
|
||||
selectedContentColor = ExtendedTheme.colors.primary,
|
||||
selectedContentColor = ExtendedTheme.colors.onTopBar,
|
||||
unselectedContentColor = ExtendedTheme.colors.onTopBarSecondary
|
||||
)
|
||||
Tab(
|
||||
|
|
@ -136,7 +136,7 @@ fun HistoryPage(
|
|||
pagerState.animateScrollToPage(1)
|
||||
}
|
||||
},
|
||||
selectedContentColor = ExtendedTheme.colors.primary,
|
||||
selectedContentColor = ExtendedTheme.colors.onTopBar,
|
||||
unselectedContentColor = ExtendedTheme.colors.onTopBarSecondary
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -122,12 +122,16 @@ fun SearchBox(
|
|||
contentColor: Color = ExtendedTheme.colors.onTopBarSurface,
|
||||
onClick: () -> Unit,
|
||||
) {
|
||||
Box(modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp)) {
|
||||
Box(
|
||||
modifier = modifier
|
||||
.background(ExtendedTheme.colors.topBar)
|
||||
.padding(horizontal = 16.dp, vertical = 8.dp)
|
||||
) {
|
||||
Surface(
|
||||
color = backgroundColor,
|
||||
contentColor = contentColor,
|
||||
shape = RoundedCornerShape(6.dp),
|
||||
modifier = modifier
|
||||
modifier = Modifier
|
||||
.fillMaxWidth()
|
||||
.clickable(onClick = onClick)
|
||||
) {
|
||||
|
|
|
|||
|
|
@ -29,6 +29,7 @@ import androidx.compose.foundation.shape.RoundedCornerShape
|
|||
import androidx.compose.foundation.text.KeyboardActions
|
||||
import androidx.compose.foundation.text.KeyboardOptions
|
||||
import androidx.compose.material.ButtonDefaults
|
||||
import androidx.compose.material.ContentAlpha
|
||||
import androidx.compose.material.Icon
|
||||
import androidx.compose.material.MaterialTheme
|
||||
import androidx.compose.material.ProvideTextStyle
|
||||
|
|
@ -224,6 +225,7 @@ fun SearchPage(
|
|||
Box(
|
||||
modifier = Modifier
|
||||
.height(64.dp)
|
||||
.background(ExtendedTheme.colors.topBar)
|
||||
.padding(horizontal = 16.dp, vertical = 8.dp)
|
||||
) {
|
||||
SearchTopBar(
|
||||
|
|
@ -553,7 +555,7 @@ private fun SearchTopBar(
|
|||
placeholder = {
|
||||
Text(
|
||||
text = stringResource(id = R.string.hint_search),
|
||||
color = ExtendedTheme.colors.textDisabled
|
||||
color = ExtendedTheme.colors.onTopBarSurface.copy(alpha = ContentAlpha.disabled)
|
||||
)
|
||||
},
|
||||
modifier = Modifier
|
||||
|
|
|
|||
|
|
@ -21,7 +21,6 @@ import androidx.compose.foundation.layout.height
|
|||
import androidx.compose.foundation.layout.navigationBarsPadding
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.statusBarsPadding
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.foundation.lazy.LazyListScope
|
||||
import androidx.compose.foundation.lazy.items
|
||||
|
|
@ -1108,8 +1107,7 @@ fun ThreadPage(
|
|||
forumName
|
||||
)
|
||||
)
|
||||
},
|
||||
modifier = Modifier.statusBarsPadding()
|
||||
}
|
||||
)
|
||||
},
|
||||
) {
|
||||
|
|
|
|||
|
|
@ -63,6 +63,7 @@ object ThemeUtil {
|
|||
const val KEY_CUSTOM_STATUS_BAR_FONT_DARK = "custom_status_bar_font_dark"
|
||||
const val KEY_CUSTOM_TOOLBAR_PRIMARY_COLOR = "custom_toolbar_primary_color"
|
||||
const val KEY_TRANSLUCENT_THEME_BACKGROUND_PATH = "translucent_theme_background_path"
|
||||
const val KEY_USE_DYNAMIC_COLOR_THEME = "useDynamicColorTheme"
|
||||
|
||||
const val THEME_TRANSLUCENT = "translucent"
|
||||
const val THEME_TRANSLUCENT_LIGHT = "translucent_light"
|
||||
|
|
|
|||
|
|
@ -3,10 +3,9 @@ package com.huanchengfly.tieba.post.utils.compose
|
|||
import androidx.compose.ui.graphics.Color
|
||||
import androidx.compose.ui.graphics.toArgb
|
||||
import com.huanchengfly.tieba.post.App
|
||||
import com.huanchengfly.tieba.post.dataStore
|
||||
import com.huanchengfly.tieba.post.getBoolean
|
||||
import com.huanchengfly.tieba.post.utils.ColorUtils
|
||||
import com.huanchengfly.tieba.post.utils.ThemeUtil
|
||||
import com.huanchengfly.tieba.post.utils.appPreferences
|
||||
|
||||
fun Color.darken(i: Float = 0.1F): Color {
|
||||
return Color(ColorUtils.getDarkerColor(toArgb(), i))
|
||||
|
|
@ -16,10 +15,11 @@ fun Color.calcStatusBarColor(): Color {
|
|||
val context = App.INSTANCE
|
||||
var darkerStatusBar = true
|
||||
val isToolbarPrimaryColor =
|
||||
context.dataStore.getBoolean(ThemeUtil.KEY_CUSTOM_TOOLBAR_PRIMARY_COLOR, false)
|
||||
if (ThemeUtil.isTranslucentTheme() || !isToolbarPrimaryColor) {
|
||||
context.appPreferences.toolbarPrimaryColor
|
||||
val isDynamicColor = context.appPreferences.useDynamicColorTheme
|
||||
if (ThemeUtil.isTranslucentTheme() || !isToolbarPrimaryColor || isDynamicColor) {
|
||||
darkerStatusBar = false
|
||||
} else if (!context.dataStore.getBoolean("status_bar_darker", true)) {
|
||||
} else if (!context.appPreferences.statusBarDarker) {
|
||||
darkerStatusBar = false
|
||||
}
|
||||
return if (darkerStatusBar) darken() else this
|
||||
|
|
|
|||
Loading…
Reference in New Issue