iPad blank screen / layout broken โ€” how to show different layout for tablet without breaking phone?

Widgets & Design

Issue:
My app's Main Homepage was built for iPhone with fixed pixel widths. It works perfectly on phone but shows a broken layout on iPad (large black empty areas, content misaligned). Apple rejected my app because of a blank screen after login on iPad Air 11-inch M3 running iPadOS 26.5.

What I need:
A way to show a completely separate layout for iPad without touching or breaking the existing iPhone layout. Both need to work independently.

Setup:
FlutterFlow project, iOS only, Stack โ†’ Container โ†’ Column โ†’ GridView structure on the homepage.

Any help appreciated!

What have you tried so far?

What I've tried:

  • Setting Max Width to 428px on the main Container โ€” didn't fix it

  • Switching Container width from PX to % โ€” broke the phone layout

  • Using Responsive Visibility icons to hide the Container on tablet and show a simple placeholder โ€” Apple rejected saying previous version supported iPad so I can't remove iPad support

  • Tried duplicating the page and making a separate iPad version โ€” couldn't edit the duplicate independently as it's linked to the original component

  • Searched for a Responsive Layout widget โ€” couldn't find one in FlutterFlow

Did you check FlutterFlow's Documentation for this topic?
No
3
5 replies