diff --git a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/common/navigation/AVALayout.kt b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/common/navigation/AVALayout.kt index 3acca39f..1e5c018d 100644 --- a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/common/navigation/AVALayout.kt +++ b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/common/navigation/AVALayout.kt @@ -23,12 +23,12 @@ import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme -import androidx.compose.material3.MediumTopAppBar import androidx.compose.material3.NavigationBar import androidx.compose.material3.NavigationBarItem import androidx.compose.material3.NavigationBarItemDefaults import androidx.compose.material3.Scaffold import androidx.compose.material3.Text +import androidx.compose.material3.TopAppBar import androidx.compose.material3.TopAppBarDefaults import androidx.compose.material3.rememberDrawerState import androidx.compose.runtime.Composable @@ -83,7 +83,7 @@ fun AVALayout( val userFlow = remember { UserData().userRepository.user } val agendaFilterDrawerState = rememberDrawerState(DrawerValue.Closed) - val scrollBehavior = TopAppBarDefaults.pinnedScrollBehavior() + val scrollBehavior = TopAppBarDefaults.enterAlwaysScrollBehavior() val user by userFlow.collectAsStateWithLifecycle() @@ -91,7 +91,7 @@ fun AVALayout( modifier = Modifier.nestedScroll(scrollBehavior.nestedScrollConnection), contentWindowInsets = WindowInsets(0, 0, 0, 0), topBar = { - MediumTopAppBar( + TopAppBar( scrollBehavior = scrollBehavior, colors = TopAppBarDefaults.topAppBarColors( containerColor = MaterialTheme.colorScheme.background, @@ -113,7 +113,7 @@ fun AVALayout( Text( text = stringResource(MR.strings.app_name), - style = MaterialTheme.typography.headlineSmall, + style = MaterialTheme.typography.titleSmall, maxLines = 1, overflow = TextOverflow.Ellipsis ) diff --git a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerDetailsScreen.kt b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerDetailsScreen.kt index 0d1f1436..404e79e9 100644 --- a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerDetailsScreen.kt +++ b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerDetailsScreen.kt @@ -3,11 +3,11 @@ package com.androidmakers.ui.speakers import androidx.compose.foundation.Image import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.WindowInsets -import androidx.compose.foundation.layout.navigationBarsPadding import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size +import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.shape.CircleShape +import androidx.compose.foundation.verticalScroll import androidx.compose.material.icons.Icons import androidx.compose.material.icons.automirrored.rounded.ArrowBack import androidx.compose.material3.ExperimentalMaterial3Api @@ -84,6 +84,7 @@ fun SpeakerDetailsScreen( ) { innerPadding -> Column( modifier = Modifier + .verticalScroll(rememberScrollState()) .padding(innerPadding) .padding(16.dp), verticalArrangement = Arrangement.spacedBy(16.dp, Alignment.CenterVertically) diff --git a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerListScreen.kt b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerListScreen.kt index 1629400b..de075b3e 100644 --- a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerListScreen.kt +++ b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/speakers/SpeakerListScreen.kt @@ -4,15 +4,12 @@ import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.fadeIn import androidx.compose.animation.fadeOut import androidx.compose.foundation.Image -import androidx.compose.foundation.background import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.WindowInsets import androidx.compose.foundation.layout.fillMaxSize -import androidx.compose.foundation.layout.fillMaxWidth -import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.items @@ -31,16 +28,15 @@ import androidx.compose.runtime.Composable import androidx.compose.runtime.collectAsState import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember import androidx.compose.runtime.saveable.rememberSaveable import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip -import androidx.compose.ui.semantics.isTraversalGroup -import androidx.compose.ui.semantics.semantics -import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.layout.onSizeChanged +import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.unit.dp -import androidx.compose.ui.zIndex import com.androidmakers.ui.common.LoadingLayout import com.androidmakers.ui.model.Lce import com.seiko.imageloader.rememberImagePainter @@ -70,42 +66,11 @@ fun SpeakerScreen( var active by rememberSaveable { mutableStateOf(false) } val content = (state as Lce.Content).content + var searchHeight by remember { mutableStateOf(56.dp) } + Box(Modifier.fillMaxSize()) { - Box(Modifier - .semantics { isTraversalGroup = true } - .background(MaterialTheme.colorScheme.background) - .padding(bottom = 8.dp) - .zIndex(1f) - .fillMaxWidth()) { - - SearchBar( - modifier = Modifier.align(Alignment.TopCenter), - query = text, - onQueryChange = { text = it }, - onSearch = { active = false }, - active = active, - colors = SearchBarDefaults.colors( - containerColor = MaterialTheme.colorScheme.surface, - dividerColor = MaterialTheme.colorScheme.primary, - ), - onActiveChange = { - active = it - }, - windowInsets = WindowInsets(0, 0, 0, 0), - placeholder = { Text(stringResource(MR.strings.speaker_search_placeholder)) }, - leadingIcon = { Icon(Icons.Rounded.Search, contentDescription = null) } - ) { - LazyColumn { - val speakers = content.speakers - items(speakers.filter { it.name?.contains(text, ignoreCase = true) == true }) { speaker -> - SpeakerItem( - speaker = speaker, - navigateToSpeakerDetails = navigateToSpeakerDetails, - ) - } - } - } - } + + val density = LocalDensity.current AnimatedVisibility( visible = !active, @@ -113,7 +78,7 @@ fun SpeakerScreen( exit = fadeOut(), ) { LazyColumn( - contentPadding = PaddingValues(start = 0.dp, top = 72.dp, end = 0.dp, bottom = 16.dp), + contentPadding = PaddingValues(top = searchHeight + 16.dp), verticalArrangement = Arrangement.spacedBy(8.dp) ) { items(content.speakers.filter { it.name?.contains(text, ignoreCase = true) == true }) { speaker -> @@ -124,6 +89,38 @@ fun SpeakerScreen( } } } + + + SearchBar( + windowInsets = WindowInsets(0.dp, 0.dp, 0.dp, 0.dp), + modifier = Modifier.align(Alignment.TopCenter) + .onSizeChanged { + searchHeight = with(density) { it.height.toDp() } + }, + query = text, + onQueryChange = { text = it }, + onSearch = { active = false }, + active = active, + colors = SearchBarDefaults.colors( + containerColor = MaterialTheme.colorScheme.surface, + dividerColor = MaterialTheme.colorScheme.primary, + ), + onActiveChange = { + active = it + }, + placeholder = { Text(stringResource(MR.strings.speaker_search_placeholder)) }, + leadingIcon = { Icon(Icons.Rounded.Search, contentDescription = null) } + ) { + LazyColumn { + val speakers = content.speakers + items(speakers.filter { it.name?.contains(text, ignoreCase = true) == true }) { speaker -> + SpeakerItem( + speaker = speaker, + navigateToSpeakerDetails = navigateToSpeakerDetails, + ) + } + } + } } } diff --git a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/theme/Typo.kt b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/theme/Typo.kt index 387f9f62..2f4f8bb6 100644 --- a/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/theme/Typo.kt +++ b/shared/ui/src/commonMain/kotlin/com/androidmakers/ui/theme/Typo.kt @@ -51,8 +51,8 @@ fun androidMakersTypography() = Typography( ), titleSmall = TextStyle( fontFamily = montserratFamily(), - fontWeight = FontWeight.Bold, - fontSize = 16.sp, + fontWeight = FontWeight.SemiBold, + fontSize = 14.sp, ), labelLarge = TextStyle( fontFamily = montserratFamily(), @@ -61,12 +61,11 @@ fun androidMakersTypography() = Typography( ), labelMedium = TextStyle( fontFamily = montserratFamily(), - fontWeight = FontWeight.SemiBold, fontSize = 12.sp, ), labelSmall = TextStyle( fontFamily = montserratFamily(), - fontSize = 12.sp, + fontSize = 11.sp, ), bodyLarge = TextStyle( fontFamily = montserratFamily(),