Make sure HeaderFooterPage can contents be scrolled (#4704)

Co-authored-by: ElementBot <android@element.io>
This commit is contained in:
Jorge Martin Espinosa
2025-06-02 14:28:46 +02:00
committed by GitHub
parent 2e2c40b999
commit 9dbaa2ed40
57 changed files with 153 additions and 112 deletions

View File

@@ -13,9 +13,11 @@ import androidx.compose.foundation.layout.ColumnScope
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import io.element.android.compound.theme.ElementTheme
import io.element.android.compound.tokens.generated.CompoundIcons
@@ -63,6 +65,7 @@ fun FlowStepPage(
}
},
title = {},
colors = TopAppBarDefaults.topAppBarColors(containerColor = Color.Transparent)
)
},
header = {

View File

@@ -9,12 +9,14 @@ package io.element.android.libraries.designsystem.atomic.pages
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.IntrinsicSize
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.calculateEndPadding
import androidx.compose.foundation.layout.calculateStartPadding
import androidx.compose.foundation.layout.consumeWindowInsets
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.imePadding
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
@@ -94,17 +96,19 @@ fun HeaderFooterPage(
.run {
if (isScrollable) {
verticalScroll(rememberScrollState())
// Make sure the scrollable content takes the full available height
.height(IntrinsicSize.Max)
} else {
Modifier
}
}
// Apply insets here so if the content is scrollable it can get below the top app bar if needed
.padding(contentInsetsPadding)
.weight(1f),
.weight(1f, fill = true),
) {
// Header
header()
Box(modifier = Modifier.weight(1f)) {
Box {
content()
}
}
@@ -112,7 +116,7 @@ fun HeaderFooterPage(
// Footer
Box(
modifier = Modifier
.padding(horizontal = 16.dp)
.padding(start = 16.dp, end = 16.dp, top = 16.dp)
.fillMaxWidth()
.padding(footerInsetsPadding)
) {