Skip to content

Bug: Render OverFlow Error in Intro page 1 and 3 #264

@DevAnuragT

Description

@DevAnuragT

Description
When launching the application, the Onboarding screen displays a "RenderFlex overflowed by 18 pixels" error on the bottom text container. This occurs because the text description area has a fixed height constraint that doesn't accommodate the content on all screen sizes or font scalings.

Additionally, the project fails to build on modern Flutter versions (Flutter 3.x / Dart 3) due to the use of deprecated APIs (e.g., bodyText1, accentColor, uni_links).

To Reproduce
Steps to reproduce the behavior:

  1. Launch the Flood Mobile app.
  2. Land on the first Onboarding screen ("Insight").
  3. Observe the yellow and black striped error bar at the bottom of the text description area.
  4. Swipe to the next slides to see similar overflow issues.

Expected behavior
The onboarding text should render fluidly without overflow errors, adapting to the available screen space. The application should also build and run successfully on the latest stable Flutter SDK.

Device Information:

  • OS: Android / Linux (Tested on Flutter 3.35.6)

Additional context

  • The overflow was caused by a hardcoded height: 250 in lib/Components/onboarding/components/onboard_page.dart.
  • The build issues were caused by breaking changes in Dart 3 (Null Safety and Material 3 migrations).
  • uni_links was causing build failures and has been replaced with app_links.

**Are you working on this issue? (Yes/No)**Describe the bug
When launching the application, the Onboarding screen displays a "RenderFlex overflowed by 18 pixels" error on the bottom text container. This occurs because the text description area has a fixed height constraint that doesn't accommodate the content on all screen sizes or font scalings.

Additionally, the project fails to build on modern Flutter versions (Flutter 3.x / Dart 3) due to the use of deprecated APIs (e.g., bodyText1, accentColor, uni_links).

To Reproduce
Steps to reproduce the behavior:

  1. Launch the Flood Mobile app.
  2. Land on the first Onboarding screen ("Insight").
  3. Observe the yellow and black striped error bar at the bottom of the text description area.
  4. Swipe to the next slides to see similar overflow issues.

Expected behavior
The onboarding text should render fluidly without overflow errors, adapting to the available screen space. The application should also build and run successfully on the latest stable Flutter SDK.

Device Information:

  • OS: Android / Linux (Tested on Flutter 3.35.6)

Additional context

  • The overflow was caused by a hardcoded height: 250 in lib/Components/onboarding/components/onboard_page.dart.
  • The build issues were caused by breaking changes in Dart 3 (Null Safety and Material 3 migrations).
  • uni_links was causing build failures and has been replaced with app_links.

Are you working on this issue? (Yes/No)
Yes

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions