From a704a5e66a8ad799504d633bf78ac5c9e883591e Mon Sep 17 00:00:00 2001 From: Josiah Campbell <9521010+jocmp@users.noreply.github.com> Date: Mon, 1 Jul 2024 12:43:36 -0500 Subject: [PATCH] Fix nav icon bug for medium screens --- .../java/com/jocmp/capyreader/MainActivity.kt | 6 +- .../main/java/com/jocmp/capyreader/ui/App.kt | 69 +++++++++---------- .../capyreader/ui/CurrentWindowSizeClass.kt | 15 ++++ .../jocmp/capyreader/ui/LocalWindowWidth.kt | 12 ---- .../ui/accounts/AccountNavigation.kt | 4 +- .../capyreader/ui/accounts/AddAccountView.kt | 29 ++------ .../ui/articles/detail/ArticleTopBar.kt | 29 ++++---- .../capyreader/ui/settings/SettingsView.kt | 3 +- 8 files changed, 71 insertions(+), 96 deletions(-) create mode 100644 app/src/main/java/com/jocmp/capyreader/ui/CurrentWindowSizeClass.kt delete mode 100644 app/src/main/java/com/jocmp/capyreader/ui/LocalWindowWidth.kt diff --git a/app/src/main/java/com/jocmp/capyreader/MainActivity.kt b/app/src/main/java/com/jocmp/capyreader/MainActivity.kt index ccb24094..bdf69077 100644 --- a/app/src/main/java/com/jocmp/capyreader/MainActivity.kt +++ b/app/src/main/java/com/jocmp/capyreader/MainActivity.kt @@ -5,6 +5,8 @@ import android.os.StrictMode.ThreadPolicy import android.os.StrictMode.setThreadPolicy import androidx.activity.ComponentActivity import androidx.activity.compose.setContent +import androidx.compose.material3.adaptive.ExperimentalMaterial3AdaptiveApi +import androidx.compose.material3.adaptive.currentWindowAdaptiveInfo import androidx.compose.material3.windowsizeclass.ExperimentalMaterial3WindowSizeClassApi import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass import com.jocmp.capyreader.common.AppPreferences @@ -13,17 +15,13 @@ import com.jocmp.capyreader.ui.Route import org.koin.android.ext.android.get class MainActivity : ComponentActivity() { - @OptIn(ExperimentalMaterial3WindowSizeClassApi::class) override fun onCreate(savedInstanceState: Bundle?) { enableStrictModeOnDebug() super.onCreate(savedInstanceState) setContent { - val windowSizeClass = calculateWindowSizeClass(this) - App( startDestination = startDestination(), - windowSizeClass = windowSizeClass ) } } diff --git a/app/src/main/java/com/jocmp/capyreader/ui/App.kt b/app/src/main/java/com/jocmp/capyreader/ui/App.kt index 834cc5f9..86c6b079 100644 --- a/app/src/main/java/com/jocmp/capyreader/ui/App.kt +++ b/app/src/main/java/com/jocmp/capyreader/ui/App.kt @@ -3,62 +3,57 @@ package com.jocmp.capyreader.ui import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface -import androidx.compose.material3.windowsizeclass.WindowSizeClass import androidx.compose.runtime.Composable -import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.ui.Modifier import androidx.navigation.compose.NavHost import androidx.navigation.compose.rememberNavController -import com.jocmp.capyreader.ui.articles.articleGraph import com.jocmp.capyreader.ui.accounts.accountsGraph +import com.jocmp.capyreader.ui.articles.articleGraph import com.jocmp.capyreader.ui.theme.CapyTheme import com.jocmp.capyreader.unloadAccountModules @Composable fun App( startDestination: String, - windowSizeClass: WindowSizeClass ) { val navController = rememberNavController() CapyTheme { - CompositionLocalProvider(LocalWindowWidth provides windowSizeClass.widthSizeClass) { - Surface( - modifier = Modifier.fillMaxSize(), - color = MaterialTheme.colorScheme.background - ) { - val isCompactWindow = LocalWindowWidth.current.isCompact + Surface( + modifier = Modifier.fillMaxSize(), + color = MaterialTheme.colorScheme.background + ) { + val compactWidth = isCompact() - NavHost( - navController = navController, - startDestination = startDestination - ) { - accountsGraph( - isCompactWindow = isCompactWindow, - onNavigateToLogin = { - navController.navigate(Route.Login) - }, - onAddSuccess = { - navController.navigate(Route.Articles) { - popUpTo(Route.AddAccount.path) { - inclusive = true - } + NavHost( + navController = navController, + startDestination = startDestination + ) { + accountsGraph( + isCompactWidth = compactWidth, + onNavigateToLogin = { + navController.navigate(Route.Login) + }, + onAddSuccess = { + navController.navigate(Route.Articles) { + popUpTo(Route.AddAccount.path) { + inclusive = true } - }, - onLogout = { - navController.navigate(Route.Login) { - popUpTo(navController.graph.startDestinationId) { - inclusive = true - } + } + }, + onLogout = { + navController.navigate(Route.Login) { + popUpTo(navController.graph.startDestinationId) { + inclusive = true } - unloadAccountModules() - }, - onNavigateBackFromSettings = { - navController.navigateUp() } - ) - articleGraph(navController = navController) - } + unloadAccountModules() + }, + onNavigateBackFromSettings = { + navController.navigateUp() + } + ) + articleGraph(navController = navController) } } } diff --git a/app/src/main/java/com/jocmp/capyreader/ui/CurrentWindowSizeClass.kt b/app/src/main/java/com/jocmp/capyreader/ui/CurrentWindowSizeClass.kt new file mode 100644 index 00000000..554f3f07 --- /dev/null +++ b/app/src/main/java/com/jocmp/capyreader/ui/CurrentWindowSizeClass.kt @@ -0,0 +1,15 @@ +package com.jocmp.capyreader.ui + +import androidx.compose.material3.adaptive.ExperimentalMaterial3AdaptiveApi +import androidx.compose.material3.adaptive.currentWindowAdaptiveInfo +import androidx.compose.runtime.Composable +import androidx.window.core.layout.WindowWidthSizeClass.Companion.EXPANDED + +@Composable +@OptIn(ExperimentalMaterial3AdaptiveApi::class) +fun currentWindowSizeClass() = currentWindowAdaptiveInfo().windowSizeClass + +@Composable +fun isCompact(): Boolean { + return currentWindowSizeClass().windowWidthSizeClass != EXPANDED +} diff --git a/app/src/main/java/com/jocmp/capyreader/ui/LocalWindowWidth.kt b/app/src/main/java/com/jocmp/capyreader/ui/LocalWindowWidth.kt deleted file mode 100644 index 83d48a0e..00000000 --- a/app/src/main/java/com/jocmp/capyreader/ui/LocalWindowWidth.kt +++ /dev/null @@ -1,12 +0,0 @@ -package com.jocmp.capyreader.ui - -import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass -import androidx.compose.runtime.compositionLocalOf - - -val LocalWindowWidth = compositionLocalOf { - WindowWidthSizeClass.Compact -} - -val WindowWidthSizeClass.isCompact - get() = this == WindowWidthSizeClass.Compact diff --git a/app/src/main/java/com/jocmp/capyreader/ui/accounts/AccountNavigation.kt b/app/src/main/java/com/jocmp/capyreader/ui/accounts/AccountNavigation.kt index f29b85e8..a5aae0f5 100644 --- a/app/src/main/java/com/jocmp/capyreader/ui/accounts/AccountNavigation.kt +++ b/app/src/main/java/com/jocmp/capyreader/ui/accounts/AccountNavigation.kt @@ -15,7 +15,7 @@ fun NavGraphBuilder.accountsGraph( onNavigateToLogin: () -> Unit, onLogout: () -> Unit, onNavigateBackFromSettings: () -> Unit, - isCompactWindow: Boolean, + isCompactWidth: Boolean, ) { composable(Route.AddAccount) { AddAccountScreen( @@ -28,7 +28,7 @@ fun NavGraphBuilder.accountsGraph( onSuccess = onAddSuccess, ) } - dynamicLayout(isCompactWindow) { + dynamicLayout(isCompactWidth) { SettingsScreen( onLogout = onLogout, onNavigateBack = onNavigateBackFromSettings diff --git a/app/src/main/java/com/jocmp/capyreader/ui/accounts/AddAccountView.kt b/app/src/main/java/com/jocmp/capyreader/ui/accounts/AddAccountView.kt index 0097d835..7e983ce8 100644 --- a/app/src/main/java/com/jocmp/capyreader/ui/accounts/AddAccountView.kt +++ b/app/src/main/java/com/jocmp/capyreader/ui/accounts/AddAccountView.kt @@ -10,30 +10,21 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.padding import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.verticalScroll -import androidx.compose.material3.ExperimentalMaterial3Api -import androidx.compose.material3.LargeTopAppBar import androidx.compose.material3.MaterialTheme.typography import androidx.compose.material3.Scaffold import androidx.compose.material3.Text -import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass -import androidx.compose.material3.windowsizeclass.calculateWindowSizeClass import androidx.compose.runtime.Composable -import androidx.compose.runtime.CompositionLocalProvider -import androidx.compose.runtime.Stable import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier -import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.res.stringResource import androidx.compose.ui.tooling.preview.Preview import androidx.compose.ui.unit.dp import com.jocmp.capy.accounts.Source import com.jocmp.capyreader.R -import com.jocmp.capyreader.ui.LocalWindowWidth import com.jocmp.capyreader.ui.components.widthMaxSingleColumn import com.jocmp.capyreader.ui.isCompact import com.jocmp.capyreader.ui.theme.CapyTheme -@OptIn(ExperimentalMaterial3Api::class) @Composable fun AddAccountView( onSelectLocal: () -> Unit, @@ -71,9 +62,7 @@ fun AddAccountView( @Composable private fun contentAlignment(): Alignment { - val width = LocalWindowWidth.current - - return if (width.isCompact) { + return if (isCompact()) { Alignment.TopCenter } else { Alignment.Center @@ -82,9 +71,7 @@ private fun contentAlignment(): Alignment { @Composable private fun titlePadding(): PaddingValues { - val width = LocalWindowWidth.current - - return if (width.isCompact) { + return if (isCompact()) { PaddingValues(top = 56.dp, start = 16.dp, end = 16.dp) } else { PaddingValues(start = 16.dp, end = 16.dp) @@ -105,12 +92,10 @@ private fun AddAccountViewPreview() { @Preview(device = "id:pixel_fold") @Composable private fun AddAccountViewPreview_Tablet() { - CompositionLocalProvider(LocalWindowWidth provides WindowWidthSizeClass.Medium) { - CapyTheme { - AddAccountView( - onSelectLocal = {}, - onSelectFeedbin = {} - ) - } + CapyTheme { + AddAccountView( + onSelectLocal = {}, + onSelectFeedbin = {} + ) } } diff --git a/app/src/main/java/com/jocmp/capyreader/ui/articles/detail/ArticleTopBar.kt b/app/src/main/java/com/jocmp/capyreader/ui/articles/detail/ArticleTopBar.kt index c2d3cbc6..a60ea1ff 100644 --- a/app/src/main/java/com/jocmp/capyreader/ui/articles/detail/ArticleTopBar.kt +++ b/app/src/main/java/com/jocmp/capyreader/ui/articles/detail/ArticleTopBar.kt @@ -7,9 +7,7 @@ import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.TopAppBar -import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass import androidx.compose.runtime.Composable -import androidx.compose.runtime.CompositionLocalProvider import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource @@ -18,8 +16,8 @@ import androidx.compose.ui.tooling.preview.PreviewParameter import com.jocmp.capy.Article import com.jocmp.capyreader.R import com.jocmp.capyreader.common.shareArticle -import com.jocmp.capyreader.ui.LocalWindowWidth import com.jocmp.capyreader.ui.fixtures.ArticleSample +import com.jocmp.capyreader.ui.isCompact import java.net.URL @OptIn(ExperimentalMaterial3Api::class) @@ -66,6 +64,7 @@ fun ArticleTopBar( contentDescription = stringResource(R.string.article_view_star) ) } + IconButton(onClick = { context.shareArticle(article = article) }) { Icon( painterResource(id = R.drawable.ic_share), @@ -103,7 +102,7 @@ fun extractIcon(extractedContent: ExtractedContent) = when { @Composable fun ArticleNavigationIcon(onClick: () -> Unit) { - val showIcon = LocalWindowWidth.current == WindowWidthSizeClass.Compact + val showIcon = isCompact() if (!showIcon) { return @@ -134,21 +133,17 @@ private fun ArticleTopBarPreview(@PreviewParameter(ArticleSample::class) article ) } -@Preview +@Preview(device = "id:pixel_fold") @Composable private fun ArticleTopBarPreview_Tablet(@PreviewParameter(ArticleSample::class) article: Article) { - val width = WindowWidthSizeClass.Medium - - CompositionLocalProvider(LocalWindowWidth provides width) { - ArticleTopBar( - article = article, - extractedContent = ExtractedContent(), - onToggleExtractContent = {}, - onToggleRead = {}, - onToggleStar = {}, - onClose = {} - ) - } + ArticleTopBar( + article = article, + extractedContent = ExtractedContent(), + onToggleExtractContent = {}, + onToggleRead = {}, + onToggleStar = {}, + onClose = {} + ) } @Preview diff --git a/app/src/main/java/com/jocmp/capyreader/ui/settings/SettingsView.kt b/app/src/main/java/com/jocmp/capyreader/ui/settings/SettingsView.kt index ed5e405f..62f9ed4f 100644 --- a/app/src/main/java/com/jocmp/capyreader/ui/settings/SettingsView.kt +++ b/app/src/main/java/com/jocmp/capyreader/ui/settings/SettingsView.kt @@ -36,7 +36,6 @@ import androidx.compose.ui.unit.sp import com.jocmp.capyreader.R import com.jocmp.capyreader.refresher.RefreshInterval import com.jocmp.capyreader.setupCommonModules -import com.jocmp.capyreader.ui.LocalWindowWidth import com.jocmp.capyreader.ui.components.CrashReportingCheckbox import com.jocmp.capyreader.ui.isCompact import org.koin.android.ext.koin.androidContext @@ -159,7 +158,7 @@ fun SettingsView( @Composable private fun backButton(): ImageVector { - val showBackArrow = LocalWindowWidth.current.isCompact + val showBackArrow = isCompact() return if (showBackArrow) { Icons.AutoMirrored.Filled.ArrowBack