player: Icon-only action row
Bell, thumbs, chat bubble and playlist icons instead of text labels — no translutable strings in the action row; labels live on as contentDescription for accessibility. Like/dislike get proper icons instead of emoji text with the count as a digit next to them.
This commit is contained in:
parent
4af904bf2a
commit
01c08e1dbb
1 changed files with 38 additions and 16 deletions
|
|
@ -28,10 +28,16 @@ import androidx.compose.foundation.layout.size
|
||||||
import androidx.compose.foundation.shape.CircleShape
|
import androidx.compose.foundation.shape.CircleShape
|
||||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
import androidx.compose.foundation.shape.RoundedCornerShape
|
||||||
import androidx.compose.material.icons.Icons
|
import androidx.compose.material.icons.Icons
|
||||||
|
import androidx.compose.material.icons.filled.ChatBubbleOutline
|
||||||
import androidx.compose.material.icons.filled.Forward10
|
import androidx.compose.material.icons.filled.Forward10
|
||||||
|
import androidx.compose.material.icons.filled.NotificationsActive
|
||||||
|
import androidx.compose.material.icons.filled.NotificationsNone
|
||||||
import androidx.compose.material.icons.filled.Pause
|
import androidx.compose.material.icons.filled.Pause
|
||||||
import androidx.compose.material.icons.filled.PlayArrow
|
import androidx.compose.material.icons.filled.PlayArrow
|
||||||
|
import androidx.compose.material.icons.filled.PlaylistAdd
|
||||||
import androidx.compose.material.icons.filled.Replay10
|
import androidx.compose.material.icons.filled.Replay10
|
||||||
|
import androidx.compose.material.icons.filled.ThumbDown
|
||||||
|
import androidx.compose.material.icons.filled.ThumbUp
|
||||||
import androidx.compose.material3.CircularProgressIndicator
|
import androidx.compose.material3.CircularProgressIndicator
|
||||||
import androidx.compose.material3.Icon
|
import androidx.compose.material3.Icon
|
||||||
import androidx.compose.material3.MaterialTheme
|
import androidx.compose.material3.MaterialTheme
|
||||||
|
|
@ -708,11 +714,8 @@ private fun PausedControls(
|
||||||
verticalAlignment = Alignment.CenterVertically,
|
verticalAlignment = Alignment.CenterVertically,
|
||||||
) {
|
) {
|
||||||
PlayerActionButton(
|
PlayerActionButton(
|
||||||
label = when (subscribed) {
|
icon = if (subscribed == true) Icons.Filled.NotificationsActive else Icons.Filled.NotificationsNone,
|
||||||
true -> "Subscribed"
|
desc = if (subscribed == true) "Subscribed" else "Subscribe",
|
||||||
false -> "Subscribe"
|
|
||||||
else -> "Subscribe"
|
|
||||||
},
|
|
||||||
filled = subscribed == true,
|
filled = subscribed == true,
|
||||||
focusRequester = actionBarFocus,
|
focusRequester = actionBarFocus,
|
||||||
) { done ->
|
) { done ->
|
||||||
|
|
@ -735,7 +738,9 @@ private fun PausedControls(
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
PlayerActionButton(
|
PlayerActionButton(
|
||||||
label = "👍 " + likeCount,
|
icon = Icons.Filled.ThumbUp,
|
||||||
|
desc = "Like",
|
||||||
|
count = likeCount,
|
||||||
filled = rating == "like",
|
filled = rating == "like",
|
||||||
) { done ->
|
) { done ->
|
||||||
scope.launch {
|
scope.launch {
|
||||||
|
|
@ -749,7 +754,9 @@ private fun PausedControls(
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
PlayerActionButton(
|
PlayerActionButton(
|
||||||
label = "👎 " + dislikeCount,
|
icon = Icons.Filled.ThumbDown,
|
||||||
|
desc = "Dislike",
|
||||||
|
count = dislikeCount,
|
||||||
filled = rating == "dislike",
|
filled = rating == "dislike",
|
||||||
) { done ->
|
) { done ->
|
||||||
scope.launch {
|
scope.launch {
|
||||||
|
|
@ -763,13 +770,15 @@ private fun PausedControls(
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
PlayerActionButton(
|
PlayerActionButton(
|
||||||
label = "Comments",
|
icon = Icons.Filled.ChatBubbleOutline,
|
||||||
|
desc = "Comments",
|
||||||
) { done ->
|
) { done ->
|
||||||
done()
|
done()
|
||||||
openSidebar("comments")
|
openSidebar("comments")
|
||||||
}
|
}
|
||||||
PlayerActionButton(
|
PlayerActionButton(
|
||||||
label = "Playlists",
|
icon = Icons.Filled.PlaylistAdd,
|
||||||
|
desc = "Playlists",
|
||||||
) { done ->
|
) { done ->
|
||||||
done()
|
done()
|
||||||
openSidebar("playlists")
|
openSidebar("playlists")
|
||||||
|
|
@ -907,7 +916,9 @@ private fun formatDuration(seconds: Int): String {
|
||||||
* subscribed/liked states get a solid accent background. */
|
* subscribed/liked states get a solid accent background. */
|
||||||
@Composable
|
@Composable
|
||||||
private fun PlayerActionButton(
|
private fun PlayerActionButton(
|
||||||
label: String,
|
icon: androidx.compose.ui.graphics.vector.ImageVector,
|
||||||
|
desc: String,
|
||||||
|
count: Long? = null,
|
||||||
filled: Boolean = false,
|
filled: Boolean = false,
|
||||||
focusRequester: FocusRequester? = null,
|
focusRequester: FocusRequester? = null,
|
||||||
// [onClick] receives an onDone callback; only call it when the action's
|
// [onClick] receives an onDone callback; only call it when the action's
|
||||||
|
|
@ -946,12 +957,23 @@ private fun PlayerActionButton(
|
||||||
)
|
)
|
||||||
// Click only for real pointer input; the key activation above is guarded.
|
// Click only for real pointer input; the key activation above is guarded.
|
||||||
.pointerInput(Unit) { detectTapGestures { activate() } }
|
.pointerInput(Unit) { detectTapGestures { activate() } }
|
||||||
Box(modifier = m.padding(horizontal = 14.dp, vertical = 8.dp)) {
|
Row(
|
||||||
Text(
|
modifier = Modifier.padding(horizontal = 12.dp, vertical = 8.dp),
|
||||||
text = label,
|
verticalAlignment = Alignment.CenterVertically,
|
||||||
color = Color.White,
|
) {
|
||||||
style = MaterialTheme.typography.bodyMedium,
|
androidx.compose.material3.Icon(
|
||||||
maxLines = 1,
|
imageVector = icon,
|
||||||
|
contentDescription = desc,
|
||||||
|
tint = Color.White,
|
||||||
|
modifier = Modifier.size(26.dp),
|
||||||
)
|
)
|
||||||
|
if (count != null) {
|
||||||
|
Text(
|
||||||
|
text = count.toString(),
|
||||||
|
color = Color.White,
|
||||||
|
style = MaterialTheme.typography.bodyMedium,
|
||||||
|
modifier = Modifier.padding(start = 6.dp),
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue