From 2625d5ec035ec1776945cea94e8c8a13f4e0b6a8 Mon Sep 17 00:00:00 2001 From: Sasikanth Miriyampalli Date: Tue, 25 Feb 2025 08:10:59 +0530 Subject: [PATCH 1/2] Change dropdown background color --- .../dev/sasikanth/rss/reader/components/DropdownMenu.kt | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/components/DropdownMenu.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/components/DropdownMenu.kt index 6337a42f1..0bb34a250 100644 --- a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/components/DropdownMenu.kt +++ b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/components/DropdownMenu.kt @@ -43,7 +43,8 @@ internal fun DropdownMenu( content: @Composable ColumnScope.() -> Unit ) { MaterialTheme( - colorScheme = MaterialTheme.colorScheme.copy(surface = AppTheme.colorScheme.surfaceContainer), + colorScheme = + MaterialTheme.colorScheme.copy(surface = AppTheme.colorScheme.surfaceContainerLowest), shapes = MaterialTheme.shapes.copy(extraSmall = MaterialTheme.shapes.large) ) { androidx.compose.material3.DropdownMenu( @@ -53,7 +54,7 @@ internal fun DropdownMenu( modifier = modifier .background( - color = AppTheme.colorScheme.surfaceContainer, + color = AppTheme.colorScheme.surfaceContainerLowest, shape = MaterialTheme.shapes.large ) .border( From 991cd7c5e0ea10ea4ba53c4bd1928419058b6ac5 Mon Sep 17 00:00:00 2001 From: Sasikanth Miriyampalli Date: Tue, 25 Feb 2025 08:24:53 +0530 Subject: [PATCH 2/2] Adjust dropdown menu positioning based on the anchor button height --- .../rss/reader/feeds/ui/expanded/SourcesAll.kt | 17 ++++++++++++++++- .../rss/reader/home/ui/PostMetadata.kt | 11 ++++++++++- .../rss/reader/search/ui/SearchScreen.kt | 17 +++++++++++++++-- .../rss/reader/settings/ui/SettingsScreen.kt | 16 +++++++++++++++- 4 files changed, 56 insertions(+), 5 deletions(-) diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/feeds/ui/expanded/SourcesAll.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/feeds/ui/expanded/SourcesAll.kt index a1da826c6..8cf825e7f 100644 --- a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/feeds/ui/expanded/SourcesAll.kt +++ b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/feeds/ui/expanded/SourcesAll.kt @@ -40,6 +40,10 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.layout.onGloballyPositioned +import androidx.compose.ui.platform.LocalDensity +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.dp import app.cash.paging.compose.LazyPagingItems import app.cash.paging.compose.itemKey @@ -216,7 +220,17 @@ internal fun AllFeedsHeader( Spacer(Modifier.requiredWidth(12.dp)) Box { - TextButton(onClick = { showSortDropdown = true }, shape = MaterialTheme.shapes.large) { + val density = LocalDensity.current + var buttonHeight by remember { mutableStateOf(Dp.Unspecified) } + + TextButton( + modifier = + Modifier.onGloballyPositioned { coordinates -> + buttonHeight = with(density) { coordinates.size.height.toDp() } + }, + onClick = { showSortDropdown = true }, + shape = MaterialTheme.shapes.large + ) { val orderText = when (feedsSortOrder) { FeedsOrderBy.Latest -> LocalStrings.current.feedsSortLatest @@ -247,6 +261,7 @@ internal fun AllFeedsHeader( DropdownMenu( modifier = Modifier.requiredWidth(132.dp), expanded = showSortDropdown, + offset = DpOffset(0.dp, buttonHeight.unaryMinus()), onDismissRequest = { showSortDropdown = false } ) { FeedsOrderBy.entries diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/home/ui/PostMetadata.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/home/ui/PostMetadata.kt index 4f565af53..d26a10f10 100644 --- a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/home/ui/PostMetadata.kt +++ b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/home/ui/PostMetadata.kt @@ -48,10 +48,13 @@ import androidx.compose.ui.Modifier import androidx.compose.ui.draw.clip import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.vector.ImageVector +import androidx.compose.ui.layout.onGloballyPositioned +import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.text.capitalize import androidx.compose.ui.text.intl.Locale import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextOverflow +import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.dp import dev.sasikanth.rss.reader.components.DropdownMenu @@ -213,8 +216,14 @@ private fun PostOptionsButtonRow( var showDropdown by remember { mutableStateOf(false) } Box { val coroutineScope = rememberCoroutineScope() + val density = LocalDensity.current + var buttonHeight by remember { mutableStateOf(Dp.Unspecified) } PostOptionIconButton( + modifier = + Modifier.onGloballyPositioned { coordinates -> + buttonHeight = with(density) { coordinates.size.height.toDp() } + }, icon = Icons.Filled.MoreVert, contentDescription = LocalStrings.current.moreMenuOptions, onClick = { showDropdown = true } @@ -224,7 +233,7 @@ private fun PostOptionsButtonRow( modifier = Modifier.width(IntrinsicSize.Min), expanded = showDropdown, onDismissRequest = { showDropdown = false }, - offset = DpOffset(x = 0.dp, y = (-48).dp), + offset = DpOffset(x = 0.dp, y = buttonHeight.unaryMinus()), ) { if (config.showToggleReadUnreadOption) { DropdownMenuItem( diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/search/ui/SearchScreen.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/search/ui/SearchScreen.kt index 186c9b439..379474fb4 100644 --- a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/search/ui/SearchScreen.kt +++ b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/search/ui/SearchScreen.kt @@ -60,10 +60,14 @@ import androidx.compose.ui.focus.FocusRequester import androidx.compose.ui.focus.focusRequester import androidx.compose.ui.focus.onFocusChanged import androidx.compose.ui.graphics.Color +import androidx.compose.ui.layout.onGloballyPositioned +import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.platform.LocalFocusManager import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.text.TextRange import androidx.compose.ui.text.input.TextFieldValue +import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.dp import app.cash.paging.compose.collectAsLazyPagingItems import dev.sasikanth.rss.reader.components.CompactFloatingActionButton @@ -289,10 +293,16 @@ private fun SearchSortButton( onSortOrderChanged: (SearchSortOrder) -> Unit ) { Box { + val density = LocalDensity.current + var buttonHeight by remember { mutableStateOf(Dp.Unspecified) } var isDropdownExpanded by remember { mutableStateOf(false) } TextButton( - modifier = Modifier.requiredHeight(48.dp), + modifier = + Modifier.onGloballyPositioned { coordinates -> + buttonHeight = with(density) { coordinates.size.height.toDp() } + } + .requiredHeight(48.dp), onClick = { isDropdownExpanded = true }, shape = RoundedCornerShape(12.dp), ) { @@ -318,6 +328,7 @@ private fun SearchSortButton( if (isDropdownExpanded) { SortDropdownMenu( isDropdownExpanded = isDropdownExpanded, + offset = DpOffset(0.dp, buttonHeight.unaryMinus()), onDismiss = { isDropdownExpanded = false }, onSortOrderChanged = { onSortOrderChanged(it) @@ -332,10 +343,12 @@ private fun SearchSortButton( private fun SortDropdownMenu( isDropdownExpanded: Boolean, onDismiss: () -> Unit, - onSortOrderChanged: (SearchSortOrder) -> Unit + onSortOrderChanged: (SearchSortOrder) -> Unit, + offset: DpOffset = DpOffset.Zero, ) { DropdownMenu( expanded = isDropdownExpanded, + offset = offset, onDismissRequest = onDismiss, ) { DropdownMenuItem(onClick = { onSortOrderChanged(Newest) }) { diff --git a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/ui/SettingsScreen.kt b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/ui/SettingsScreen.kt index 254f57e32..39ca1d3ce 100644 --- a/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/ui/SettingsScreen.kt +++ b/shared/src/commonMain/kotlin/dev/sasikanth/rss/reader/settings/ui/SettingsScreen.kt @@ -59,8 +59,11 @@ import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.drawWithCache import androidx.compose.ui.graphics.Color import androidx.compose.ui.layout.ContentScale +import androidx.compose.ui.layout.onGloballyPositioned +import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.platform.LocalLayoutDirection import androidx.compose.ui.unit.Dp +import androidx.compose.ui.unit.DpOffset import androidx.compose.ui.unit.dp import dev.sasikanth.rss.reader.app.AppInfo import dev.sasikanth.rss.reader.components.DropdownMenu @@ -346,7 +349,17 @@ private fun PostsDeletionPeriodSettingItem( ) Box { - TextButton(onClick = { showDropdown = true }, shape = MaterialTheme.shapes.medium) { + val density = LocalDensity.current + var buttonHeight by remember { mutableStateOf(Dp.Unspecified) } + + TextButton( + modifier = + Modifier.onGloballyPositioned { coordinates -> + buttonHeight = with(density) { coordinates.size.height.toDp() } + }, + onClick = { showDropdown = true }, + shape = MaterialTheme.shapes.medium + ) { val period = when (postsDeletionPeriod) { ONE_WEEK -> LocalStrings.current.settingsPostsDeletionPeriodOneWeek @@ -373,6 +386,7 @@ private fun PostsDeletionPeriodSettingItem( } DropdownMenu( + offset = DpOffset(0.dp, buttonHeight.unaryMinus()), expanded = showDropdown, onDismissRequest = { showDropdown = false }, ) {