Some random space gets added into the layout

Get Help Design
1

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 :

image
image345×620 49 KB

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)

image
image996×866 52.8 KB

When I delete the banner, everything is working fine

image
image417×865 27.5 KB

What can be the issue and how to solve it ?

2

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: https://previewer.adalo.com/c65fe95a-5da5-4361-b649-2b4c3dcbde98, is is cloneable. You can have a look and see how it works.

Best regards, Victor.

3

Hey thanks for making that @Victor

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

image
image415×855 25.9 KB

4

Hi @Nitish,

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

Thank you

5

Yes @dilon_perera please share your id, will add you

6

@dilon_perera I have sent an invite, please check

7

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

1 Like
8

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

9

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
10

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

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

11

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.

12

Hi Nitish, I have the same problem. Could you tell how the issue was solved?