Skip to content

Commit 8ec1fd0

Browse files
Add ButtonColors and colorScheme
1 parent 719de0f commit 8ec1fd0

File tree

8 files changed

+129
-16
lines changed

8 files changed

+129
-16
lines changed

app/src/main/java/org/jellyfin/androidtv/ui/base/JellyfinTheme.kt

+20
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,29 @@
11
package org.jellyfin.androidtv.ui.base
22

33
import androidx.compose.runtime.Composable
4+
import androidx.compose.runtime.CompositionLocalProvider
45
import androidx.compose.runtime.ReadOnlyComposable
56

7+
@Composable
8+
fun JellyfinTheme(
9+
colorScheme: ColorScheme = JellyfinTheme.colorScheme,
10+
shapes: Shapes = JellyfinTheme.shapes,
11+
typography: Typography = JellyfinTheme.typography,
12+
content: @Composable () -> Unit
13+
) {
14+
CompositionLocalProvider(
15+
LocalColorScheme provides colorScheme,
16+
LocalShapes provides shapes,
17+
LocalTypography provides typography
18+
) {
19+
ProvideTextStyle(value = typography.default, content = content)
20+
}
21+
}
22+
623
object JellyfinTheme {
24+
val colorScheme: ColorScheme
25+
@Composable @ReadOnlyComposable get() = LocalColorScheme.current
26+
727
val typography: Typography
828
@Composable @ReadOnlyComposable get() = LocalTypography.current
929

app/src/main/java/org/jellyfin/androidtv/ui/base/button/Button.kt

+25
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,35 @@ import androidx.compose.foundation.layout.defaultMinSize
99
import androidx.compose.foundation.layout.padding
1010
import androidx.compose.foundation.shape.CircleShape
1111
import androidx.compose.runtime.Composable
12+
import androidx.compose.runtime.ReadOnlyComposable
1213
import androidx.compose.ui.Alignment
1314
import androidx.compose.ui.Modifier
15+
import androidx.compose.ui.graphics.Color
1416
import androidx.compose.ui.graphics.Shape
1517
import androidx.compose.ui.unit.dp
18+
import org.jellyfin.androidtv.ui.base.JellyfinTheme
1619

1720
object ButtonDefaults {
1821
val Shape: Shape = CircleShape
1922
val ContentPadding: PaddingValues = PaddingValues(horizontal = 16.dp, vertical = 10.dp)
23+
24+
@ReadOnlyComposable
25+
@Composable
26+
fun colors(
27+
containerColor: Color = JellyfinTheme.colorScheme.button,
28+
contentColor: Color = JellyfinTheme.colorScheme.onButton,
29+
focusedContainerColor: Color = JellyfinTheme.colorScheme.buttonFocused,
30+
focusedContentColor: Color = JellyfinTheme.colorScheme.onButtonFocused,
31+
disabledContainerColor: Color = JellyfinTheme.colorScheme.buttonDisabled,
32+
disabledContentColor: Color = JellyfinTheme.colorScheme.onButtonDisabled,
33+
) = ButtonColors(
34+
containerColor = containerColor,
35+
contentColor = contentColor,
36+
focusedContainerColor = focusedContainerColor,
37+
focusedContentColor = focusedContentColor,
38+
disabledContainerColor = disabledContainerColor,
39+
disabledContentColor = disabledContentColor,
40+
)
2041
}
2142

2243
@Composable
@@ -26,6 +47,7 @@ fun Button(
2647
onLongClick: (() -> Unit)? = null,
2748
enabled: Boolean = true,
2849
shape: Shape = ButtonDefaults.Shape,
50+
colors: ButtonColors = ButtonDefaults.colors(),
2951
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
3052
interactionSource: MutableInteractionSource? = null,
3153
content: @Composable RowScope.() -> Unit
@@ -36,6 +58,7 @@ fun Button(
3658
onLongClick = onLongClick,
3759
enabled = enabled,
3860
shape = shape,
61+
colors = colors,
3962
interactionSource = interactionSource,
4063
) {
4164
ButtonRow(
@@ -53,6 +76,7 @@ fun ProgressButton(
5376
onLongClick: (() -> Unit)? = null,
5477
enabled: Boolean = true,
5578
shape: Shape = ButtonDefaults.Shape,
79+
colors: ButtonColors = ButtonDefaults.colors(),
5680
contentPadding: PaddingValues = ButtonDefaults.ContentPadding,
5781
interactionSource: MutableInteractionSource? = null,
5882
content: @Composable RowScope.() -> Unit
@@ -64,6 +88,7 @@ fun ProgressButton(
6488
onLongClick = onLongClick,
6589
enabled = enabled,
6690
shape = shape,
91+
colors = colors,
6792
interactionSource = interactionSource,
6893
) {
6994
ButtonRow(

app/src/main/java/org/jellyfin/androidtv/ui/base/button/ButtonBase.kt

+5-13
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,8 @@ import androidx.compose.runtime.remember
1414
import androidx.compose.ui.Modifier
1515
import androidx.compose.ui.draw.clip
1616
import androidx.compose.ui.graphics.Shape
17-
import androidx.compose.ui.res.colorResource
1817
import androidx.compose.ui.semantics.Role
1918
import androidx.compose.ui.unit.sp
20-
import org.jellyfin.androidtv.R
2119
import org.jellyfin.androidtv.ui.base.JellyfinTheme
2220
import org.jellyfin.androidtv.ui.base.ProvideTextStyle
2321

@@ -29,6 +27,7 @@ fun ButtonBase(
2927
onLongClick: (() -> Unit)? = null,
3028
enabled: Boolean = true,
3129
shape: Shape = ButtonDefaults.Shape,
30+
colors: ButtonColors = ButtonDefaults.colors(),
3231
interactionSource: MutableInteractionSource? = null,
3332
content: @Composable BoxScope.() -> Unit
3433
) {
@@ -37,18 +36,11 @@ fun ButtonBase(
3736
val focused by interactionSource.collectIsFocusedAsState()
3837
val pressed by interactionSource.collectIsPressedAsState()
3938

40-
val containerColor = colorResource(R.color.button_default_normal_background)
41-
val contentColor = colorResource(R.color.button_default_normal_text)
42-
val focusedContainerColor = colorResource(R.color.button_default_highlight_background)
43-
val focusedContentColor = colorResource(R.color.button_default_highlight_text)
44-
val disabledContainerColor = colorResource(R.color.button_default_disabled_background)
45-
val disabledContentColor = colorResource(R.color.button_default_disabled_text)
46-
4739
val colors = when {
48-
!enabled -> disabledContainerColor to disabledContentColor
49-
pressed -> focusedContainerColor to focusedContentColor
50-
focused -> focusedContainerColor to focusedContentColor
51-
else -> containerColor to contentColor
40+
!enabled -> colors.disabledContainerColor to colors.disabledContentColor
41+
pressed -> colors.focusedContainerColor to colors.focusedContentColor
42+
focused -> colors.focusedContainerColor to colors.focusedContentColor
43+
else -> colors.containerColor to colors.contentColor
5244
}
5345

5446
ProvideTextStyle(value = JellyfinTheme.typography.default.copy(fontSize = 14.sp, color = colors.second)) {
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
package org.jellyfin.androidtv.ui.base.button
2+
3+
import androidx.compose.runtime.Immutable
4+
import androidx.compose.ui.graphics.Color
5+
6+
@Immutable
7+
data class ButtonColors(
8+
val containerColor: Color,
9+
val contentColor: Color,
10+
val focusedContainerColor: Color,
11+
val focusedContentColor: Color,
12+
val disabledContainerColor: Color,
13+
val disabledContentColor: Color,
14+
)

app/src/main/java/org/jellyfin/androidtv/ui/base/button/IconButton.kt

+24-2
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,35 @@ import androidx.compose.foundation.layout.Box
55
import androidx.compose.foundation.layout.BoxScope
66
import androidx.compose.foundation.layout.PaddingValues
77
import androidx.compose.foundation.layout.padding
8-
import androidx.compose.foundation.shape.CircleShape
98
import androidx.compose.runtime.Composable
9+
import androidx.compose.runtime.ReadOnlyComposable
1010
import androidx.compose.ui.Modifier
11+
import androidx.compose.ui.graphics.Color
1112
import androidx.compose.ui.graphics.Shape
1213
import androidx.compose.ui.unit.dp
14+
import org.jellyfin.androidtv.ui.base.JellyfinTheme
1315

1416
object IconButtonDefaults {
15-
val Shape: Shape = CircleShape
17+
val Shape: Shape = ButtonDefaults.Shape
1618
val ContentPadding: PaddingValues = PaddingValues(horizontal = 10.dp, vertical = 10.dp)
19+
20+
@ReadOnlyComposable
21+
@Composable
22+
fun colors(
23+
containerColor: Color = JellyfinTheme.colorScheme.button,
24+
contentColor: Color = JellyfinTheme.colorScheme.onButton,
25+
focusedContainerColor: Color = JellyfinTheme.colorScheme.buttonFocused,
26+
focusedContentColor: Color = JellyfinTheme.colorScheme.onButtonFocused,
27+
disabledContainerColor: Color = JellyfinTheme.colorScheme.buttonDisabled,
28+
disabledContentColor: Color = JellyfinTheme.colorScheme.onButtonDisabled,
29+
) = ButtonDefaults.colors(
30+
containerColor = containerColor,
31+
contentColor = contentColor,
32+
focusedContainerColor = focusedContainerColor,
33+
focusedContentColor = focusedContentColor,
34+
disabledContainerColor = disabledContainerColor,
35+
disabledContentColor = disabledContentColor,
36+
)
1737
}
1838

1939
@Composable
@@ -23,6 +43,7 @@ fun IconButton(
2343
onLongClick: (() -> Unit)? = null,
2444
enabled: Boolean = true,
2545
shape: Shape = IconButtonDefaults.Shape,
46+
colors: ButtonColors = ButtonDefaults.colors(),
2647
contentPadding: PaddingValues = IconButtonDefaults.ContentPadding,
2748
interactionSource: MutableInteractionSource? = null,
2849
content: @Composable BoxScope.() -> Unit
@@ -33,6 +54,7 @@ fun IconButton(
3354
onLongClick = onLongClick,
3455
enabled = enabled,
3556
shape = shape,
57+
colors = colors,
3658
interactionSource = interactionSource,
3759
) {
3860
Box(

app/src/main/java/org/jellyfin/androidtv/ui/base/button/ProgressButtonBase.kt

+2
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ fun ProgressButtonBase(
2020
onLongClick: (() -> Unit)? = null,
2121
enabled: Boolean = true,
2222
shape: Shape = ButtonDefaults.Shape,
23+
colors: ButtonColors = ButtonDefaults.colors(),
2324
interactionSource: MutableInteractionSource? = null,
2425
content: @Composable BoxScope.() -> Unit
2526
) {
@@ -31,6 +32,7 @@ fun ProgressButtonBase(
3132
onLongClick = onLongClick,
3233
enabled = enabled,
3334
shape = shape,
35+
colors = colors,
3436
interactionSource = interactionSource,
3537
) {
3638
Box(Modifier.matchParentSize()) {
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
package org.jellyfin.androidtv.ui.base
2+
3+
import androidx.compose.runtime.Immutable
4+
import androidx.compose.runtime.staticCompositionLocalOf
5+
import androidx.compose.ui.graphics.Color
6+
7+
fun colorScheme(): ColorScheme = ColorScheme(
8+
background = Color(0xFF101010),
9+
onBackground = Color(0xFFFFFFFF),
10+
button = Color(0xB3747474),
11+
onButton = Color(0xFFDDDDDD),
12+
buttonFocused = Color(0xE6CCCCCC),
13+
onButtonFocused = Color(0xFF444444),
14+
buttonDisabled = Color(0x33747474),
15+
onButtonDisabled = Color(0xFF686868),
16+
)
17+
18+
@Immutable
19+
data class ColorScheme(
20+
val background: Color,
21+
val onBackground: Color,
22+
23+
val button: Color,
24+
val onButton: Color,
25+
val buttonFocused: Color,
26+
val onButtonFocused: Color,
27+
val buttonDisabled: Color,
28+
val onButtonDisabled: Color,
29+
)
30+
31+
val LocalColorScheme = staticCompositionLocalOf { colorScheme() }

app/src/main/java/org/jellyfin/androidtv/ui/shared/toolbar/Toolbar.kt

+8-1
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ import androidx.compose.ui.unit.dp
2727
import androidx.compose.ui.unit.sp
2828
import kotlinx.coroutines.delay
2929
import org.jellyfin.androidtv.R
30+
import org.jellyfin.androidtv.ui.base.JellyfinTheme
3031
import org.jellyfin.androidtv.ui.base.Text
3132
import org.jellyfin.androidtv.ui.base.modifier.childFocusRestorer
3233
import org.jellyfin.androidtv.ui.composable.modifier.overscan
@@ -87,7 +88,13 @@ fun BoxScope.ToolbarButtons(
8788
.align(Alignment.CenterEnd),
8889
horizontalArrangement = Arrangement.spacedBy(8.dp),
8990
) {
90-
content()
91+
JellyfinTheme(
92+
colorScheme = JellyfinTheme.colorScheme.copy(
93+
button = Color.Transparent
94+
)
95+
) {
96+
content()
97+
}
9198
}
9299
}
93100

0 commit comments

Comments
 (0)