Auto-Sized, Multi-Line Title Clipped on Mobile; Corrects After User Click (Unexpected Refresh Issue)

Widgets & Design

Hello Flutterflow Community!

I'm encountering a persistent issue in my Flutterflow project where the title "STAKE REAL ESTATE SUMMIT" is being cut off on mobile devices. Specifically, the last letter "T" is not visible, and the full title only appears correctly after clicking on the "More details soon" text below it. This behavior is consistent across different mobile devices I've tested.

Project URL: www.stake.realestate


Thank you in advance for your assistance! Any insights or suggestions would be greatly appreciated.

What have you tried so far?
  • Adjusted Auto-Size Text Settings:

    • Enabled auto-size for the title text.

    • Configured Max Lines to allow text wrapping if necessary.

  • Checked Layout Constraints:

    • Ensured that the parent container has sufficient height and width.

    • Used flexible sizing properties like Expanded and Flexible to allow the container to adapt to different screen sizes.

  • Increased Padding and Adjusted Margins:

    • Added additional padding around the title text to prevent clipping.

    • Verified that no negative margins are causing the text to shrink unexpectedly.

  • Verified No Overlapping Widgets:

    • Inspected the widget hierarchy to ensure no other widgets are overlapping or interfering with the title text.

  • Disabled Auto-Size Temporarily:

    • Removed the auto-size feature to see if a fixed font size resolves the clipping. The text displays correctly without auto-size but doesn't scale well on smaller screens.

  • Cleared Cache and Rebuilt the Project:

    • Cleared browser cache and performed a full rebuild to ensure no cached data is causing the rendering issue.

Did you check FlutterFlow's Documentation for this topic?
No
1
2 replies