Right now, tying layer visibility to a variable means if the boolean is false = layer is hidden. It’d be great if we could invert this functionality (boolean is false = layer is shown) on a per-layer basis as I need to show some layers and hide others depending on the state of the variable.
Anyone else run into this?
Yes, I’ve just encountered this too. I wanted to have a button that would show a message on click and hide a panel at the same time. I ended up instead showing a layer over the panel I wanted to hide. So basically, showing some things that hide other things. A bit klunky.
As an aside, I do find it a bit awkward having everything in variables. Things get quite abstract quite fast. So “On click, set Boolean [name] to true” and then have to keep track of what things use that Boolean. Would be nice if you had the option to have common operations like hide/show explicit if you wanted. So eg “On click, show [objectA], hide [objectB]”. Or “On mouse in, set [objectC] to [StateX]” But hey.
This feature is sorely missing - its UI could be as simple as an inversion checkbox in the boolean property editor.
The above workaround does not remove elements from a frame’s auto-layout flow the way hiding does. Inverted booleans would enable much more meaningful structural variation in components.
Could be really useful. Right now I just create two booleans for such cases. Which results in more work during interactions setup
As Daniel said above, an inversion checkbox in the boolean property editor. Please!
it works for self-rolled basic shapes and things but when I try with more complex components, unfortunately they just vanish, but for shapes and things it’s good to know, I don’t see any other solutions out there. Thanks.
It would also be useful if you could bind the layer show/hide state to an expression. Then you could set it to “not $YOUR_VARIABLE”.
The feature to invert boolean variables would be real nice. Also currently working around by having two boolean variables for each visibility usecase and just taking care where and when to use what of these. Gets confusing after a while, but works, tho.
I’ve had to do this too. Feels redundant, and adds more complexity to the prototype.
We need the ability to hide a layer when a boolean is set to true.
Also looking for this option. It would save me from making lots of redundant boolean properties or variants in my design system file.
I would make this request wider than just inverting. Why not providing the option to compare?
This way, you could do [if myVariable == true], [if myVariable == false], [if myVariable == “step1”], [if myVariable != “step1”], [if myVariable >= 3]
Please add this, it would save so much time! And I’d love to do comparison and invert in the interaction panel as well where assigning variables directly on layer visibility.
For me this exclude-trick works when presenting the prototype in a browser, but not in Figma app on mobile. Neither on Android nor iPhone.
Adding my +1 to this.
If you change the element visibility in layer panel, it will invert the boolean rule automatically
here’s a solution that creates a custom boolean:
If you change the element visibility in layer panel, it will invert the boolean rule automatically
It doesn’t invert the rule, it just toggles the value.
For anyone else trying to figure this trick out, it doesn’t work on frames.
It relies on having two identical shapes. When only one is visible, it’s shown. When both are visible, the exclude operation kicks in and hides them both.
It does work on text as long as the two layers overlap perfectly. You can use a text variable to get the exact same text within multiple text layers.
I am building a fairly complex app.
To manage the state of the panels, I rely on the Layer Visibility with booleans. I have to set up almost every booleans twice, like:
Then I need A LOT of conditional branching and twice the amount of “set variables” to achieve what I need.
A simple custom variable defined like is_EditModeInactive? = !{is_EditModeActive?} or a simple “boolean inverter” while right-clicking the “Eye” icon at the Layer level will make complex work WAY easier. Now it’s a nightmare for advanced prototypes.
