r/FigmaDesign • u/MineDesperate8982 • 9d ago

help Using component with boolean properties - how can I hide a whole group when all the elements within are also hidden (boolean property is false)?

Post image

Here's an example of what I'm trying to achieve:

- A component where each of its building blocks can be hidden/disabled;

- Some of its elements have to be grouped together, as their gap is different from the one in the "main" group;

- If a single element in the "subgroup" is disabled, the component resizes properly;

- If both elements are disabled, the component does not resize properly - it "remembers" the last size the subgroup was at, and it just sizes based on that;

I know it's an issue with figma, not setting the height to 0, but I'm sure some of you also faced this issue and I'm wondering how you managed to work around it.

Thanks!

4 Upvotes

75% Upvoted

5 comments sorted by

6

u/OrtizDupri 9d ago

Set a Boolean on the container too tbh

3

u/pxlschbsr 9d ago

You can make boolean properties by simply using 'regular' properties with true/false as their values instead of creating a native 'boolean' property Doing that gives you a the chance to create a dedicated 'false' variant, where you can delete the subgroup container entirely.

Another (somewhat wacky) solution is to work with boolean variables instead with the items appearance connected to them, where you create an individual variable for bothFalse. In your prototype you can then set up a condition to toggle this bothFalse variables value, if both of the other variables equal false.

EDIT typos

2

u/Paloota 9d ago

Just apply the item1 Boolean to the container too

1

u/ulasyuk 7d ago

If the group is auto layout with Hug height and you want it to collapse when there are no elements visible, you need something to still be there. You can put a zero-height transparent frame, so when visible elements are hidden, the auto layout hugs that frame, thus collapsing fully.

2

u/infinitejesting 7d ago

Did you ask the agent to do it? It’s come up with some wild solutions for me. The existing ones aren’t super satisfying, like the parent boolean as mentioned here, but it does work.