feat(topbar): enhance DefaultTopBar to support left and right actions for improved layout flexibility

This commit is contained in:
2026-05-02 20:22:59 +02:00
parent 1f0c192460
commit dbac1b56c5
6 changed files with 84 additions and 46 deletions

View File

@@ -34,7 +34,8 @@ import hu.bbara.purefin.ui.common.image.PurefinLogo
@Composable
fun DefaultTopBar(
actions: @Composable RowScope.() -> Unit
leftActions: (@Composable RowScope.() -> Unit)? = null,
rightActions: (@Composable RowScope.() -> Unit)? = null,
) {
val scheme = MaterialTheme.colorScheme
@@ -48,12 +49,23 @@ fun DefaultTopBar(
.statusBarsPadding()
.height(84.dp)
.padding(horizontal = 16.dp),
verticalAlignment = Alignment.CenterVertically
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.SpaceBetween
) {
if (leftActions != null) {
Row(
modifier = Modifier.weight(1f),
horizontalArrangement = Arrangement.Start,
verticalAlignment = Alignment.CenterVertically
verticalAlignment = Alignment.CenterVertically,
content = leftActions
)
}
Row(
modifier = Modifier,
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = when {
leftActions == null && rightActions != null -> Arrangement.Start
leftActions != null && rightActions == null -> Arrangement.Center
else -> Arrangement.Center
}
) {
PurefinLogo(
modifier = Modifier.size(84.dp),
@@ -63,15 +75,17 @@ fun DefaultTopBar(
fontSize = 32.sp,
fontWeight = FontWeight.Bold,
fontStyle = FontStyle.Italic,
color = scheme.onSecondary
color = scheme.primary
)
}
if (rightActions != null) {
Row(
verticalAlignment = Alignment.CenterVertically,
content = actions
content = rightActions
)
}
}
}
}
@OptIn(ExperimentalSharedTransitionApi::class)

View File

@@ -32,8 +32,8 @@ fun HomeTopBar(
var isProfileMenuExpanded by remember { mutableStateOf(false) }
DefaultTopBar()
{
DefaultTopBar(
rightActions = {
DefaultTopBarSearchButton(onClick = onSearchClick)
Spacer(modifier = Modifier.size(12.dp))
IconButton(
@@ -81,4 +81,5 @@ fun HomeTopBar(
)
}
}
)
}

View File

@@ -9,7 +9,7 @@ import androidx.compose.ui.Modifier
import hu.bbara.purefin.ui.model.LibraryUiModel
import hu.bbara.purefin.ui.screen.AppBottomBar
import hu.bbara.purefin.ui.screen.libraries.components.LibrariesContent
import hu.bbara.purefin.ui.screen.library.components.LibraryTopBar
import hu.bbara.purefin.ui.screen.libraries.components.LibrariesTopBar
@Composable
fun LibrariesScreen(
@@ -25,7 +25,7 @@ fun LibrariesScreen(
containerColor = MaterialTheme.colorScheme.background,
contentColor = MaterialTheme.colorScheme.onBackground,
topBar = {
LibraryTopBar(
LibrariesTopBar(
onSearchClick = onSearchClick,
)
},

View File

@@ -0,0 +1,16 @@
package hu.bbara.purefin.ui.screen.libraries.components
import androidx.compose.runtime.Composable
import hu.bbara.purefin.ui.screen.home.components.DefaultTopBar
import hu.bbara.purefin.ui.screen.home.components.DefaultTopBarSearchButton
@Composable
fun LibrariesTopBar(
onSearchClick: () -> Unit,
) {
DefaultTopBar(
rightActions = {
DefaultTopBarSearchButton(onClick = onSearchClick)
}
)
}

View File

@@ -4,15 +4,10 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.ArrowBack
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Scaffold
import androidx.compose.runtime.Composable
@@ -21,11 +16,11 @@ import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp
import androidx.hilt.navigation.compose.hiltViewModel
import hu.bbara.purefin.navigation.LibraryDto
import hu.bbara.purefin.ui.model.MediaUiModel
import hu.bbara.purefin.feature.browse.library.LibraryViewModel
import hu.bbara.purefin.ui.common.button.PurefinIconButton
import hu.bbara.purefin.navigation.LibraryDto
import hu.bbara.purefin.ui.common.card.PosterCard
import hu.bbara.purefin.ui.model.MediaUiModel
import hu.bbara.purefin.ui.screen.library.components.LibraryTopBar
@Composable
fun LibraryScreen(
@@ -52,24 +47,6 @@ fun LibraryScreen(
}
}
@Composable
internal fun LibraryTopBar(
onBack: () -> Unit,
) {
Row(
modifier = Modifier
.fillMaxWidth()
.statusBarsPadding()
.padding(16.dp)
) {
PurefinIconButton(
icon = Icons.Outlined.ArrowBack,
contentDescription = "Back",
onClick = onBack
)
}
}
@Composable
internal fun LibraryPosterGrid(
libraryItems: List<MediaUiModel>,

View File

@@ -1,14 +1,44 @@
package hu.bbara.purefin.ui.screen.library.components
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.ArrowBack
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.IconButtonColors
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.unit.dp
import hu.bbara.purefin.ui.screen.home.components.DefaultTopBar
import hu.bbara.purefin.ui.screen.home.components.DefaultTopBarSearchButton
@Composable
fun LibraryTopBar(
onSearchClick: () -> Unit,
onBack: () -> Unit,
) {
DefaultTopBar {
DefaultTopBarSearchButton(onClick = onSearchClick)
val scheme = MaterialTheme.colorScheme
DefaultTopBar(
leftActions = {
IconButton(
onClick = onBack,
colors = IconButtonColors(
containerColor = scheme.surface,
contentColor = scheme.onSurface,
disabledContainerColor = scheme.surface,
disabledContentColor = scheme.onSurface
),
modifier = Modifier
.size(50.dp)
.clip(CircleShape),
) {
Icon(
imageVector = Icons.Outlined.ArrowBack,
contentDescription = "Search",
modifier = Modifier.size(30.dp),
)
}
}
)
}