Invisible component inside a list is still taking up space and affects alignment

[bhk]

Hi, I am creating a chatbox function and encountered the problem of alignment of text messages.

I currently put the messages in a list, with 2 separate groups
[Messages from others] & [My Messages] in 1 row

I added visibility setting to each of them respectively.

when i sent a message, the group [My message] should appear
while, the group [Messages from others] is invisible.

However, when i was testing the app, the invisible group [Messages from others] was actually taking up space, so my messages appear to be very very wide apart…

Is there any way i can prevent the invisible group from taking up space?

Actually this alignment problem happens in my other screens, but it really should not be happening in the chat function…

Thank you so much!!!

[dilon_perera]

Hi @bhk,

Welcome to the community

Did you added a visibility condition for the image component in the both groups?

Check this video which Adalo team created! : https://www.youtube.com/watch?v=f3qsZDN0aGI&pp=ygURYWRhbG8gY2hhdCBpbWFnZXM%3D

Thank you