Add padding to reader when bars are pinned (#466)

jocmp · Oct 26, 2024 · 196690b · 196690b
1 parent 4a75ac0
commit 196690b
Show file tree

Hide file tree

Showing 3 changed files with 82 additions and 35 deletions.
diff --git a/app/src/main/java/com/capyreader/app/ui/articles/ArticlesModule.kt b/app/src/main/java/com/capyreader/app/ui/articles/ArticlesModule.kt
@@ -23,6 +23,7 @@ internal val articlesModule = module {
             context = get(),
             textSize = get<AppPreferences>().readerOptions.textSize,
             fontOption = get<AppPreferences>().readerOptions.fontFamily,
+            hideTopMargin = get<AppPreferences>().readerOptions.pinToolbars,
         )
     }
     viewModel {

diff --git a/app/src/main/java/com/capyreader/app/ui/articles/detail/ArticleView.kt b/app/src/main/java/com/capyreader/app/ui/articles/detail/ArticleView.kt
@@ -81,8 +81,60 @@ fun ArticleView(
 
     val toolbars = rememberToolbarPreferences(articleID = article.id)
 
+    ArticleViewScaffold(
+        topBar = {
+            ArticleTopBar(
+                article = article,
+                scrollBehavior = toolbars.scrollBehavior,
+                onToggleExtractContent = onToggleFullContent,
+                onToggleRead = onToggleRead,
+                onToggleStar = onToggleStar,
+                onClose = onBackPressed
+            )
+        },
+        reader = {
+            ArticlePullRefresh(
+                toolbars.show,
+                onToggleFullContent = onToggleFullContent,
+                onRequestNext = onRequestNext,
+                onRequestPrevious = onRequestPrevious,
+                articles = articles,
+            ) {
+                ArticleReader(
+                    article = article,
+                    webViewState = webViewState,
+                    scrollState = scrollState,
+                )
+            }
+        },
+        bottomBar = {
+            ArticleBottomBar(
+                onRequestNext = onRequestNext,
+                showNext = articles.hasNext()
+            )
+        },
+        toolbarPreferences = toolbars
+    )
+
+    BackHandler(enableBackHandler) {
+        onBackPressed()
+    }
+}
+
+@Composable
+private fun ArticleViewScaffold(
+    topBar: @Composable () -> Unit,
+    reader: @Composable () -> Unit,
+    bottomBar: @Composable () -> Unit,
+    toolbarPreferences: ToolbarPreferences,
+) {
     Scaffold(
-        modifier = Modifier.nestedScroll(toolbars.scrollBehavior.nestedScrollConnection),
+        modifier = Modifier.nestedScroll(toolbarPreferences.scrollBehavior.nestedScrollConnection),
+        topBar = {
+            if (toolbarPreferences.pinned) {
+                topBar()
+            }
+        }
     ) { innerPadding ->
         Box(
             Modifier
@@ -94,46 +146,30 @@ fun ArticleView(
                     .fillMaxSize()
             ) {
                 Column {
-                    ArticlePullRefresh(
-                        toolbars.show,
-                        onToggleFullContent = onToggleFullContent,
-                        onRequestNext = onRequestNext,
-                        onRequestPrevious = onRequestPrevious,
-                        articles = articles,
-                    ) {
-                        ArticleReader(
-                            article = article,
-                            webViewState = webViewState,
-                            scrollState = scrollState,
-                        )
+                    Column(Modifier.weight(0.1f)) {
+                        reader()
+                    }
+
+                    if (toolbarPreferences.pinned) {
+                        bottomBar()
                     }
                 }
 
-                BarVisibility(
-                    modifier = Modifier.align(Alignment.BottomCenter),
-                    visible = toolbars.show,
-                ) {
-                    ArticleBottomBar(
-                        onRequestNext = onRequestNext,
-                        showNext = articles.hasNext()
-                    )
+                if (!toolbarPreferences.pinned) {
+                    BarVisibility(
+                        modifier = Modifier.align(Alignment.BottomCenter),
+                        visible = toolbarPreferences.show,
+                    ) {
+                        bottomBar()
+                    }
                 }
             }
 
-            ArticleTopBar(
-                article = article,
-                scrollBehavior = toolbars.scrollBehavior,
-                onToggleExtractContent = onToggleFullContent,
-                onToggleRead = onToggleRead,
-                onToggleStar = onToggleStar,
-                onClose = onBackPressed
-            )
+            if (!toolbarPreferences.pinned) {
+                topBar()
+            }
         }
     }
-
-    BackHandler(enableBackHandler) {
-        onBackPressed()
-    }
 }
 
 @Composable
@@ -234,13 +270,14 @@ fun rememberToolbarPreferences(
 
     val showToolbars = scrollBehavior.state.collapsedFraction == 0f
 
-    return ToolbarPreferences(scrollBehavior, showToolbars)
+    return ToolbarPreferences(scrollBehavior, showToolbars, pinToolbars)
 }
 
 @Stable
 data class ToolbarPreferences(
     val scrollBehavior: TopAppBarScrollBehavior,
     val show: Boolean,
+    val pinned: Boolean,
 )
 
 @Composable

diff --git a/capy/src/main/java/com/jocmp/capy/articles/ArticleRenderer.kt b/capy/src/main/java/com/jocmp/capy/articles/ArticleRenderer.kt
@@ -11,6 +11,7 @@ class ArticleRenderer(
     private val context: Context,
     private val textSize: Preference<TextSize>,
     private val fontOption: Preference<FontOption>,
+    private val hideTopMargin: Preference<Boolean>,
 ) {
     private val template by lazy {
         context.resources.openRawResource(CapyRes.raw.template)
@@ -33,7 +34,7 @@ class ArticleRenderer(
             "text_size" to textSize.get().slug,
             "font_family" to fontFamily.slug,
             "font_preload" to fontPreload(fontFamily),
-            "top_margin" to "64px"
+            "top_margin" to topMargin()
         )
 
         val html = MacroProcessor(
@@ -52,6 +53,14 @@ class ArticleRenderer(
         return document.html()
     }
 
+    private fun topMargin(): String {
+        return if (hideTopMargin.get()) {
+            "0px"
+        } else {
+            "64px"
+        }
+    }
+
     private fun fontPreload(fontFamily: FontOption): String {
         return when (fontFamily) {
             FontOption.SYSTEM_DEFAULT -> ""