From efd75936463951e7d8195dc540dc6e71d47db98d Mon Sep 17 00:00:00 2001 From: Barnabas Balogh Date: Sat, 2 May 2026 21:04:58 +0200 Subject: [PATCH] feat(topbar): create DefaultTopBarIconButton for reusable icon button implementation --- .../screen/home/components/DefaultTopBar.kt | 31 ++++++++++ .../ui/screen/home/components/HomeTopBar.kt | 29 ++-------- .../home/components/search/SearchScreen.kt | 57 +++---------------- .../library/components/LibraryTopBar.kt | 36 +++--------- 4 files changed, 51 insertions(+), 102 deletions(-) diff --git a/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/DefaultTopBar.kt b/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/DefaultTopBar.kt index c95573e1..598643a1 100644 --- a/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/DefaultTopBar.kt +++ b/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/DefaultTopBar.kt @@ -12,6 +12,7 @@ import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.statusBarsPadding +import androidx.compose.foundation.shape.CircleShape import androidx.compose.material.icons.Icons import androidx.compose.material.icons.outlined.Search import androidx.compose.material3.Icon @@ -23,6 +24,8 @@ import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.vector.ImageVector import androidx.compose.ui.text.font.FontStyle import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.unit.dp @@ -88,6 +91,34 @@ fun DefaultTopBar( } } +@Composable +fun DefaultTopBarIconButton( + imageVector: ImageVector, + contentDescription: String, + onClick: () -> Unit, +) { + val scheme = MaterialTheme.colorScheme + + IconButton( + onClick = onClick, + colors = IconButtonColors( + containerColor = scheme.surface, + contentColor = scheme.onSurface, + disabledContainerColor = scheme.surface, + disabledContentColor = scheme.onSurface + ), + modifier = Modifier + .size(50.dp) + .clip(CircleShape), + ) { + Icon( + imageVector = imageVector, + contentDescription = contentDescription, + modifier = Modifier.size(30.dp), + ) + } +} + @OptIn(ExperimentalSharedTransitionApi::class) @Composable fun DefaultTopBarSearchButton( diff --git a/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/HomeTopBar.kt b/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/HomeTopBar.kt index 6c0abb15..b681e79b 100644 --- a/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/HomeTopBar.kt +++ b/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/HomeTopBar.kt @@ -2,15 +2,10 @@ package hu.bbara.purefin.ui.screen.home.components import androidx.compose.foundation.layout.Spacer import androidx.compose.foundation.layout.size -import androidx.compose.foundation.shape.CircleShape import androidx.compose.material.icons.Icons import androidx.compose.material.icons.outlined.Person import androidx.compose.material3.DropdownMenu import androidx.compose.material3.DropdownMenuItem -import androidx.compose.material3.Icon -import androidx.compose.material3.IconButton -import androidx.compose.material3.IconButtonColors -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Text import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue @@ -18,7 +13,6 @@ import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier -import androidx.compose.ui.draw.clip import androidx.compose.ui.unit.dp @Composable @@ -28,32 +22,17 @@ fun HomeTopBar( onSettingsClick: () -> Unit, onLogoutClick: () -> Unit, ) { - val scheme = MaterialTheme.colorScheme - var isProfileMenuExpanded by remember { mutableStateOf(false) } DefaultTopBar( rightActions = { DefaultTopBarSearchButton(onClick = onSearchClick) Spacer(modifier = Modifier.size(12.dp)) - IconButton( + DefaultTopBarIconButton( + imageVector = Icons.Outlined.Person, + contentDescription = "Profile", onClick = { isProfileMenuExpanded = true }, - 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.Person, - contentDescription = "Profile", - modifier = Modifier.size(30.dp), - ) - } + ) DropdownMenu( expanded = isProfileMenuExpanded, onDismissRequest = { isProfileMenuExpanded = false }, diff --git a/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/search/SearchScreen.kt b/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/search/SearchScreen.kt index 6c85d41e..49b766c5 100644 --- a/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/search/SearchScreen.kt +++ b/app/src/main/java/hu/bbara/purefin/ui/screen/home/components/search/SearchScreen.kt @@ -35,6 +35,7 @@ import androidx.compose.material3.FilterChip import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Scaffold import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.material3.TextField @@ -65,6 +66,7 @@ import hu.bbara.purefin.navigation.HOME_SEARCH_SHARED_BOUNDS_KEY import hu.bbara.purefin.navigation.LocalNavSharedAnimatedVisibilityScope import hu.bbara.purefin.navigation.LocalSharedTransitionScope import hu.bbara.purefin.ui.common.image.PurefinLogo +import hu.bbara.purefin.ui.screen.home.components.DefaultTopBar import hu.bbara.purefin.ui.theme.AppTheme import java.util.UUID @@ -133,7 +135,8 @@ private fun SearchFullScreenContent( ) { val scheme = MaterialTheme.colorScheme - Column( + Scaffold( + topBar = { SearchHeader() }, modifier = modifier .fillMaxSize() .background(scheme.background) @@ -141,9 +144,7 @@ private fun SearchFullScreenContent( .verticalScroll(rememberScrollState()) .padding(horizontal = 20.dp) .padding(bottom = 28.dp) - ) { - SearchHeader(modifier = Modifier.padding(top = 12.dp)) - Spacer(modifier = Modifier.height(24.dp)) + ) { innerPadding -> SearchField( query = query, onQueryChange = onQueryChange, @@ -205,51 +206,11 @@ private fun SearchHeader( ) { val scheme = MaterialTheme.colorScheme - Row( - verticalAlignment = Alignment.CenterVertically, - modifier = modifier.fillMaxWidth() - ) { - IconButton(onClick = {}) { - Icon( - imageVector = Icons.Outlined.Menu, - contentDescription = "Menu", - tint = scheme.primary, - modifier = Modifier.size(30.dp) - ) + DefaultTopBar( + leftActions = { + } - Spacer(modifier = Modifier.weight(1f)) - Row( - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.spacedBy(10.dp) - ) { - PurefinLogo( - modifier = Modifier.size(64.dp) - ) - Text( - text = "PureFin", - color = scheme.primary, - fontSize = 30.sp, - fontWeight = FontWeight.Bold, - fontStyle = FontStyle.Italic - ) - } - Spacer(modifier = Modifier.weight(1f)) - Surface( - shape = CircleShape, - color = scheme.surfaceContainer, - border = BorderStroke(1.dp, scheme.outlineVariant.copy(alpha = 0.28f)), - modifier = Modifier.size(48.dp) - ) { - Box(contentAlignment = Alignment.Center) { - Icon( - imageVector = Icons.Outlined.Person, - contentDescription = "Profile", - tint = scheme.onSurfaceVariant, - modifier = Modifier.size(26.dp) - ) - } - } - } + ) } @Composable diff --git a/app/src/main/java/hu/bbara/purefin/ui/screen/library/components/LibraryTopBar.kt b/app/src/main/java/hu/bbara/purefin/ui/screen/library/components/LibraryTopBar.kt index 4a26b64a..59635ceb 100644 --- a/app/src/main/java/hu/bbara/purefin/ui/screen/library/components/LibraryTopBar.kt +++ b/app/src/main/java/hu/bbara/purefin/ui/screen/library/components/LibraryTopBar.kt @@ -1,44 +1,22 @@ 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.automirrored.outlined.ArrowBack 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.DefaultTopBarIconButton @Composable fun LibraryTopBar( onBack: () -> Unit, ) { - val scheme = MaterialTheme.colorScheme DefaultTopBar( leftActions = { - IconButton( + DefaultTopBarIconButton( + imageVector = Icons.AutoMirrored.Outlined.ArrowBack, + contentDescription = "Back", 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), - ) - } + ) } ) -} \ No newline at end of file +}