Merge pull request #793 from kosenda/feature/allow-content-to-be-disp…

…laye-statusbar-when-scrolling

In TimetableItemDetailScreen, variable height of statusBar when scrolling

feature/sessions/src/commonMain/kotlin/io/github/droidkaigi/confsched/sessions/component/TimetableItemDetailTopAppBar.kt

@@ -1,5 +1,11 @@
 package io.github.droidkaigi.confsched.sessions.component
 
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.consumeWindowInsets
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.statusBars
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.outlined.ArrowBack
 import androidx.compose.material.icons.outlined.GTranslate
@@ -38,8 +44,17 @@ fun TimetableItemDetailTopAppBar(
     scrollBehavior: TopAppBarScrollBehavior,
     modifier: Modifier = Modifier,
 ) {
+    // Allow content to be displayed at the statusBar when scrolling
+    val statusBarHeight = WindowInsets.statusBars.asPaddingValues().calculateTopPadding()
+    val variableTopPaddingHeight by remember(scrollBehavior.state.collapsedFraction) {
+        mutableStateOf(statusBarHeight * (1f - scrollBehavior.state.collapsedFraction))
+    }
+
     TopAppBar(
-        modifier = modifier,
+        modifier = modifier
+            .background(LocalRoomTheme.current.dimColor)
+            .padding(top = variableTopPaddingHeight)
+            .consumeWindowInsets(WindowInsets.statusBars),
         colors = TopAppBarDefaults.topAppBarColors().copy(
             containerColor = LocalRoomTheme.current.dimColor,
             scrolledContainerColor = LocalRoomTheme.current.dimColor,