Hide layer using variables

Now that we have variables, it would be nice to be able to hide any layer using a boolean variable. I’m working on a prototype when the user select what parts of the content to display, and I wan to hide those elements and update what’s on the menu by checking / unchecking an element inside the prototype

  • Create a boolean variable with a ‘true’ value
  • Select the layer you want to hide, right-click the visibility icon, and choose the boolean
  • In a component, add a ‘Set variable’ interaction for the same boolean to be ‘false’ on the default variant
  • Do the same for ‘true’ on the checked variant

Your exact scenario may differ, but that’s the gist for toggling visibility via a boolean.


Oh, so that’s where it was hiding.
Thanks @IraX


You can find it under the visibility icon, that’s true. And you can even select the desired mode of your variable, but unfortunately, it currently does not work for really toggling the visibility of one’s layers.

For example, I’ve got a layer group that should be visible in light mode and another one which should be only visible in dark mode. Now, when I switch modes via page dropdown, simply nothing happens.

@IraX - thank you for the pointers!

Do you happen to know if it’s possible to set the visibility of an element to the ‘false’ state? Meaning – show the element when boolean is false?

It doesn’t seem possible at the moment.