Rectangle or image overlaying text?

[darren.lynch]

I have an issue, on my home screen I have a grey panel - on top of which I have some text, as shown below:

However, when I preview it - the grey panel sits over the text?

I have set the text to be on top, both using the components layers on that screen:

And via the 3 dot menu on the text group

Has anyone had this issue? I would really appreciate any help on it, as am loving Adalo (have watched most of the videos) - but have come unstuck with this on my first screen design.

[brunoribeiro]

Make a group for this rectangle. Than you can arrange it properly

[darren.lynch]

Thanks @brunoribeiro, but even making the rectangle, with text into a group and arranging the text on top - still results in the same issue?

[brunoribeiro]

It does. Make sure the rectangle is always alone inside a group in order to use the arrangement correctly. I am not sure if this is a bug or a requirement of Adalo, but for me, it only works IF an image or rectangle is positioned alone inside a group for itself.

[darren.lynch]

I just re-read your reply @brunoribeiro, I have tried the grey rectangle within its own group - yet still no luck.

I have dropped in an image also on top - to see if this is just a text issue, but nope.

[Victor]

Hi @darren.lynch,

Could you check the “Fixed” setting for the rectangle (via Edit Styles, see screenshot)?

In my experience such thing may happen if you have “Fixed” set to “Top”.

Best regards, Victor.

[darren.lynch]

Hi @Victor, thanks - I have looked and all of the elements involved are set to none

[darren.lynch]

Aha! no! sorry, the grey within it’s own group had that setting!

Thanks @Victor

[Victor]

Hi @darren.lynch,

So I assume the problem is solved?

Best,
Victor

[darren.lynch]

This has solved the layering issue yes, however now the grey panel hangs off from the top as shown below:

I managed to “fix” this by making the grey rectangle taller and overhang the top of the canvas:

Many thanks for your help guys!

It is the positioning “top” that causes the bug! Grouping doesn’t appear to be an issue

[Victor]

Hi @darren.lynch,

To my mind this behaviour (for positioning Top and Bottom) is kind of expected - these settings are used primarily for App bars and Nav bars, and these bars should stay on top of any other elements and remain on the screen not depending on scrolling.

By the way, you could try to group text+rectangle, and align it to “top”. But you have found another solution

Best regards, Victor.