Some random space gets added into the layout

In my app, I have added a list with some condition, so that whenever user is using an older version of app, he’ll be notified that a new version is available. Hence, I want “App Update Available” banner to be placed above everything else as can be seen from the below screenshot :

When I preview the app, some random white space gets added below the banner and disrupts the entire UI as show below (attaching screenshot for both cases, when banner is visible and banner is not visible)

When I delete the banner, everything is working fine

What can be the issue and how to solve it ?

Hi @Nitish,

I believe this is caused by a combination of the elements, visibility conditions, and elements’ alignments (fixed to top / none).

I’ve made a quick example app for you: Quick - Visibility Example, is is cloneable. You can have a look and see how it works.

Best regards, Victor.

Hey thanks for making that @Victor

I tried deleting everything, and remaking, but it still isn’t working

Hi @Nitish,

Is it possible to share a clone version of your app to check this?

Thank you

Yes @dilon_perera please share your id, will add you

@dilon_perera I have sent an invite, please check

Check your app again! If you have opened it already give a refresh and check!

1 Like

Thanks @dilon_perera this worked.

One more additional doubt I had :
When I load the app for first time, the banner is visible for a second and then it vanishes (whenever the condition is satisfied). Mostly it takes some time to validate the condition

Can this be improved ?
The minor glitch of banner being visible, and then disappearing is a bit weird from UX standpoint

Awesome!

Maybe coming from another screen to this screen? I think Keith ( @iAppsNi ) did this in a app and maybe he could add some information about that? :slightly_smiling_face: I also saw this! Will do some tests about that!

1 Like

The app was cloneable so you could have examined the logic directly.

But I believe my help isn’t needed here anymore :slight_smile:

No Victor. It’s helpful! Learned a new thing yesterday from your app! Thanks for making that! Appreciated :muscle:

What I did to his app is setting that banner to none and group that banner and group below that banner and make that group to top. When the group below the banner is none it’s not working. I guess it’s because the banner is set to top.