Visibility for pictures

[Gabe]

Hi,

I have a scores (1-5) and want to display a particular picture based on the score.
(The scores are stored in airtable.)

If I set up two picture like this (not nested, not touching each other), the conditional visibility works.

If the two pictures touch each other (they would need to be on top of each other), none of the two gets displayed.

Any ideas how to solve this?

It would be much appreciated. This is the only thing keeping me to get this working.

I found this in the forum but this doesnt seem to work for me:

Conditional Style of Profile Picture

Hello - I’m working on a membership based app and I’d like to have users who are paid members have a colored border around their profile picture when they are paid members (and the style update displayed across all lists etc.). Is there a way of updating the style of a profile picture based on a membership True/False – or a workaround? Any help/advice would be awesome, thanks!

[Ali-Bazzi]

Hello! Please make sure that both images do not intersect because one will be contained in the other. So please if you’d like to add images under visibility conditions, make sure to keep separated.

Thank you!

[Victor]

Hi @Gabe,

It’s a bit cumbersome but possible. In brief, you need to readjust component layout on the left pane manually and re-apply layout settings.
I’ve made a video with an example - see here: https://youtu.be/LT9jHSkGHMw (HD version still processing).

Best regards, Victor.

[Gabe]

Hi Victor,

thank you for the video, very helpful. To summarise for those who just want a quick answer:

if your items get autogrouped and you break them up, some properties will be lost that cause this. For each item, you will need to click on layout and reset it (visually it will not show that the property is lost). In my case, it was centered and scales with parent that needed to be selected.

Victor, this is much appreciated. The only thing where there is some weird inconsistency still is that the actual display of the arrows is not consistent / accurate, but the difference is just 5-10 pixels horizontally. Any ideas why this may be the case?

design view:

preview (note that second column risk arrow is not in the middle. In some other cases, another dimensions display like this. I cant figure out any pattern):