Fix black theme playback button highlighting (#314)

On the playback buttons, inverts the icon color when highlighted for
contrast.

Closes #295

<img width="518" height="109" alt="image"
src="https://github.com/user-attachments/assets/d689f347-a395-40e4-89e2-3122ab2a9e13"
/>
This commit is contained in:
damontecres 2025-11-24 10:01:19 -05:00 committed by GitHub
parent 7e21033f58
commit 6004687deb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 45 additions and 1 deletions

View file

@ -56,13 +56,16 @@ import androidx.tv.material3.Button
import androidx.tv.material3.ButtonDefaults
import androidx.tv.material3.Icon
import androidx.tv.material3.ListItem
import androidx.tv.material3.LocalContentColor
import androidx.tv.material3.MaterialTheme
import androidx.tv.material3.Text
import com.github.damontecres.wholphin.R
import com.github.damontecres.wholphin.preferences.AppThemeColors
import com.github.damontecres.wholphin.ui.AppColors
import com.github.damontecres.wholphin.ui.seekBack
import com.github.damontecres.wholphin.ui.seekForward
import com.github.damontecres.wholphin.ui.skipStringRes
import com.github.damontecres.wholphin.ui.theme.LocalTheme
import com.github.damontecres.wholphin.ui.tryRequestFocus
import com.github.damontecres.wholphin.util.ExceptionHandler
import kotlinx.coroutines.delay
@ -426,6 +429,7 @@ fun PlaybackButton(
onControllerInteraction: () -> Unit,
modifier: Modifier = Modifier,
enabled: Boolean = true,
interactionSource: MutableInteractionSource? = null,
) {
val selectedColor = MaterialTheme.colorScheme.border
Button(
@ -438,6 +442,7 @@ fun PlaybackButton(
focusedContainerColor = selectedColor,
),
contentPadding = PaddingValues(4.dp),
interactionSource = interactionSource,
modifier =
modifier
.padding(4.dp)
@ -448,7 +453,12 @@ fun PlaybackButton(
modifier = Modifier.fillMaxSize(),
painter = painterResource(iconRes),
contentDescription = "",
tint = MaterialTheme.colorScheme.onSurface,
tint =
if (LocalTheme.current == AppThemeColors.OLED_BLACK) {
LocalContentColor.current
} else {
MaterialTheme.colorScheme.onSurface
},
)
}
}

View file

@ -26,14 +26,17 @@ import androidx.tv.material3.MaterialTheme
import androidx.tv.material3.NavigationDrawerScope
import androidx.tv.material3.Text
import androidx.tv.material3.surfaceColorAtElevation
import com.github.damontecres.wholphin.R
import com.github.damontecres.wholphin.preferences.AppPreference
import com.github.damontecres.wholphin.preferences.AppThemeColors
import com.github.damontecres.wholphin.ui.AspectRatios
import com.github.damontecres.wholphin.ui.cards.BannerCard
import com.github.damontecres.wholphin.ui.cards.SeasonCard
import com.github.damontecres.wholphin.ui.cards.WatchedIcon
import com.github.damontecres.wholphin.ui.components.ExpandableFaButton
import com.github.damontecres.wholphin.ui.nav.NavDrawerItem
import com.github.damontecres.wholphin.ui.nav.NavItem
import com.github.damontecres.wholphin.ui.playback.PlaybackButton
import com.github.damontecres.wholphin.ui.preferences.SliderPreference
import com.github.damontecres.wholphin.ui.preferences.SwitchPreference
import kotlinx.coroutines.flow.Flow
@ -235,6 +238,37 @@ private fun ThemeExample(theme: AppThemeColors) {
)
}
}
Row(
horizontalArrangement = Arrangement.spacedBy(16.dp),
modifier = Modifier.background(MaterialTheme.colorScheme.surfaceVariant),
) {
PlaybackButton(
modifier = Modifier,
iconRes = R.drawable.baseline_play_arrow_24,
onClick = {},
onControllerInteraction = {},
)
PlaybackButton(
modifier = Modifier,
iconRes = R.drawable.baseline_play_arrow_24,
onClick = {},
onControllerInteraction = {},
interactionSource = source,
)
PlaybackButton(
modifier = Modifier,
iconRes = R.drawable.baseline_pause_24,
onClick = {},
onControllerInteraction = {},
)
PlaybackButton(
modifier = Modifier,
iconRes = R.drawable.baseline_pause_24,
onClick = {},
onControllerInteraction = {},
interactionSource = source,
)
}
}
}
}