Skip to content

Extra space appears when using SliverAppBar with Collapsible AppBar behavior #909

@SamyKhara

Description

@SamyKhara

Has your issue been reported?

  • I have searched the existing issues and confirm it has not been reported.
  • I give permission for members of the FlutterFlow team to access and test my project for the sole purpose of investigating this issue.

Current Behavior

When using a Collapsible SliverAppBar in FlutterFlow, an extra space approximately 50-60 pixels high appears between the AppBar and the rest of the page content upon the initial load of the page. This space disappears as the page is scrolled.

The issue only appears when the application is deployed on the phone and not during "Test Mode".

c6509b2e-0c3b-4bb1-8a06-9be8c43718ab

Expected Behavior

Upon loading the page, the AppBar and the page content should be adjacent with no extra space.

Steps to Reproduce

  1. Create a new FlutterFlow app.
  2. Add an AppBar to the page.
  3. Enable the Collapsible App Bar behavior.
  4. Scroll down the page.

Screen Shot 2023-05-20 at 2 28 35 PM

Reproducible from Blank

  • The steps to reproduce above start from a blank project.

Bug Report Code (Required)

IT4kkcmAsIV2pbxY17X5bcAw9TwsJU99TLJEoOxhYzsgF5D4BKQQeczBP0xpXfazaH5IDk6LrGMd/87uhuPhVscDB0yAc7pA/pZhExPPbH6uVLaPPc28RHRtL/tXBWKF0baZvBUkNvNaWGAO7E+lfuSiZz6Cf9qOYwx5e6fDbOY=

Context

I've checked the SliverAppBar configuration and the other widgets in the page to ensure there are no settings that could be causing this extra space. I'm not using nested Scroll Views in the layout, and the issue persists regardless of the AppBar content.

Visual documentation

c6509b2e-0c3b-4bb1-8a06-9be8c43718ab

Additional Info

An extra space of 50-60 pixels appears between the AppBar and the content of the page. The space remains at the top of the page when the page is loaded and scrolls up with the page when the content is scrolled. The gap is only between the AppBar and the rest of the page at the top of the page.

The issue only appears when the application is deployed on the phone and not during "Test Mode".

Environment

- FlutterFlow version: v3.1 (3.7.12 released May 19 2023)
- Platform: Web
- Browser name and version: Chrome 113.0.5672.126
- Operating system and version affected: iOS

Metadata

Metadata

Labels

status: needs triageA potential issue that has not been confirmed as a bug.

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions