From 45c8e65e7552a5aa77b2b283f14cabaca0cbfd6d Mon Sep 17 00:00:00 2001 From: tapframe <85391825+tapframe@users.noreply.github.com> Date: Sun, 8 Mar 2026 01:26:46 +0530 Subject: [PATCH] adjust sidebar paddings --- .../main/java/com/nuvio/tv/MainActivity.kt | 101 +++++++++--------- .../com/nuvio/tv/ModernSidebarBlurPanel.kt | 94 +++++++--------- 2 files changed, 89 insertions(+), 106 deletions(-) diff --git a/app/src/main/java/com/nuvio/tv/MainActivity.kt b/app/src/main/java/com/nuvio/tv/MainActivity.kt index ab1fae96..a4b23d9a 100644 --- a/app/src/main/java/com/nuvio/tv/MainActivity.kt +++ b/app/src/main/java/com/nuvio/tv/MainActivity.kt @@ -609,21 +609,58 @@ private fun LegacySidebarScaffold( } ) { val isExpanded = drawerValue == DrawerValue.Open - if (isExpanded) { + val itemWidth = if (isExpanded) 176.dp else 48.dp + + if (isExpanded && showProfileSelector && activeProfileName.isNotEmpty()) { Spacer(modifier = Modifier.height(30.dp)) - Image( - painter = painterResource(id = R.drawable.app_logo_wordmark), - contentDescription = "NuvioTV", - modifier = Modifier - .fillMaxWidth() - .height(42.dp) + var isProfileFocused by remember { mutableStateOf(false) } + val profileItemShape = RoundedCornerShape(32.dp) + val profileLeadingInset = 18.dp + val profileAvatarSize = 34.dp + val profileLabelStart = 54.dp + val profileGapAfterAvatar = + (profileLabelStart - profileLeadingInset - profileAvatarSize).coerceAtLeast(0.dp) + val profileBgColor by animateColorAsState( + targetValue = if (isProfileFocused) NuvioColors.FocusBackground else Color.Transparent, + label = "legacyProfileItemBg" ) + Box( + modifier = Modifier.fillMaxWidth(), + contentAlignment = Alignment.Center + ) { + Row( + modifier = Modifier + .width(itemWidth) + .height(52.dp) + .clip(profileItemShape) + .background(color = profileBgColor, shape = profileItemShape) + .onFocusChanged { isProfileFocused = it.isFocused } + .clickable { + onSwitchProfile() + drawerState.setValue(DrawerValue.Closed) + }, + verticalAlignment = Alignment.CenterVertically + ) { + Spacer(modifier = Modifier.width(profileLeadingInset)) + ProfileAvatarCircle( + name = activeProfileName, + colorHex = activeProfileColorHex, + size = profileAvatarSize, + avatarImageUrl = activeProfileAvatarImageUrl + ) + Spacer(modifier = Modifier.width(profileGapAfterAvatar)) + Text( + text = activeProfileName, + color = if (isProfileFocused) NuvioColors.TextPrimary else NuvioColors.TextSecondary, + maxLines = 1, + textAlign = TextAlign.Start + ) + } + } Spacer(modifier = Modifier.height(16.dp)) } Spacer(modifier = Modifier.weight(1f)) - - val itemWidth = if (isExpanded) 176.dp else 48.dp Column( modifier = Modifier.fillMaxWidth(), verticalArrangement = Arrangement.spacedBy(10.dp), @@ -653,48 +690,6 @@ private fun LegacySidebarScaffold( } Spacer(modifier = Modifier.weight(1f)) - - if (isExpanded && showProfileSelector && activeProfileName.isNotEmpty()) { - var isProfileFocused by remember { mutableStateOf(false) } - val profileItemShape = RoundedCornerShape(32.dp) - val profileBgColor by animateColorAsState( - targetValue = if (isProfileFocused) NuvioColors.FocusBackground else Color.Transparent, - label = "legacyProfileItemBg" - ) - Box( - modifier = Modifier.fillMaxWidth(), - contentAlignment = Alignment.Center - ) { - Row( - modifier = Modifier - .width(itemWidth) - .height(52.dp) - .clip(profileItemShape) - .background(color = profileBgColor, shape = profileItemShape) - .onFocusChanged { isProfileFocused = it.isFocused } - .clickable { - onSwitchProfile() - drawerState.setValue(DrawerValue.Closed) - }, - verticalAlignment = Alignment.CenterVertically - ) { - Spacer(modifier = Modifier.width(10.dp)) - ProfileAvatarCircle( - name = activeProfileName, - colorHex = activeProfileColorHex, - size = 34.dp, - avatarImageUrl = activeProfileAvatarImageUrl - ) - Spacer(modifier = Modifier.width(10.dp)) - Text( - text = activeProfileName, - color = if (isProfileFocused) NuvioColors.TextPrimary else NuvioColors.TextSecondary, - maxLines = 1, - textAlign = TextAlign.Start - ) - } - } - } } } } @@ -751,7 +746,7 @@ private fun LegacySidebarButton( val backgroundColor by animateColorAsState( targetValue = when { isFocused -> NuvioColors.FocusBackground - selected -> NuvioColors.BackgroundCard + selected -> NuvioColors.Secondary else -> Color.Transparent }, label = "legacySidebarItemBackground" @@ -759,7 +754,7 @@ private fun LegacySidebarButton( val contentColor by animateColorAsState( targetValue = when { isFocused -> NuvioColors.TextPrimary - selected -> NuvioColors.TextPrimary + selected -> NuvioColors.OnSecondary else -> NuvioColors.TextSecondary }, label = "legacySidebarItemContent" diff --git a/app/src/main/java/com/nuvio/tv/ModernSidebarBlurPanel.kt b/app/src/main/java/com/nuvio/tv/ModernSidebarBlurPanel.kt index b6eb6078..70474b2e 100644 --- a/app/src/main/java/com/nuvio/tv/ModernSidebarBlurPanel.kt +++ b/app/src/main/java/com/nuvio/tv/ModernSidebarBlurPanel.kt @@ -2,7 +2,6 @@ package com.nuvio.tv import androidx.compose.animation.animateColorAsState import androidx.compose.animation.core.tween -import androidx.compose.foundation.Image import androidx.compose.foundation.background import androidx.compose.foundation.border import androidx.compose.foundation.focusable @@ -41,10 +40,8 @@ import androidx.compose.ui.graphics.Brush import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.TransformOrigin import androidx.compose.ui.graphics.graphicsLayer -import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.graphics.painter.Painter import androidx.compose.ui.graphics.vector.ImageVector -import androidx.compose.ui.res.painterResource import androidx.compose.ui.text.style.TextOverflow import androidx.compose.ui.unit.dp import androidx.tv.material3.Icon @@ -57,6 +54,9 @@ import coil.compose.rememberAsyncImagePainter import coil.decode.SvgDecoder import coil.request.ImageRequest +private val SidebarLeadingVisualSize = 34.dp +private val SidebarContentGap = 14.dp + @Composable internal fun ModernSidebarBlurPanel( drawerItems: List, @@ -131,19 +131,27 @@ internal fun ModernSidebarBlurPanel( .border(width = 1.dp, color = panelBorderColor, shape = panelShape) .padding(horizontal = 12.dp, vertical = 14.dp) ) { - val headerLogoRes = if (isSidebarExpanded) R.drawable.app_logo_wordmark else R.drawable.app_logo_mark - val headerLogoHeight = if (isSidebarExpanded) 42.dp else 34.dp - val headerLogoContentDescription = if (isSidebarExpanded) "NuvioTV" else "Nuvio" - - Image( - painter = painterResource(id = headerLogoRes), - contentDescription = headerLogoContentDescription, - modifier = Modifier - .fillMaxWidth() - .height(headerLogoHeight) - .offset(y = 12.dp), - contentScale = ContentScale.Fit - ) + if (showProfileSelector && activeProfileName.isNotEmpty()) { + Box( + modifier = Modifier + .fillMaxWidth() + .offset(y = 12.dp), + contentAlignment = Alignment.Center + ) { + SidebarProfileItem( + profileName = activeProfileName, + profileColorHex = activeProfileColorHex, + profileAvatarImageUrl = activeProfileAvatarImageUrl, + focusEnabled = keepSidebarFocusDuringCollapse, + labelAlpha = sidebarLabelAlpha, + onFocusChanged = { focused -> + if (focused) onDrawerItemFocused(drawerItems.size) + }, + onClick = onSwitchProfile, + modifier = Modifier.fillMaxWidth(0.92f) + ) + } + } Spacer(modifier = Modifier.height(16.dp)) @@ -181,26 +189,6 @@ internal fun ModernSidebarBlurPanel( } } - if (showProfileSelector && activeProfileName.isNotEmpty()) { - Spacer(modifier = Modifier.height(8.dp)) - Box( - modifier = Modifier.fillMaxWidth(), - contentAlignment = Alignment.Center - ) { - SidebarProfileItem( - profileName = activeProfileName, - profileColorHex = activeProfileColorHex, - profileAvatarImageUrl = activeProfileAvatarImageUrl, - focusEnabled = keepSidebarFocusDuringCollapse, - labelAlpha = sidebarLabelAlpha, - onFocusChanged = { focused -> - if (focused) onDrawerItemFocused(drawerItems.size) - }, - onClick = onSwitchProfile, - modifier = Modifier.fillMaxWidth(0.92f) - ) - } - } } } @@ -236,9 +224,6 @@ private fun SidebarNavigationItem( val contentColor = if (selected) Color(0xFF10151F) else Color.White val iconCircleColor = if (selected) Color(0xFFE7E2EF) else Color(0xFF6A6A74) - val iconContainerSize = 34.dp - val contentGap = 14.dp - Row( modifier = modifier .clip(shape) @@ -262,7 +247,7 @@ private fun SidebarNavigationItem( ) { Box( modifier = Modifier - .size(iconContainerSize) + .size(SidebarLeadingVisualSize) .clip(CircleShape) .background(iconCircleColor) .padding(6.dp) @@ -288,7 +273,7 @@ private fun SidebarNavigationItem( ) } } - Spacer(modifier = Modifier.width(contentGap)) + Spacer(modifier = Modifier.width(SidebarContentGap)) Text( text = label, @@ -300,7 +285,6 @@ private fun SidebarNavigationItem( maxLines = 1, overflow = TextOverflow.Ellipsis ) - Spacer(modifier = Modifier.width(iconContainerSize + contentGap)) } } @@ -327,9 +311,6 @@ private fun SidebarProfileItem( animationSpec = tween(durationMillis = 180), label = "profileItemBorder" ) - val contentGap = 14.dp - val iconContainerSize = 34.dp - Row( modifier = modifier .clip(shape) @@ -351,20 +332,27 @@ private fun SidebarProfileItem( .padding(horizontal = 14.dp, vertical = 10.dp), verticalAlignment = Alignment.CenterVertically ) { - ProfileAvatarCircle( - name = profileName, - colorHex = profileColorHex, - size = iconContainerSize, - avatarImageUrl = profileAvatarImageUrl - ) - Spacer(modifier = Modifier.width(contentGap)) + Box( + modifier = Modifier.size(SidebarLeadingVisualSize), + contentAlignment = Alignment.Center + ) { + ProfileAvatarCircle( + name = profileName, + colorHex = profileColorHex, + size = SidebarLeadingVisualSize, + avatarImageUrl = profileAvatarImageUrl + ) + } + Spacer(modifier = Modifier.width(SidebarContentGap)) Text( text = profileName, color = Color.White, modifier = Modifier + .weight(1f) .graphicsLayer { alpha = labelAlpha }, style = androidx.tv.material3.MaterialTheme.typography.titleLarge, - maxLines = 1 + maxLines = 1, + overflow = TextOverflow.Ellipsis ) } }