Correctly handle window insets in reader

Now it's actual edge-to-edge.

app/src/main/kotlin/com/hippo/ehviewer/ui/reader/GalleryPager.kt

@@ -3,7 +3,10 @@ package com.hippo.ehviewer.ui.reader
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.systemBars
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.LazyListState
 import androidx.compose.foundation.lazy.items
@@ -46,6 +49,7 @@ fun GalleryPager(
             HorizontalPager(
                 state = pagerState,
                 modifier = modifier,
+                contentPadding = WindowInsets.systemBars.asPaddingValues(),
                 reverseLayout = type == RIGHT_TO_LEFT,
                 key = { it },
             ) { index ->
@@ -82,6 +86,7 @@ fun GalleryPager(
             VerticalPager(
                 state = pagerState,
                 modifier = modifier,
+                contentPadding = WindowInsets.systemBars.asPaddingValues(),
                 key = { it },
             ) { index ->
                 val page = items[index]
@@ -132,6 +137,7 @@ fun GalleryPager(
                     },
                 ),
                 state = lazyListState,
+                contentPadding = WindowInsets.systemBars.asPaddingValues(),
                 verticalArrangement = Arrangement.spacedBy(if (type != WEBTOON) 15.dp else 0.dp),
             ) {
                 items(items, key = { it.index }) { page ->

app/src/main/kotlin/com/hippo/ehviewer/ui/reader/ReaderScreen.kt

@@ -147,7 +147,7 @@ fun ReaderScreen(info: BaseGalleryInfo, page: Int = -1, navigator: DestinationsN
                 colorBlendMode = colorOverlayMode,
             )
             val showPageNumber by Settings.showPageNumber.collectAsState()
-            if (showPageNumber) {
+            if (showPageNumber && !appbarVisible) {
                 CompositionLocalProvider(LocalTextStyle provides MaterialTheme.typography.bodySmall) {
                     PageIndicatorText(
                         currentPage = syncState.sliderValue,

app/src/main/kotlin/eu/kanade/tachiyomi/ui/reader/BottomReaderBar.kt

@@ -6,6 +6,7 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
 import androidx.compose.material.icons.Icons
@@ -95,7 +96,7 @@ fun BottomReaderBar(onClickSettings: () -> Unit) {
     }
 
     Row(
-        modifier = Modifier.fillMaxWidth().background(backgroundColor).padding(8.dp),
+        modifier = Modifier.fillMaxWidth().background(backgroundColor).padding(8.dp).navigationBarsPadding(),
         horizontalArrangement = Arrangement.SpaceEvenly,
         verticalAlignment = Alignment.CenterVertically,
     ) {

app/src/main/kotlin/eu/kanade/tachiyomi/ui/reader/ReaderActivity.kt

@@ -17,7 +17,6 @@
 package eu.kanade.tachiyomi.ui.reader
 
 import android.Manifest
-import android.annotation.SuppressLint
 import android.app.assist.AssistContent
 import android.content.ClipData
 import android.content.ContentValues
@@ -42,10 +41,10 @@ import androidx.annotation.ChecksSdkIntAtLeast
 import androidx.annotation.RequiresApi
 import androidx.annotation.StringRes
 import androidx.compose.animation.animateColorAsState
-import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.WindowInsetsSides
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.navigationBarsPadding
 import androidx.compose.foundation.layout.only
 import androidx.compose.foundation.layout.safeDrawing
 import androidx.compose.foundation.layout.windowInsetsPadding
@@ -53,7 +52,6 @@ import androidx.compose.material3.BottomSheetDefaults
 import androidx.compose.material3.LocalTextStyle
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.ModalBottomSheet
-import androidx.compose.material3.surfaceColorAtElevation
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -64,10 +62,7 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.BlendMode
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.toArgb
-import androidx.compose.ui.unit.dp
 import androidx.core.content.FileProvider
-import androidx.core.view.WindowCompat
 import androidx.core.view.WindowInsetsCompat
 import androidx.core.view.WindowInsetsControllerCompat
 import androidx.core.view.isVisible
@@ -265,14 +260,6 @@ class ReaderActivity : EhActivity() {
         }
         binding = ReaderActivityBinding.inflate(layoutInflater)
         binding.dialogStub.setMD3Content {
-            val surfaceElevation = MaterialTheme.colorScheme.surfaceColorAtElevation(3.dp)
-            val alpha = if (isSystemInDarkTheme()) 230 else 242 // 90% dark 95% light
-            LaunchedEffect(surfaceElevation, alpha) {
-                val toolbarColor = surfaceElevation.copy(alpha = alpha / 255f).toArgb()
-                window.statusBarColor = toolbarColor
-                window.navigationBarColor = toolbarColor
-            }
-
             val brightness by Settings.customBrightness.collectAsState()
             val brightnessValue by Settings.customBrightnessValue.collectAsState()
             val colorOverlayEnabled by Settings.colorFilter.collectAsState()
@@ -376,7 +363,7 @@ class ReaderActivity : EhActivity() {
         viewer?.destroy()
         viewer = ReadingModeType.toViewer(ReaderPreferences.defaultReadingMode().get(), this)
         isRtl = viewer is R2LPagerViewer
-        updateViewerInset(ReaderPreferences.fullscreen().get())
+        updateViewerInsets(ReaderPreferences.fullscreen().get())
         binding.viewerContainer.removeAllViews()
         setOrientation(ReaderPreferences.defaultOrientationType().get())
         binding.viewerContainer.addView(viewer?.getView())
@@ -551,10 +538,9 @@ class ReaderActivity : EhActivity() {
     }
 
     /**
-     * Sets the visibility of the menu according to [visible] and with an optional parameter to
-     * [animate] the views.
+     * Sets the visibility of the menu according to [visible].
      */
-    fun setMenuVisibility(visible: Boolean) {
+    private fun setMenuVisibility(visible: Boolean) {
         menuVisible = visible
         if (visible) {
             windowInsetsController.show(WindowInsetsCompat.Type.systemBars())
@@ -582,14 +568,7 @@ class ReaderActivity : EhActivity() {
     /**
      * Initializes the reader menu. It sets up click listeners and the initial visibility.
      */
-    @SuppressLint("PrivateResource")
     private fun initializeMenu() {
-        binding.dialogStub.applyInsetter {
-            type(navigationBars = true) {
-                margin(vertical = true, horizontal = true)
-            }
-        }
-
         binding.pageNumber.setMD3Content {
             CompositionLocalProvider(
                 LocalTextStyle provides MaterialTheme.typography.bodySmall,
@@ -597,6 +576,7 @@ class ReaderActivity : EhActivity() {
                 PageIndicatorText(
                     currentPage = currentPage,
                     totalPages = totalPage,
+                    modifier = Modifier.navigationBarsPadding(),
                 )
             }
         }
@@ -689,11 +669,17 @@ class ReaderActivity : EhActivity() {
     }
 
     /**
-     * Updates viewer inset depending on fullscreen reader preferences.
+     * Updates viewer insets depending on fullscreen reader preferences.
      */
-    fun updateViewerInset(fullscreen: Boolean) {
-        viewer?.getView()?.applyInsetter {
-            if (!fullscreen) {
+    fun updateViewerInsets(fullscreen: Boolean) {
+        viewer?.getViewForInsets()?.applyInsetter {
+            if (fullscreen) {
+                // https://github.com/chrisbanes/insetter/issues/120#issuecomment-1311808030
+                // Hack to remove insets
+                type(1 shl 31) {
+                    padding()
+                }
+            } else {
                 type(navigationBars = true, statusBars = true) {
                     padding()
                 }
@@ -798,8 +784,7 @@ class ReaderActivity : EhActivity() {
 
             ReaderPreferences.fullscreen().changes()
                 .onEach {
-                    WindowCompat.setDecorFitsSystemWindows(window, !it)
-                    updateViewerInset(it)
+                    updateViewerInsets(it)
                 }
                 .launchIn(lifecycleScope)
         }

app/src/main/kotlin/eu/kanade/tachiyomi/ui/reader/ReaderAppBars.kt

@@ -7,7 +7,12 @@ import androidx.compose.animation.slideOutVertically
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.WindowInsetsSides
 import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.only
+import androidx.compose.foundation.layout.systemBars
+import androidx.compose.foundation.layout.windowInsetsPadding
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.IntOffset
@@ -25,7 +30,10 @@ fun ReaderAppBars(
     onSliderValueChange: (Int) -> Unit,
     onClickSettings: () -> Unit,
     modifier: Modifier = Modifier,
-) = Column(modifier = modifier.fillMaxHeight(), verticalArrangement = Arrangement.SpaceBetween) {
+) = Column(
+    modifier = modifier.fillMaxHeight().windowInsetsPadding(WindowInsets.systemBars.only(WindowInsetsSides.Horizontal)),
+    verticalArrangement = Arrangement.SpaceBetween,
+) {
     Spacer(modifier = Modifier.weight(1f))
 
     AnimatedVisibility(

app/src/main/kotlin/eu/kanade/tachiyomi/ui/reader/viewer/BaseViewer.kt

@@ -10,6 +10,7 @@ import eu.kanade.tachiyomi.ui.reader.model.ReaderPage
  * Interface for implementing a viewer.
  */
 interface BaseViewer {
+    fun getViewForInsets() = getView()
 
     /**
      * Returns the view this viewer uses.

app/src/main/kotlin/eu/kanade/tachiyomi/ui/reader/viewer/pager/PagerViewer.kt

@@ -75,6 +75,7 @@ abstract class PagerViewer(val activity: ReaderActivity) : BaseViewer {
     init {
         pager.isVisible = false // Don't layout the pager yet
         pager.layoutParams = LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT)
+        pager.clipToPadding = false
         pager.isFocusable = false
         pager.offscreenPageLimit = 1
         pager.id = R.id.reader_pager

app/src/main/kotlin/eu/kanade/tachiyomi/ui/reader/viewer/webtoon/WebtoonViewer.kt

@@ -69,6 +69,7 @@ class WebtoonViewer(val activity: ReaderActivity, val isContinuous: Boolean = tr
     init {
         recycler.isVisible = false // Don't let the recycler layout yet
         recycler.layoutParams = ViewGroup.LayoutParams(MATCH_PARENT, MATCH_PARENT)
+        recycler.clipToPadding = false
         recycler.isFocusable = false
         recycler.itemAnimator = null
         recycler.layoutManager = layoutManager
@@ -126,6 +127,10 @@ class WebtoonViewer(val activity: ReaderActivity, val isContinuous: Boolean = tr
         frame.addView(recycler)
     }
 
+    override fun getViewForInsets(): View {
+        return recycler
+    }
+
     /**
      * Returns the view this viewer uses.
      */