Images overlapping in different mobile layouts.

Widgets & Design

I'm working on an onboarding screen where I use a Stack to place a PNG image (which includes a central green circle with avatars) above a button. It looks fine on some devices (like iPhone 13), but on switching to other models, the layout breaks โ€” images overlap or shift unexpectedly. Also, when I try placing a Google logo next to the "Sign up with Google" button text, the layout breaks or the logo gets cut off or misaligned when the phone layout changes.. How can I maintain a consistent layout across all screen sizes and avoid these kinds of visual issues?

What have you tried so far?

Tried placing images in containers and then placing it on top of the button, but still upon changing layout, the images exit the buttons and other logos present also get cut.

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