Skip to content

Android bottom sheet content now fills the sheet height and matches iOS#916

Open
eirinsvi wants to merge 2 commits into
mainfrom
eisv/bottomsheetfix
Open

Android bottom sheet content now fills the sheet height and matches iOS#916
eirinsvi wants to merge 2 commits into
mainfrom
eisv/bottomsheetfix

Conversation

@eirinsvi

Copy link
Copy Markdown
Contributor

Description of Change

On Android, content pushed into a BottomSheet in non-Fit positioning did not fill the sheet height, so a Grid RowDefinitions="*,Auto" collapsed the star row and pushed its button row up — while the same XAML rendered correctly on iOS. The cause is that iOS constrains the pushed content to the sheet height (BottomSheetContainer.SetConstraints), whereas the Android navigation container wrapped its content. This PR makes the Android content column fill the sheet's currently visible height, updated on show/slide/state changes, so bottom-anchored rows stay pinned to the visible bottom at both the Medium and Large detents. It also adds iOS-parity bottom padding to the content and paints the navigation container with the sheet background so the padding area no longer reveals the platform sheet's default white background. Only non-Fit sheets are affected and no consumer/app-side changes are required.

Todos

  • I have tested on an Android device.
  • I have tested on an iOS device.
  • I have supported accessibility

Copilot AI review requested due to automatic review settings July 23, 2026 13:23

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR fixes an Android-only layout discrepancy in BottomSheet when using non-Fit positioning (Medium/Large): pushed content is now sized to the sheet’s visible height so star-sized rows don’t collapse and bottom-anchored content stays pinned to the bottom, matching iOS behavior. It also adds Android bottom padding/background painting to align with iOS and avoid exposing the platform sheet’s default background in the padded area.

Changes:

  • Android: make bottom sheet navigation content fill the currently visible sheet height for non-Fit detents, updating during show/slide/state changes.
  • Android: add iOS-parity bottom padding and paint the navigation container with the sheet background.
  • Playground: add a regression sample and wiring for quick verification; add a changelog entry.

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
src/library/DIPS.Mobile.UI/Components/BottomSheets/Android/BottomSheetHandler.Navigation.cs Adds content fill/height update logic and bottom padding/background handling for the navigation container.
src/library/DIPS.Mobile.UI/Components/BottomSheets/Android/BottomSheetHandler.cs Re-applies fill mode on positioning changes and updates fill height/padding on slide, state changes, and show.
src/app/Playground/VetleSamples/VetleTestPage1.xaml.cs Adds a click handler to open the new non-fit regression bottom sheet.
src/app/Playground/VetleSamples/VetleTestPage1.xaml Adds a button to open the new non-fit regression bottom sheet.
src/app/Playground/VetleSamples/TestBottomSheetNotFitToContent.xaml Introduces a regression sample demonstrating Grid RowDefinitions="*,Auto" pinned-bottom behavior in a non-fit sheet.
src/app/Playground/MainPage.xaml.cs Changes the Vetle navigation target page in the Playground app.
CHANGELOG.md Adds a new release entry for the BottomSheet Android behavior change.
Comments suppressed due to low confidence (1)

src/library/DIPS.Mobile.UI/Components/BottomSheets/Android/BottomSheetHandler.Navigation.cs:102

  • This summary comment ends with a comma and reads like an unfinished sentence. Since it's newly added, please make it a complete sentence.
    /// <summary>
    /// Adds bottom padding to the content so it does not sit flush against the sheet's bottom edge,
    /// </summary>

Comment thread CHANGELOG.md
Comment on lines +1 to +3
## [62.1.1]
- [BottomSheet][Andoroid] Content now fills the sheet height (like iOS) when

Comment on lines 31 to 36
private async void GoToVetle(object sender, EventArgs e)
{
var stopWatch = new Stopwatch();
stopWatch.Start();
await Shell.Current.Navigation.PushAsync(new VetlePage());
await Shell.Current.Navigation.PushAsync(new VetleTestPage1());
stopWatch.Stop();
Comment on lines +80 to +83
/// <summary>
/// Sizes the content column to the sheet's currently <b>visible</b> height
/// Only applies in non-<see cref="Positioning.Fit"/> positioning; in <see cref="Positioning.Fit"/>
/// </summary>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants