Tablet UI edge-to-edge tweaks (#8159)

* LibraryScreen: Tweak content padding application to draw under nav bar

* BrowseScreen: Tweak content padding application to draw under nav bar

Side note the tab content doesn't actually use its
scaffold (bottom) contentPadding so it's definitely will
be a headache in the future.

* Don't hardcode bottom nav padding

app/src/main/java/eu/kanade/presentation/browse/ExtensionsScreen.kt

@@ -47,7 +47,6 @@ import eu.kanade.presentation.components.LoadingScreen
 import eu.kanade.presentation.components.SwipeRefreshIndicator
 import eu.kanade.presentation.manga.components.DotSeparatorNoSpaceText
 import eu.kanade.presentation.theme.header
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.horizontalPadding
 import eu.kanade.presentation.util.plus
 import eu.kanade.presentation.util.secondaryItemAlpha
@@ -58,6 +57,7 @@ import eu.kanade.tachiyomi.extension.model.InstallStep
 import eu.kanade.tachiyomi.ui.browse.extension.ExtensionUiModel
 import eu.kanade.tachiyomi.ui.browse.extension.ExtensionsPresenter
 import eu.kanade.tachiyomi.util.system.LocaleHelper
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 
 @Composable
 fun ExtensionScreen(
@@ -112,7 +112,7 @@ private fun ExtensionContent(
     var trustState by remember { mutableStateOf<Extension.Untrusted?>(null) }
 
     FastScrollLazyColumn(
-        contentPadding = bottomNavPaddingValues + WindowInsets.navigationBars.asPaddingValues() + topPaddingValues,
+        contentPadding = bottomNavPadding + WindowInsets.navigationBars.asPaddingValues() + topPaddingValues,
     ) {
         items(
             items = state.items,

app/src/main/java/eu/kanade/presentation/browse/MigrateSourceScreen.kt

@@ -35,13 +35,13 @@ import eu.kanade.presentation.components.EmptyScreen
 import eu.kanade.presentation.components.LoadingScreen
 import eu.kanade.presentation.components.ScrollbarLazyColumn
 import eu.kanade.presentation.theme.header
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.horizontalPadding
 import eu.kanade.presentation.util.plus
 import eu.kanade.presentation.util.topPaddingValues
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.ui.browse.migration.sources.MigrationSourcesPresenter
 import eu.kanade.tachiyomi.util.system.copyToClipboard
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 
 @Composable
 fun MigrateSourceScreen(
@@ -79,7 +79,7 @@ private fun MigrateSourceList(
     onToggleSortingDirection: () -> Unit,
 ) {
     ScrollbarLazyColumn(
-        contentPadding = bottomNavPaddingValues + WindowInsets.navigationBars.asPaddingValues() + topPaddingValues,
+        contentPadding = bottomNavPadding + WindowInsets.navigationBars.asPaddingValues() + topPaddingValues,
     ) {
         stickyHeader(key = "header") {
             Row(

app/src/main/java/eu/kanade/presentation/browse/SourcesScreen.kt

@@ -32,7 +32,6 @@ import eu.kanade.presentation.components.EmptyScreen
 import eu.kanade.presentation.components.LoadingScreen
 import eu.kanade.presentation.components.ScrollbarLazyColumn
 import eu.kanade.presentation.theme.header
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.horizontalPadding
 import eu.kanade.presentation.util.plus
 import eu.kanade.presentation.util.topPaddingValues
@@ -41,6 +40,7 @@ import eu.kanade.tachiyomi.source.LocalSource
 import eu.kanade.tachiyomi.ui.browse.source.SourcesPresenter
 import eu.kanade.tachiyomi.util.system.LocaleHelper
 import eu.kanade.tachiyomi.util.system.toast
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 import kotlinx.coroutines.flow.collectLatest
 
 @Composable
@@ -82,7 +82,7 @@ private fun SourceList(
     onClickPin: (Source) -> Unit,
 ) {
     ScrollbarLazyColumn(
-        contentPadding = bottomNavPaddingValues + WindowInsets.navigationBars.asPaddingValues() + topPaddingValues,
+        contentPadding = bottomNavPadding + WindowInsets.navigationBars.asPaddingValues() + topPaddingValues,
     ) {
         items(
             items = state.items,

app/src/main/java/eu/kanade/presentation/components/TabbedScreen.kt

@@ -2,6 +2,8 @@ package eu.kanade.presentation.components
 
 import androidx.annotation.StringRes
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.calculateEndPadding
+import androidx.compose.foundation.layout.calculateStartPadding
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material3.Tab
@@ -11,6 +13,7 @@ import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.res.stringResource
 import com.google.accompanist.pager.HorizontalPager
 import com.google.accompanist.pager.rememberPagerState
@@ -61,8 +64,14 @@ fun TabbedScreen(
                 )
             }
         },
-    ) { paddingValues ->
-        Column(modifier = Modifier.padding(paddingValues)) {
+    ) { contentPadding ->
+        Column(
+            modifier = Modifier.padding(
+                top = contentPadding.calculateTopPadding(),
+                start = contentPadding.calculateStartPadding(LocalLayoutDirection.current),
+                end = contentPadding.calculateEndPadding(LocalLayoutDirection.current),
+            ),
+        ) {
             TabRow(
                 selectedTabIndex = state.currentPage,
                 indicator = { TabIndicator(it[state.currentPage]) },

app/src/main/java/eu/kanade/presentation/history/components/HistoryContent.kt

@@ -10,9 +10,9 @@ import eu.kanade.domain.ui.UiPreferences
 import eu.kanade.presentation.components.RelativeDateHeader
 import eu.kanade.presentation.components.ScrollbarLazyColumn
 import eu.kanade.presentation.history.HistoryUiModel
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.plus
 import eu.kanade.presentation.util.topPaddingValues
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 import uy.kohesive.injekt.Injekt
 import uy.kohesive.injekt.api.get
 import java.text.DateFormat
@@ -30,7 +30,7 @@ fun HistoryContent(
     val dateFormat: DateFormat = remember { UiPreferences.dateFormat(preferences.dateFormat().get()) }
 
     ScrollbarLazyColumn(
-        contentPadding = contentPadding + bottomNavPaddingValues + topPaddingValues,
+        contentPadding = contentPadding + bottomNavPadding + topPaddingValues,
     ) {
         items(
             items = history,

app/src/main/java/eu/kanade/presentation/library/components/LazyLibraryGrid.kt

@@ -2,35 +2,32 @@ package eu.kanade.presentation.library.components
 
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.PaddingValues
-import androidx.compose.foundation.layout.calculateEndPadding
 import androidx.compose.foundation.lazy.grid.GridCells
 import androidx.compose.foundation.lazy.grid.GridItemSpan
 import androidx.compose.foundation.lazy.grid.LazyGridScope
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.zIndex
 import eu.kanade.presentation.components.FastScrollLazyVerticalGrid
 import eu.kanade.presentation.components.TextButton
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.plus
 import eu.kanade.tachiyomi.R
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 
 @Composable
 fun LazyLibraryGrid(
     modifier: Modifier = Modifier,
     columns: Int,
+    contentPadding: PaddingValues,
     content: LazyGridScope.() -> Unit,
 ) {
     FastScrollLazyVerticalGrid(
         columns = if (columns == 0) GridCells.Adaptive(128.dp) else GridCells.Fixed(columns),
         modifier = modifier,
-        contentPadding = bottomNavPaddingValues + PaddingValues(end = 12.dp, start = 12.dp, bottom = 2.dp, top = 12.dp),
-        topContentPadding = bottomNavPaddingValues.calculateTopPadding(),
-        endContentPadding = bottomNavPaddingValues.calculateEndPadding(LocalLayoutDirection.current),
+        contentPadding = contentPadding + bottomNavPadding + PaddingValues(12.dp),
         verticalArrangement = Arrangement.spacedBy(12.dp),
         horizontalArrangement = Arrangement.spacedBy(12.dp),
         content = content,

app/src/main/java/eu/kanade/presentation/library/components/LibraryComfortableGrid.kt

@@ -2,6 +2,7 @@ package eu.kanade.presentation.library.components
 
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.lazy.grid.items
@@ -20,6 +21,7 @@ import eu.kanade.tachiyomi.ui.library.LibraryItem
 fun LibraryComfortableGrid(
     items: List<LibraryItem>,
     columns: Int,
+    contentPadding: PaddingValues,
     selection: List<LibraryManga>,
     onClick: (LibraryManga) -> Unit,
     onLongClick: (LibraryManga) -> Unit,
@@ -29,6 +31,7 @@ fun LibraryComfortableGrid(
     LazyLibraryGrid(
         modifier = Modifier.fillMaxSize(),
         columns = columns,
+        contentPadding = contentPadding,
     ) {
         globalSearchItem(searchQuery, onGlobalSearchClicked)
 

app/src/main/java/eu/kanade/presentation/library/components/LibraryCompactGrid.kt

@@ -4,6 +4,7 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxScope
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -29,6 +30,7 @@ import eu.kanade.tachiyomi.ui.library.LibraryItem
 fun LibraryCompactGrid(
     items: List<LibraryItem>,
     columns: Int,
+    contentPadding: PaddingValues,
     selection: List<LibraryManga>,
     onClick: (LibraryManga) -> Unit,
     onLongClick: (LibraryManga) -> Unit,
@@ -38,6 +40,7 @@ fun LibraryCompactGrid(
     LazyLibraryGrid(
         modifier = Modifier.fillMaxSize(),
         columns = columns,
+        contentPadding = contentPadding,
     ) {
         globalSearchItem(searchQuery, onGlobalSearchClicked)
 

app/src/main/java/eu/kanade/presentation/library/components/LibraryContent.kt

@@ -2,6 +2,8 @@ package eu.kanade.presentation.library.components
 
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.foundation.layout.calculateEndPadding
+import androidx.compose.foundation.layout.calculateStartPadding
 import androidx.compose.foundation.layout.padding
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@@ -12,6 +14,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.platform.LocalUriHandler
 import com.google.accompanist.pager.rememberPagerState
 import com.google.accompanist.swiperefresh.SwipeRefresh
@@ -50,7 +53,11 @@ fun LibraryContent(
     getLibraryForPage: @Composable (Int) -> List<LibraryItem>,
 ) {
     Column(
-        modifier = Modifier.padding(contentPadding),
+        modifier = Modifier.padding(
+            top = contentPadding.calculateTopPadding(),
+            start = contentPadding.calculateStartPadding(LocalLayoutDirection.current),
+            end = contentPadding.calculateEndPadding(LocalLayoutDirection.current),
+        ),
     ) {
         val categories = state.categories
         val coercedCurrentPage = remember { currentPage().coerceAtMost(categories.lastIndex) }
@@ -115,6 +122,7 @@ fun LibraryContent(
 
             LibraryPager(
                 state = pagerState,
+                contentPadding = PaddingValues(bottom = contentPadding.calculateBottomPadding()),
                 pageCount = categories.size,
                 selectedManga = state.selection,
                 getDisplayModeForPage = getDisplayModeForPage,

app/src/main/java/eu/kanade/presentation/library/components/LibraryCoverOnlyGrid.kt

@@ -1,6 +1,7 @@
 package eu.kanade.presentation.library.components
 
 import androidx.compose.foundation.combinedClickable
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.lazy.grid.items
 import androidx.compose.runtime.Composable
@@ -12,6 +13,7 @@ import eu.kanade.tachiyomi.ui.library.LibraryItem
 fun LibraryCoverOnlyGrid(
     items: List<LibraryItem>,
     columns: Int,
+    contentPadding: PaddingValues,
     selection: List<LibraryManga>,
     onClick: (LibraryManga) -> Unit,
     onLongClick: (LibraryManga) -> Unit,
@@ -21,6 +23,7 @@ fun LibraryCoverOnlyGrid(
     LazyLibraryGrid(
         modifier = Modifier.fillMaxSize(),
         columns = columns,
+        contentPadding = contentPadding,
     ) {
         globalSearchItem(searchQuery, onGlobalSearchClicked)
 

app/src/main/java/eu/kanade/presentation/library/components/LibraryList.kt

@@ -1,6 +1,7 @@
 package eu.kanade.presentation.library.components
 
 import androidx.compose.foundation.combinedClickable
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
 import androidx.compose.foundation.layout.fillMaxHeight
@@ -24,16 +25,18 @@ import eu.kanade.presentation.components.BadgeGroup
 import eu.kanade.presentation.components.FastScrollLazyColumn
 import eu.kanade.presentation.components.MangaCover.Square
 import eu.kanade.presentation.components.TextButton
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.horizontalPadding
+import eu.kanade.presentation.util.plus
 import eu.kanade.presentation.util.selectedBackground
 import eu.kanade.presentation.util.verticalPadding
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.ui.library.LibraryItem
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 
 @Composable
 fun LibraryList(
     items: List<LibraryItem>,
+    contentPadding: PaddingValues,
     selection: List<LibraryManga>,
     onClick: (LibraryManga) -> Unit,
     onLongClick: (LibraryManga) -> Unit,
@@ -42,7 +45,7 @@ fun LibraryList(
 ) {
     FastScrollLazyColumn(
         modifier = Modifier.fillMaxSize(),
-        contentPadding = bottomNavPaddingValues,
+        contentPadding = bottomNavPadding + contentPadding,
     ) {
         item {
             if (searchQuery.isNullOrEmpty().not()) {

app/src/main/java/eu/kanade/presentation/library/components/LibraryPager.kt

@@ -1,6 +1,7 @@
 package eu.kanade.presentation.library.components
 
 import android.content.res.Configuration
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -19,6 +20,7 @@ import eu.kanade.tachiyomi.ui.library.LibraryItem
 @Composable
 fun LibraryPager(
     state: PagerState,
+    contentPadding: PaddingValues,
     pageCount: Int,
     selectedManga: List<LibraryManga>,
     searchQuery: String?,
@@ -54,6 +56,7 @@ fun LibraryPager(
             LibraryDisplayMode.List -> {
                 LibraryList(
                     items = library,
+                    contentPadding = contentPadding,
                     selection = selectedManga,
                     onClick = onClickManga,
                     onLongClick = onLongClickManga,
@@ -65,6 +68,7 @@ fun LibraryPager(
                 LibraryCompactGrid(
                     items = library,
                     columns = columns,
+                    contentPadding = contentPadding,
                     selection = selectedManga,
                     onClick = onClickManga,
                     onLongClick = onLongClickManga,
@@ -76,6 +80,7 @@ fun LibraryPager(
                 LibraryComfortableGrid(
                     items = library,
                     columns = columns,
+                    contentPadding = contentPadding,
                     selection = selectedManga,
                     onClick = onClickManga,
                     onLongClick = onLongClickManga,
@@ -87,6 +92,7 @@ fun LibraryPager(
                 LibraryCoverOnlyGrid(
                     items = library,
                     columns = columns,
+                    contentPadding = contentPadding,
                     selection = selectedManga,
                     onClick = onClickManga,
                     onLongClick = onLongClickManga,

app/src/main/java/eu/kanade/presentation/more/MoreScreen.kt

@@ -22,12 +22,12 @@ import eu.kanade.presentation.components.Divider
 import eu.kanade.presentation.components.PreferenceRow
 import eu.kanade.presentation.components.ScrollbarLazyColumn
 import eu.kanade.presentation.components.SwitchPreference
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.quantityStringResource
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.ui.more.DownloadQueueState
 import eu.kanade.tachiyomi.ui.more.MoreController
 import eu.kanade.tachiyomi.ui.more.MorePresenter
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 
 @Composable
 fun MoreScreen(
@@ -43,7 +43,7 @@ fun MoreScreen(
 
     ScrollbarLazyColumn(
         modifier = Modifier.statusBarsPadding(),
-        contentPadding = bottomNavPaddingValues,
+        contentPadding = bottomNavPadding,
     ) {
         item {
             LogoHeader()

app/src/main/java/eu/kanade/presentation/updates/UpdatesScreen.kt

@@ -35,7 +35,6 @@ import eu.kanade.presentation.components.MangaBottomActionMenu
 import eu.kanade.presentation.components.Scaffold
 import eu.kanade.presentation.components.SwipeRefreshIndicator
 import eu.kanade.presentation.components.VerticalFastScroller
-import eu.kanade.presentation.util.bottomNavPaddingValues
 import eu.kanade.presentation.util.plus
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.data.download.model.Download
@@ -46,6 +45,7 @@ import eu.kanade.tachiyomi.ui.recent.updates.UpdatesPresenter
 import eu.kanade.tachiyomi.ui.recent.updates.UpdatesPresenter.Dialog
 import eu.kanade.tachiyomi.ui.recent.updates.UpdatesPresenter.Event
 import eu.kanade.tachiyomi.util.system.toast
+import eu.kanade.tachiyomi.widget.TachiyomiBottomNavigationView.Companion.bottomNavPadding
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.flow.collectLatest
 import kotlinx.coroutines.launch
@@ -124,12 +124,7 @@ private fun UpdateScreenContent(
     val updatesListState = rememberLazyListState()
 
     // During selection mode bottom nav is not visible
-    val contentPaddingWithNavBar = contentPadding +
-        if (presenter.selectionMode) {
-            PaddingValues()
-        } else {
-            bottomNavPaddingValues
-        }
+    val contentPaddingWithNavBar = contentPadding + bottomNavPadding
 
     val scope = rememberCoroutineScope()
     var isRefreshing by remember { mutableStateOf(false) }

app/src/main/java/eu/kanade/presentation/util/Constants.kt

@@ -10,6 +10,5 @@ val horizontalPadding = horizontal
 val verticalPadding = vertical
 
 val topPaddingValues = PaddingValues(top = vertical)
-val bottomNavPaddingValues = PaddingValues(bottom = 96.dp)
 
 const val ReadItemAlpha = .38f

app/src/main/java/eu/kanade/tachiyomi/widget/TachiyomiBottomNavigationView.kt

@@ -8,12 +8,18 @@ import android.os.Parcel
 import android.os.Parcelable
 import android.util.AttributeSet
 import android.view.ViewPropertyAnimator
+import androidx.compose.foundation.layout.PaddingValues
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.unit.dp
 import androidx.customview.view.AbsSavedState
 import androidx.interpolator.view.animation.FastOutLinearInInterpolator
 import androidx.interpolator.view.animation.LinearOutSlowInInterpolator
 import com.google.android.material.bottomnavigation.BottomNavigationView
 import eu.kanade.tachiyomi.R
 import eu.kanade.tachiyomi.util.system.applySystemAnimatorScale
+import eu.kanade.tachiyomi.util.system.pxToDp
 
 class TachiyomiBottomNavigationView @JvmOverloads constructor(
     context: Context,
@@ -50,6 +56,11 @@ class TachiyomiBottomNavigationView @JvmOverloads constructor(
         super.setTranslationY(translationY)
     }
 
+    override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
+        super.onSizeChanged(w, h, oldw, oldh)
+        bottomNavPadding = PaddingValues(bottom = h.pxToDp.dp)
+    }
+
     /**
      * Shows this view up.
      */
@@ -137,5 +148,8 @@ class TachiyomiBottomNavigationView @JvmOverloads constructor(
 
         private const val SLIDE_UP_ANIMATION_DURATION = 225L
         private const val SLIDE_DOWN_ANIMATION_DURATION = 175L
+
+        var bottomNavPadding by mutableStateOf(PaddingValues())
+            private set
     }
 }